back button updates

This commit is contained in:
Adam Bradley
2015-07-20 16:19:45 -05:00
parent 0dfd091eef
commit e30cfed8d4
5 changed files with 35 additions and 18 deletions

View File

@ -68,11 +68,13 @@ export class IconDirective {
onInit() {
if (this.name) {
this.ele.classList.add(this.name);
this.label = this.name;
this.label = this.name.replace('ion-', '').replace('ios-', '').replace('md-', '').replace('-', '');
}
}
}
@IonicComponent({
selector: 'ion-icon',
properties: [

View File

@ -9,8 +9,8 @@ $navbar-order-material: (
secondary: 40
);
$navbar-material-height: 6.4rem !default;
$navbar-material-background: get-color(primary, base) !default;//#f7f7f8 !default;
$navbar-material-height: 5.6rem !default;
$navbar-material-background: get-color(primary, base) !default;
$navbar-material-title-font-size: 2rem !default;
$navbar-material-button-font-size: 24px !default;
@ -22,7 +22,7 @@ $navbar-material-button-text-color: #fff !default; //#007aff !default;
background: $navbar-material-background;
.toolbar-inner-title {
padding: 0px 16px;
padding: 0;
}
.toolbar-inner {
@ -57,7 +57,6 @@ $navbar-material-button-text-color: #fff !default; //#007aff !default;
border: none;
box-shadow: none;
padding: 0;
margin: 0 10px;
@ -65,4 +64,16 @@ $navbar-material-button-text-color: #fff !default; //#007aff !default;
min-width: 0;
}
.back-button {
margin: 0;
}
.back-button-icon {
margin: 0;
font-weight: normal;
font-size: 24px;
min-width: 56px;
text-align: left;
}
}

View File

@ -43,15 +43,13 @@
@each $color, $value in $colors {
.navbar[#{$color}] {
background-color: get-color($color, base);
background-color: get-color($color, base);
ion-title {
color: white;
}
button,
[button] {
color: white;
}
ion-title,
button,
[button] {
color: get-color($color, inverse);
}
}
}

View File

@ -15,8 +15,8 @@ import * as dom from '../../util/dom';
@IonicView({
template: `
<div class="toolbar-inner">
<button class="back-button button">
<icon class="back-button-icon ion-ios-arrow-back"></icon>
<button class="back-button">
<icon class="back-button-icon" [name]="bbClass"></icon>
<span class="back-button-text">
<span class="back-default" [inner-text]="bbDefault"></span>
<span class="back-title" [inner-text]="bbText"></span>
@ -43,15 +43,16 @@ import * as dom from '../../util/dom';
]
})
export class Navbar extends Ion {
constructor(item: ViewItem, elementRef: ElementRef, ionicConfig: IonicConfig, app: IonicApp) {
super(elementRef, ionicConfig);
constructor(item: ViewItem, elementRef: ElementRef, config: IonicConfig, app: IonicApp) {
super(elementRef, config);
this.app = app;
this.eleRef = elementRef;
this.itemEles = [];
item.navbarView(this);
this.bbDefault = 'Back';
this.bbClass = config.setting('backButtonIcon');
this.bbDefault = config.setting('backButtonText');
this.bbText = '';
}