feat(statusbarPadding): add statusbar-padding css to toolbars

This commit is contained in:
Adam Bradley
2016-04-14 12:00:51 -05:00
parent 55389998de
commit 44403d1d87
4 changed files with 16 additions and 10 deletions

View File

@ -108,7 +108,8 @@ class ToolbarBackground {
'</div>',
host: {
'[hidden]': '_hidden',
'class': 'toolbar'
'class': 'toolbar',
'[class.statusbar-padding]': '_sbPadding'
},
directives: [BackButton, BackButtonText, Icon, ToolbarBackground]
})
@ -120,6 +121,7 @@ export class Navbar extends ToolbarBase {
private _bbRef: ElementRef;
private _bbtRef: ElementRef;
private _bgRef: ElementRef;
private _sbPadding: boolean;
/**
* @input {boolean} whether the back button should be shown or not
@ -145,6 +147,7 @@ export class Navbar extends ToolbarBase {
this._bbIcon = config.get('backButtonIcon');
this._bbText = config.get('backButtonText');
this._sbPadding = config.getBoolean('statusbarPadding', false);
}
/**

View File

@ -135,7 +135,7 @@ import {isBlank, isTrueProperty} from '../../util/util';
@Component({
selector: 'ion-tabs',
template:
'<ion-navbar-section>' +
'<ion-navbar-section [class.statusbar-padding]="_sbPadding">' +
'<template navbar-anchor></template>' +
'</ion-navbar-section>' +
'<ion-tabbar-section>' +
@ -167,6 +167,7 @@ export class Tabs extends Ion {
private _preloadTabs: boolean = null;
private _tabs: Array<Tab> = [];
private _onReady = null;
private _sbPadding: boolean;
private _useHighlight: boolean;
/**
@ -238,6 +239,7 @@ export class Tabs extends Ion {
this.id = ++tabIds;
this.subPages = _config.getBoolean('tabSubPages');
this._useHighlight = _config.getBoolean('tabbarHighlight');
this._sbPadding = _config.getBoolean('statusbarPadding', false);
if (parent) {
// this Tabs has a parent Nav

View File

@ -1,9 +1,10 @@
import {Component, Directive, Host, ElementRef, Optional, forwardRef, Inject, ContentChildren, ContentChild, QueryList, ChangeDetectionStrategy, ViewEncapsulation} from 'angular2/core';
import {Button} from '../button/button';
import {Config} from '../../config/config';
import {Ion} from '../ion';
import {MenuToggle} from '../menu/menu-toggle';
import {Navbar} from '../navbar/navbar';
import {Button} from '../button/button';
/**
@ -108,14 +109,17 @@ export class ToolbarBase extends Ion {
'<ng-content></ng-content>' +
'</div>',
host: {
'class': 'toolbar'
'class': 'toolbar',
'[class.statusbar-padding]': '_sbPadding'
},
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class Toolbar extends ToolbarBase {
private _sbPadding: boolean;
constructor(elementRef: ElementRef) {
constructor(elementRef: ElementRef, config: Config) {
super(elementRef);
this._sbPadding = config.getBoolean('statusbarPadding', false);
}
}

View File

@ -101,14 +101,11 @@ Platform.register({
keyboardHeight: 300,
mode: 'ios',
scrollAssist: isIOSDevice,
statusbarPadding: !!(win.cordova),
swipeBackEnabled: isIOSDevice,
swipeBackThreshold: 40,
tapPolyfill: isIOSDevice,
virtualScrollEventAssist: function() {
// UIWebView needs help getting scroll events
// WKWebView does not (WKWebView supports indexDB)
return !(window.indexedDB);
}
virtualScrollEventAssist: !(window.indexedDB)
},
isMatch(p: Platform): boolean {
return p.isPlatformMatch('ios', ['iphone', 'ipad', 'ipod'], ['windows phone']);