diff --git a/src/components/app/_scaffolding.scss b/src/components/app/_scaffolding.scss index b0f3f12cb8..b831a460e3 100644 --- a/src/components/app/_scaffolding.scss +++ b/src/components/app/_scaffolding.scss @@ -15,6 +15,22 @@ html { .nav-viewport { position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + } + + .nav-viewport.tab { + position: relative; + } + + .nav-view { + position: absolute; + top: 0; + left: 0; width: 100%; height: 100%; } @@ -29,6 +45,14 @@ html { @include flex(1); } + .view-cover { + height: 100vh !important; + + .tab-bar { + z-index: 1 + } + } + .pane > .pane-container { position: relative; overflow: hidden; diff --git a/src/components/nav-view/nav-view.scss b/src/components/nav-view/nav-view.scss index 2c4344ba97..0cf4492168 100644 --- a/src/components/nav-view/nav-view.scss +++ b/src/components/nav-view/nav-view.scss @@ -3,13 +3,8 @@ $transition-duration: 1000ms; .nav-view { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - display: none; + &.shown { display: block; } diff --git a/src/components/tabs/tabs.js b/src/components/tabs/tabs.js index 53af21df4d..29f35ffa00 100644 --- a/src/components/tabs/tabs.js +++ b/src/components/tabs/tabs.js @@ -1,4 +1,4 @@ -import {NgElement, Component, Template, Parent, For} from 'angular2/angular2' +import {NgElement, Component, Template, For} from 'angular2/angular2' import {IonicComponent} from 'ionic2/config/component' @Component({ @@ -19,14 +19,15 @@ import {IonicComponent} from 'ionic2/config/component' class="tab-bar-item" [class.tab-active]="tab.isSelected" (^click)="onClickTabItem($event, tab)"> - + {{tab.title}} -
- -
+ `, directives: [For] }) diff --git a/src/components/tabs/test/advanced/pages/tabs.js b/src/components/tabs/test/advanced/pages/tabs.js index d6840c9fa8..58ea96a980 100644 --- a/src/components/tabs/test/advanced/pages/tabs.js +++ b/src/components/tabs/test/advanced/pages/tabs.js @@ -97,7 +97,7 @@ class Tab2Page1 { Left aside for Tab 2 Page 2 - +