fix modal title centering

This commit is contained in:
Adam Bradley
2015-07-30 14:06:42 -05:00
parent b38f9d17a8
commit 6286c7ac0a
7 changed files with 33 additions and 29 deletions

View File

@@ -2,34 +2,34 @@
// Material Design Button
// --------------------------------------------------
$button-material-font-size: 1.4rem !default;
$button-material-min-height: 3.6rem !default;
$button-material-padding: 0 1.6rem !default;
$button-material-box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12),0 1px 1px 0 rgba(0, 0, 0, 0.24);//0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
$button-material-box-shadow-active: 0 4px 5px 0 rgba(0, 0, 0, 0.14),0 1px 10px 0 rgba(0, 0, 0, 0.12),0 2px 4px -1px rgba(0, 0, 0, 0.2); //0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
$button-material-border-radius: 3px !default;
$button-md-font-size: 1.4rem !default;
$button-md-min-height: 3.6rem !default;
$button-md-padding: 0 1.6rem !default;
$button-md-box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12),0 1px 1px 0 rgba(0, 0, 0, 0.24);//0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
$button-md-box-shadow-active: 0 4px 5px 0 rgba(0, 0, 0, 0.14),0 1px 10px 0 rgba(0, 0, 0, 0.12),0 2px 4px -1px rgba(0, 0, 0, 0.2); //0 1px 3px 0 rgba(0, 0, 0, 0.3); //0 2px 5px 0 rgba(0, 0, 0, 0.26) !default;
$button-md-border-radius: 3px !default;
[mode="md"] button,
[mode="md"] [button] {
border: 0;
border-radius: $button-material-border-radius;
border-radius: $button-md-border-radius;
min-height: $button-material-min-height;
min-height: $button-md-min-height;
padding: $button-material-padding;
padding: $button-md-padding;
text-transform: uppercase;
font-weight: 500;
font-size: $button-material-font-size;
box-shadow: $button-material-box-shadow;
font-size: $button-md-font-size;
box-shadow: $button-md-box-shadow;
transition: box-shadow 0.2s $animation-curve-fast-out-linear-in,
background-color 0.2s $animation-curve-default,
color 0.2s $animation-curve-default;
&.activated {
box-shadow: $button-material-box-shadow-active;
box-shadow: $button-md-box-shadow-active;
}
&[icon] {

View File

@@ -5,11 +5,11 @@
$navbar-ios-height: 4.4rem !default;
.nav[mode="ios"] .navbar-container {
min-height: $navbar-ios-height;
}
.nav[mode="ios"] {
.navbar[mode="ios"] {
.navbar-container {
min-height: $navbar-ios-height;
}
.back-button {
padding: 0;

View File

@@ -2,14 +2,14 @@
// Material Design Navbar
// --------------------------------------------------
$navbar-material-height: 5.6rem !default;
$navbar-md-height: 5.6rem !default;
.nav[mode="md"] .navbar-container {
min-height: $navbar-material-height;
}
.nav[mode="md"] {
.navbar[mode="md"] {
.navbar-container {
min-height: $navbar-md-height;
}
.back-button {
padding: 0;

View File

@@ -20,8 +20,8 @@ import {ViewItem} from '../view/view-item';
<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>
<span class="back-default" [text-content]="bbDefault"></span>
<span class="back-title" [text-content]="bbText"></span>
</span>
</button>
<div class="toolbar-title">

View File

@@ -110,7 +110,8 @@ export class OverlayRef {
_open(opts={}) {
return new Promise(resolve => {
this._instance.viewWillEnter && this._instance.viewWillEnter();
let instance = this._instance || {};
instance.viewWillEnter && instance.viewWillEnter();
let animationName = (opts && opts.animation) || this._opts.enterAnimation;
let animation = Animation.create(this._elementRef.nativeElement, animationName);
@@ -122,7 +123,7 @@ export class OverlayRef {
animation.play().then(() => {
ClickBlock(false);
animation.dispose();
this._instance.viewDidEnter && this._instance.viewDidEnter();
instance.viewDidEnter && instance.viewDidEnter();
resolve();
});
}).catch(err => {
@@ -132,8 +133,9 @@ export class OverlayRef {
close(opts={}) {
return new Promise(resolve => {
this._instance.viewWillLeave && this._instance.viewWillLeave();
this._instance.viewWillUnload && this._instance.viewWillUnload();
let instance = this._instance || {};
instance.viewWillLeave && instance.viewWillLeave();
instance.viewWillUnload && instance.viewWillUnload();
let animationName = (opts && opts.animation) || this._opts.leaveAnimation;
let animation = Animation.create(this._elementRef.nativeElement, animationName);
@@ -142,8 +144,8 @@ export class OverlayRef {
ClickBlock(true, animation.duration() + 200);
animation.play().then(() => {
this._instance.viewDidLeave && this._instance.viewDidLeave();
this._instance.viewDidUnload && this._instance.viewDidUnload();
instance.viewDidLeave && instance.viewDidLeave();
instance.viewDidUnload && instance.viewDidUnload();
this._dispose();

View File

@@ -15,6 +15,7 @@ $toolbar-ios-button-font-size: 1.7rem !default;
$toolbar-ios-title-font-size: 1.7rem !default;
.nav[mode="ios"] .toolbar,
.toolbar[mode="ios"] {
border-bottom: 1px solid $toolbar-ios-border-color;
min-height: $toolbar-ios-height;

View File

@@ -7,6 +7,7 @@ $toolbar-md-title-font-size: 2rem !default;
$toolbar-md-button-font-size: 1.4rem !default;
.nav[mode="md"] .toolbar,
.toolbar[mode="md"] {
min-height: $toolbar-md-height;