mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 03:32:21 +08:00
rename(sections): .navbar-container now ion-navbar-section
This commit is contained in:
@ -2,10 +2,10 @@
|
||||
</ion-nav>
|
||||
|
||||
<style>
|
||||
.navbar-container {
|
||||
ion-navbar-section {
|
||||
background-color: #ff6600 !important;
|
||||
}
|
||||
.md .nav ion-title {
|
||||
.md ion-title {
|
||||
color: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<ion-nav [root]="root"></ion-nav>
|
||||
|
||||
<style>
|
||||
.md .navbar-container {
|
||||
.md ion-navbar-section {
|
||||
background-color: #2FD9BB !important;
|
||||
}
|
||||
.md .navbar-title {
|
||||
|
@ -8,8 +8,8 @@ $z-index-menu-backdrop: 79;
|
||||
$z-index-overlay: 1000;
|
||||
$z-index-click-block: 9999;
|
||||
|
||||
$z-index-content-container: 5;
|
||||
$z-index-navbar-container: 10;
|
||||
$z-index-content-section: 5;
|
||||
$z-index-navbar-section: 10;
|
||||
|
||||
$z-index-content: 5;
|
||||
$z-index-toolbar: 10;
|
||||
@ -131,19 +131,19 @@ ion-view {
|
||||
}
|
||||
}
|
||||
|
||||
[no-navbar] > .navbar-container {
|
||||
[no-navbar] > ion-navbar-section {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-container {
|
||||
ion-navbar-section {
|
||||
position: relative;
|
||||
min-height: 4.4rem;
|
||||
z-index: $z-index-navbar-container;
|
||||
z-index: $z-index-navbar-section;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
ion-content-section {
|
||||
position: relative;
|
||||
z-index: $z-index-content-container;
|
||||
z-index: $z-index-content-section;
|
||||
flex: 1;
|
||||
order: $flex-order-view-content;
|
||||
}
|
||||
|
@ -5,6 +5,6 @@
|
||||
$navbar-ios-height: 4.4rem !default;
|
||||
|
||||
|
||||
.navbar-container {
|
||||
ion-navbar-section {
|
||||
min-height: $navbar-ios-height;
|
||||
}
|
||||
|
@ -5,7 +5,7 @@
|
||||
$navbar-md-height: 5.6rem !default;
|
||||
|
||||
|
||||
.navbar-container {
|
||||
ion-navbar-section {
|
||||
min-height: $navbar-md-height;
|
||||
}
|
||||
|
||||
|
@ -399,12 +399,12 @@ class ContentAnchor {
|
||||
@Component({
|
||||
selector: 'ion-pane',
|
||||
template:
|
||||
'<section class="navbar-container">' +
|
||||
'<ion-navbar-section>' +
|
||||
'<template navbar-anchor></template>' +
|
||||
'</section>' +
|
||||
'<section class="content-container">' +
|
||||
'</ion-navbar-section>' +
|
||||
'<ion-content-section>' +
|
||||
'<template content-anchor></template>' +
|
||||
'</section>',
|
||||
'</ion-content-section>',
|
||||
directives: [NavBarAnchor, ContentAnchor]
|
||||
})
|
||||
class Pane {
|
||||
|
@ -42,16 +42,16 @@ ion-tab {
|
||||
}
|
||||
}
|
||||
|
||||
ion-tabs > .navbar-container {
|
||||
ion-tabs > ion-navbar-section {
|
||||
order: $flex-order-tab-bar-navbar;
|
||||
}
|
||||
|
||||
.tab-bar-container {
|
||||
ion-tab-bar-section {
|
||||
position: relative;
|
||||
order: $flex-order-tab-bar-bottom;
|
||||
}
|
||||
|
||||
[tab-bar-placement=top] .tab-bar-container {
|
||||
[tab-bar-placement=top] ion-tab-bar-section {
|
||||
order: $flex-order-tab-bar-top;
|
||||
}
|
||||
|
||||
|
@ -67,10 +67,10 @@ import * as dom from 'ionic/util/dom';
|
||||
'tabBarIcons': 'top'
|
||||
},
|
||||
template:
|
||||
'<section class="navbar-container">' +
|
||||
'<ion-navbar-section>' +
|
||||
'<template navbar-anchor></template>' +
|
||||
'</section>' +
|
||||
'<nav class="tab-bar-container">' +
|
||||
'</ion-navbar-section>' +
|
||||
'<ion-tab-bar-section>' +
|
||||
'<tab-bar role="tablist">' +
|
||||
'<a *ng-for="#t of tabs" [tab]="t" class="tab-button" role="tab">' +
|
||||
'<icon [name]="t.tabIcon" [is-active]="t.isSelected" class="tab-button-icon"></icon>' +
|
||||
@ -78,10 +78,10 @@ import * as dom from 'ionic/util/dom';
|
||||
'</a>' +
|
||||
'<tab-highlight></tab-highlight>' +
|
||||
'</tab-bar>' +
|
||||
'</nav>' +
|
||||
'<section class="content-container">' +
|
||||
'</ion-tab-bar-section>' +
|
||||
'<ion-content-section>' +
|
||||
'<ng-content></ng-content>' +
|
||||
'</section>',
|
||||
'</ion-content-section>',
|
||||
directives: [
|
||||
Icon,
|
||||
NgFor,
|
||||
|
@ -46,6 +46,8 @@ ion-input.has-focus [text-input] {
|
||||
|
||||
ion-input input[scroll-assist] {
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
pointer-events: none;
|
||||
|
@ -378,7 +378,7 @@ export class TextInputElement {
|
||||
}
|
||||
|
||||
labelledBy(val) {
|
||||
val && this.renderer.setElementAttribute(this.elementRef, 'aria-labelledby', val);
|
||||
this.renderer.setElementAttribute(this.elementRef, 'aria-labelledby', val);
|
||||
}
|
||||
|
||||
setFocus() {
|
||||
|
@ -7,7 +7,7 @@
|
||||
|
||||
// iOS Cordova
|
||||
// ------------
|
||||
&.platform-ios .navbar-container,
|
||||
&.platform-ios ion-navbar-section,
|
||||
&.platform-ios ion-navbar,
|
||||
&.platform-ios ion-menu > ion-toolbar {
|
||||
min-height: 64px;
|
||||
|
@ -64,7 +64,7 @@ class MaterialTransition extends Transition {
|
||||
|
||||
let viewLength = nav.length();
|
||||
if (nav.tabs && (viewLength === 1 || viewLength === 2)) {
|
||||
let tabBarEle = nav.tabs.elementRef.nativeElement.querySelector('.tab-bar-container');
|
||||
let tabBarEle = nav.tabs.elementRef.nativeElement.querySelector('ion-tab-bar-section');
|
||||
let tabBar = new Animation(tabBarEle);
|
||||
|
||||
if (viewLength === 1 && opts.direction == 'back') {
|
||||
|
@ -11,7 +11,7 @@ exports.config = {
|
||||
specs: 'dist/e2e/**/*e2e.js',
|
||||
//specs: 'dist/e2e/tabs/**/*e2e.js',
|
||||
|
||||
sleepBetweenSpecs: 900,
|
||||
sleepBetweenSpecs: 600,
|
||||
|
||||
platformDefauls: {
|
||||
browser: 'chrome',
|
||||
|
Reference in New Issue
Block a user