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

iOS title centering improvements wip

Browse Source
This commit is contained in:
Adam Bradley
2015-09-15 16:14:08 -05:00
parent 6bcf1e112d
commit fc89e86c83
3 changed files with 34 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
ionic/components/menu/test/basic/page1.html
View File

@ -9,6 +9,18 @@
Menu Menu
</ion-title> </ion-title>
<ion-nav-items secondary>
<button>
<icon football></icon>
</button>
</ion-nav-items>
<ion-nav-items primary>
<button>
<icon baseball></icon>
</button>
</ion-nav-items>
</ion-navbar> </ion-navbar>

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

@ -6,7 +6,6 @@ $toolbar-order-ios: (
back-button: 10, back-button: 10,
menu-toggle: 20, menu-toggle: 20,
primary: 30, primary: 30,
title: 40,
secondary: 50 secondary: 50
); );
@ -22,14 +21,23 @@ $toolbar-ios-title-font-size: 1.7rem !default;
min-height: $toolbar-ios-height; min-height: $toolbar-ios-height;
.toolbar-title { .toolbar-title {
order: map-get($toolbar-order-ios, title); position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0px 72px;
pointer-events: none;
} }
.toolbar-primary-item { .toolbar-primary-item {
flex: 1;
order: map-get($toolbar-order-ios, primary); order: map-get($toolbar-order-ios, primary);
} }
.toolbar-secondary-item { .toolbar-secondary-item {
flex: 1;
text-align: right;
order: map-get($toolbar-order-ios, secondary); order: map-get($toolbar-order-ios, secondary);
} }
@ -42,7 +50,7 @@ $toolbar-ios-title-font-size: 1.7rem !default;
font-size: $toolbar-ios-title-font-size; font-size: $toolbar-ios-title-font-size;
font-weight: 500; font-weight: 500;
text-align: center; text-align: center;
margin-top: -2px; pointer-events: auto;
} }
.back-button { .back-button {

22
ionic/components/toolbar/toolbar.ts
View File

@ -52,17 +52,17 @@ export class ToolbarBase extends Ion {
} }
afterViewChecked() { afterViewChecked() {
if (this._queueAlign) { // if (this._queueAlign) {
this._queueAlign = false; // this._queueAlign = false;
this._alignTitle(); // this._alignTitle();
} // }
} }
/** /**
* TODO * TODO
*/ */
alignTitle() { alignTitle() {
this._queueAlign = (this.titleAlign === 'center'); //this._queueAlign = (this.titleAlign === 'center');
} }
_alignTitle() { _alignTitle() {
@ -139,14 +139,14 @@ export class Toolbar extends ToolbarBase {
super.onInit(); super.onInit();
// TODO: THIS IS HORRIBLE, FIX // TODO: THIS IS HORRIBLE, FIX
setTimeout(() => { // setTimeout(() => {
this.alignTitle(); // this.alignTitle();
setTimeout(() => { // setTimeout(() => {
this.alignTitle() // this.alignTitle()
}, 64); // }, 64);
}, 32); // }, 32);
} }
} }