diff --git a/ionic/components/button/button.ios.scss b/ionic/components/button/button.ios.scss index 934b244f58c..a1ccaf15152 100644 --- a/ionic/components/button/button.ios.scss +++ b/ionic/components/button/button.ios.scss @@ -97,7 +97,6 @@ $button-ios-small-icon-font-size: 1.3em !default; margin-right: 0; } - // iOS Full Button // -------------------------------------------------- @@ -105,11 +104,10 @@ $button-ios-small-icon-font-size: 1.3em !default; margin-right: 0; margin-left: 0; border-radius: 0; - border-left: none; - border-right: none; + border-right-width: 0; + border-left-width: 0; } - // iOS Outline Button // -------------------------------------------------- diff --git a/ionic/components/button/button.md.scss b/ionic/components/button/button.md.scss index d49f12a52c6..6d9ac3fe11d 100644 --- a/ionic/components/button/button.md.scss +++ b/ionic/components/button/button.md.scss @@ -110,28 +110,25 @@ $button-md-small-icon-font-size: 1.4em !default; font-size: $button-md-small-icon-font-size; } - -// Material Design Full Button +// Material Design Block Button // -------------------------------------------------- -.button-full { - border-radius: 0; - margin-right: 0; +.button-block { margin-left: 0; - border-right-width: 0; - border-left-width: 0; + margin-right: 0; } - -// Material Design Block Button +// Material Design Full Button // -------------------------------------------------- -.button-block { +.button-full { margin-right: 0; margin-left: 0; + border-radius: 0; + border-right-width: 0; + border-left-width: 0; } - // Material Design Outline Button // -------------------------------------------------- diff --git a/ionic/components/button/button.scss b/ionic/components/button/button.scss index 3b26fc0234c..33f18fd4225 100644 --- a/ionic/components/button/button.scss +++ b/ionic/components/button/button.scss @@ -29,17 +29,18 @@ $button-round-border-radius: 64px !default; @include appearance(none); } -span.button-inner { - width: 100%; - height: 100%; - display: flex; - flex-shrink: 0; - flex-flow: row nowrap; - align-items: center; - justify-content: center; +.button-inner { + width: 100%; + height: 100%; + + display: flex; + flex-shrink: 0; + flex-flow: row nowrap; + align-items: center; + justify-content: center; } -a.button { +a.button, a[button] { text-decoration: none; } @@ -54,7 +55,7 @@ a.button { // -------------------------------------------------- .button-block { - display: flex; + display: block; clear: both; width: 100%; @@ -68,6 +69,7 @@ a.button { // -------------------------------------------------- .button-full { + display: block; width: 100%; } diff --git a/ionic/components/nav/test/basic/index.ts b/ionic/components/nav/test/basic/index.ts index c45476d72a8..f75bb8a2bb9 100644 --- a/ionic/components/nav/test/basic/index.ts +++ b/ionic/components/nav/test/basic/index.ts @@ -20,7 +20,7 @@ class MyCmpTest{} - + @@ -74,7 +74,7 @@ class FirstPage { setPages() { let items = [ - {page: PrimaryHeaderPage} + { page: PrimaryHeaderPage } ]; this.nav.setPages(items); @@ -89,7 +89,7 @@ class FirstPage { } pushFullPage() { - this.nav.push(FullPage, { id: 8675309, myData: [1,2,3,4] } ); + this.nav.push(FullPage, { id: 8675309, myData: [1, 2, 3, 4] }); } pushAnother() { @@ -139,8 +139,8 @@ class FullPage { setPages() { let items = [ - {page: FirstPage}, - {page: PrimaryHeaderPage} + { page: FirstPage }, + { page: PrimaryHeaderPage } ]; this.nav.setPages(items); @@ -190,6 +190,9 @@ class FullPage { template: ` Primary Color Page Header + + +

@@ -218,7 +221,7 @@ class PrimaryHeaderPage { } pushFullPage() { - this.nav.push(FullPage, { id: 8675309, myData: [1,2,3,4] } ); + this.nav.push(FullPage, { id: 8675309, myData: [1, 2, 3, 4] }); } insert() { diff --git a/ionic/components/nav/test/insert-views/index.ts b/ionic/components/nav/test/insert-views/index.ts index eabc724299a..f27dc027e9c 100644 --- a/ionic/components/nav/test/insert-views/index.ts +++ b/ionic/components/nav/test/insert-views/index.ts @@ -9,14 +9,14 @@ import {App, Page, NavController} from 'ionic/ionic'; - `, }) class FirstPage { constructor(nav: NavController) { this.nav = nav; } - pushPage(){ + pushPage() { this.nav.push(SecondPage) } } @@ -30,7 +30,7 @@ class FirstPage {

Second page

-
` }) @@ -38,7 +38,7 @@ class SecondPage { constructor(nav: NavController) { this.nav = nav; } - insertPage(){ + insertPage() { this.nav.insert(1, InsertPage) } } @@ -55,7 +55,7 @@ class SecondPage { ` }) class InsertPage { - constructor() {} + constructor() { } } diff --git a/ionic/components/navbar/navbar.ts b/ionic/components/navbar/navbar.ts index ff5ce24c911..c225df3cfa4 100644 --- a/ionic/components/navbar/navbar.ts +++ b/ionic/components/navbar/navbar.ts @@ -94,9 +94,11 @@ class ToolbarBackground { template: '
' + '' + '' + diff --git a/ionic/components/toolbar/test/scenarios/main.html b/ionic/components/toolbar/test/scenarios/main.html index 66a5faf63e4..be6f13db2c3 100644 --- a/ionic/components/toolbar/test/scenarios/main.html +++ b/ionic/components/toolbar/test/scenarios/main.html @@ -1,4 +1,3 @@ - This is the title that never ends. It just goes on and on my friend. @@ -62,9 +61,9 @@ - + - + Icon/Color Attr + + + + + + + Edit + + + Text Only + + - + + + Right side menu toggle - + Something - + Else @@ -178,13 +190,13 @@ - + Light - + Toolbar - + Default Segment @@ -195,4 +207,4 @@ .toolbar { border-bottom: 1px solid black; } - + \ No newline at end of file diff --git a/ionic/components/toolbar/toolbar-button.scss b/ionic/components/toolbar/toolbar-button.scss index 9f14aa5fc32..6532b060700 100644 --- a/ionic/components/toolbar/toolbar-button.scss +++ b/ionic/components/toolbar/toolbar-button.scss @@ -5,11 +5,7 @@ .bar-button { position: relative; - display: inline-flex; - flex-shrink: 0; - flex-flow: row nowrap; - align-items: center; - justify-content: center; + display: inline-block; margin: 0; padding: 0; @@ -19,6 +15,7 @@ text-align: center; text-transform: none; + line-height: 1; vertical-align: top; // the better option for most scenarios vertical-align: -webkit-baseline-middle; // the best for those that support it @@ -54,7 +51,7 @@ .back-button { display: none; &.show-back-button { - display: flex; + display: inline-block; } } diff --git a/ionic/components/toolbar/toolbar.ios.scss b/ionic/components/toolbar/toolbar.ios.scss index 50c96fa9ce8..9e32bdde952 100644 --- a/ionic/components/toolbar/toolbar.ios.scss +++ b/ionic/components/toolbar/toolbar.ios.scss @@ -62,7 +62,6 @@ ion-navbar-section { .toolbar-title { font-size: $toolbar-ios-title-font-size; font-weight: 600; - margin-top: 1px; text-align: center; pointer-events: auto; color: $toolbar-ios-text-color; @@ -123,10 +122,8 @@ ion-buttons[right] { // -------------------------------------------------- .bar-button { - margin-top: 0; - margin-bottom: 0; padding: 0 5px; - min-height: 32px; + height: 32px; border: 0; font-size: $toolbar-ios-button-font-size; border-radius: $bar-button-ios-border-radius; @@ -225,7 +222,6 @@ ion-buttons[right] { // -------------------------------------------------- .bar-button-icon-left ion-icon { - margin-left: -0.1em; padding-right: 0.3em; font-size: 1.4em; line-height: 0.67; @@ -257,7 +253,6 @@ 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); @@ -268,8 +263,9 @@ ion-buttons[right] { .back-button-icon { display: inherit; margin: 0; + margin-top: -1px; min-width: 18px; - font-size: 3.3rem; + font-size: 3.4rem; } .back-button-text { diff --git a/ionic/components/toolbar/toolbar.md.scss b/ionic/components/toolbar/toolbar.md.scss index 59b75ce7059..4e3b02bb658 100644 --- a/ionic/components/toolbar/toolbar.md.scss +++ b/ionic/components/toolbar/toolbar.md.scss @@ -125,7 +125,7 @@ ion-buttons[right] { margin-left: 0.2rem; margin-right: 0.2rem; padding: 0 5px; - min-height: 32px; + height: 32px; border: 0; font-size: $toolbar-md-button-font-size; border-radius: $bar-button-md-border-radius; @@ -226,7 +226,6 @@ ion-buttons[right] { // -------------------------------------------------- .bar-button-icon-left ion-icon { - margin-left: -0.1em; padding-right: 0.3em; font-size: 1.4em; line-height: 0.67; diff --git a/ionic/components/toolbar/toolbar.ts b/ionic/components/toolbar/toolbar.ts index 09a711e29b1..6de072e823c 100644 --- a/ionic/components/toolbar/toolbar.ts +++ b/ionic/components/toolbar/toolbar.ts @@ -9,7 +9,7 @@ import {Button} from '../button/button'; /** * @private */ -export class ToolbarBase extends Ion { +export class ToolbarBase extends Ion { itemRefs = []; titleRef = null; titleCmp: any; @@ -155,9 +155,9 @@ export class ToolbarTitle extends Ion { toolbar && toolbar.setTitleCmp(this); navbar && navbar.setTitleCmp(this); } -/** - * @private - */ + /** + * @private + */ getTitleText() { return this.getNativeElement().textContent; }