javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(toolbar): make iOS toolbar closer to native

Browse Source 
aligned title and back button, increased font size of back icon,
removed color shade from toolbar buttons, increased font weight of
title, changed primary color, reduced back button text letter spacing.

Fixes #5149
This commit is contained in:
Brandy Carney
2016-01-22 14:14:33 -05:00
parent a8e7941a27
commit 706832f031
3 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
ionic/components/toolbar/toolbar.ios.scss
View File

@@ -61,7 +61,8 @@ ion-navbar-section {
.toolbar-title {
font-size: $toolbar-ios-title-font-size;
font-weight: 500;
font-weight: 600;
margin-top: 1px;
text-align: center;
pointer-events: auto;
color: $toolbar-ios-text-color;
@@ -134,12 +135,12 @@ ion-buttons[right] {
@mixin ios-bar-button-default($color-name, $color-value) {
.bar-button-#{$color-name} {
$fg-color: color-shade($color-value);
$fg-color: $color-value;
color: $fg-color;
background-color: transparent;
&:hover:not(.disable-hover) {
color: color-shade($fg-color);
color: $fg-color;
}
&.activated {
@@ -256,6 +257,7 @@ ion-buttons[right] {
.back-button {
margin: 0;
margin-top: 2px;
min-height: 3.2rem;
line-height: 1;
order: map-get($toolbar-order-ios, back-button);
@@ -267,7 +269,11 @@ ion-buttons[right] {
display: inherit;
margin: 0;
min-width: 18px;
font-size: 3.2rem;
font-size: 3.3rem;
}
.back-button-text {
letter-spacing: -0.01em;
}

4
ionic/components/toolbar/toolbar.md.scss
View File

@@ -136,12 +136,12 @@ ion-buttons[right] {
@mixin md-bar-button-default($color-name, $color-value) {
.bar-button-#{$color-name} {
$fg-color: color-shade($color-value);
$fg-color: $color-value;
color: $fg-color;
background-color: transparent;
&:hover:not(.disable-hover) {
color: color-shade($fg-color);
color: $fg-color;
}
}

2
ionic/themes/default.scss
View File

@@ -4,7 +4,7 @@
$colors: (
primary: #387ef5,
primary: #327eff,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,