mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
iOS toolbar css
This commit is contained in:
@ -15,18 +15,16 @@ $navbar-ios-border-color: #c4c4c4 !default;
|
||||
|
||||
.navbar[mode="ios"] {
|
||||
|
||||
button,
|
||||
[button] {
|
||||
padding: 0;
|
||||
margin: 0 1rem;
|
||||
|
||||
min-height: $navbar-ios-height;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.back-button {
|
||||
padding: 0;
|
||||
margin: 0 4px;
|
||||
|
||||
order: map-get($toolbar-order-ios, 'back-button');
|
||||
overflow: inherit;
|
||||
|
||||
icon {
|
||||
padding-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.back-button-icon {
|
||||
|
@ -9,7 +9,7 @@ $toolbar-material-button-font-size: 1.8rem !default;
|
||||
.toolbar[mode="md"] {
|
||||
|
||||
.toolbar-inner-title {
|
||||
padding: 0px 16px;
|
||||
padding: 0px 11px;
|
||||
}
|
||||
|
||||
ion-title {
|
||||
|
@ -11,16 +11,16 @@
|
||||
<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 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><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 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 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 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 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><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>
|
||||
|
@ -21,7 +21,7 @@ $toolbar-title-text-color: #000 !default;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 4.4rem;
|
||||
padding: 5px;
|
||||
padding: 4px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
Reference in New Issue
Block a user