javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 03:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

md toolbar css

Browse Source
This commit is contained in:
Adam Bradley
2015-07-22 14:38:17 -05:00
parent 0bf46d70b9
commit d67ba6f7c1
5 changed files with 21 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
ionic/components/icon/icon.ts
View File

@ -58,16 +58,18 @@ Custom Font Icon
],
host: {
'[attr.aria-label]': 'label',
'role': 'img',
'[className]': 'className'
'role': 'img'
}
})
export class IconDirective {
constructor(elementRef: ElementRef) {
this.ele = elementRef.nativeElement;
}
onInit() {
let name = this.name || this.iconName;
if (name) {
this.className = name;
this.label = name.replace('ion-', '').replace('ios-', '').replace('md-', '').replace('-', '');
if (this.name) {
this.ele.classList.add(this.name);
this.label = this.name.replace('ion-', '').replace('ios-', '').replace('md-', '').replace('-', '');
}
}
}

6
ionic/components/nav-bar/extensions/ios.scss
View File

@ -21,14 +21,10 @@ $navbar-ios-border-color: #c4c4c4 !default;
order: map-get($toolbar-order-ios, 'back-button');
overflow: inherit;
icon {
padding-right: 8px;
}
}
.back-button-icon {
padding-right: 0.6rem;
padding-right: 8px;
}
}

6
ionic/components/nav-bar/extensions/material.scss
View File

@ -12,14 +12,16 @@ $navbar-material-height: 5.6rem !default;
.navbar[mode="md"] {
.back-button {
margin: 0;
padding: 0;
margin: 0 0 0 12px;
box-shadow: none;
}
.back-button-icon {
margin: 0;
font-weight: normal;
font-size: 2.4rem;
min-width: 5.6rem;
min-width: 44px;
text-align: left;
}

2
ionic/components/toolbar/extensions/material.scss
View File

@ -9,7 +9,7 @@ $toolbar-material-button-font-size: 1.8rem !default;
.toolbar[mode="md"] {
.toolbar-inner-title {
padding: 0px 11px;
padding: 0px 12px;
}
ion-title {

14
ionic/components/toolbar/test/scenarios/main.html
View File

@ -5,25 +5,25 @@
<ion-toolbar><ion-title>This is the title that never ends. It just goes on and on my friend.</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button>Pri. Item</button></ion-nav-items><ion-title>Title</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button>Pri. Item</button></ion-nav-items><ion-title>Primary Only</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items secondary><button>Sec. Item</button></ion-nav-items><ion-title>Title</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items secondary><button>Sec. Item</button></ion-nav-items><ion-title>Secondary Only</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button><icon name="ion-navicon"></icon></button><button><icon name="ion-heart"></icon></button></ion-nav-items><ion-nav-items secondary><button><icon name="ion-ionic"></icon></button></ion-nav-items><ion-title>Title</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button><icon name="ion-navicon"></icon></button><button><icon name="ion-heart"></icon></button></ion-nav-items><ion-nav-items secondary><button><icon name="ion-ionic"></icon></button></ion-nav-items><ion-title>Defaults</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button clear primary><icon name="ion-navicon"></icon>Menu</button></ion-nav-items><ion-title>Title</ion-title><ion-nav-items secondary><button clear secondary><icon name="ion-help-circled"></icon>Help</button></ion-nav-items></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button clear primary><icon name="ion-navicon"></icon>Menu</button></ion-nav-items><ion-title>Button Clear</ion-title><ion-nav-items secondary><button clear secondary><icon name="ion-help-circled"></icon>Help</button></ion-nav-items></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary outline><icon name="ion-navicon"></icon></button primary><button primary outline><icon name="ion-star"></icon></button></ion-nav-items><ion-nav-items secondary><button secondary outline><icon name="ion-flag"></icon></button></ion-nav-items><ion-title>Title</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary outline><icon name="ion-navicon"></icon></button primary><button primary outline><icon name="ion-star"></icon></button></ion-nav-items><ion-nav-items secondary><button secondary outline><icon name="ion-flag"></icon></button></ion-nav-items><ion-title>Button Outline</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary>Btn</button></ion-nav-items><ion-title>Title</ion-title><ion-nav-items secondary><button secondary>Btn</button><button secondary>Btn</button><button secondary>Btn</button></ion-nav-items></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary>Btn</button></ion-nav-items><ion-nav-items secondary><button secondary>Btn</button></ion-nav-items><ion-title>Added Color Attr</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary><icon name="ion-navicon"></icon>Menu</button></ion-nav-items><ion-nav-items secondary><button primary><icon name="ion-help-circled"></icon>Help</button></ion-nav-items><ion-title>Title</ion-title></ion-toolbar>
<ion-toolbar><ion-nav-items primary><button primary><icon name="ion-navicon"></icon>Menu</button></ion-nav-items><ion-nav-items secondary><button primary><icon name="ion-help-circled"></icon>Help</button></ion-nav-items><ion-title>Icon/Color Attr</ion-title></ion-toolbar>