Flexbox tweaks

dist/css/ionic.css

@@ -2245,6 +2245,7 @@ body, .ionic-body {
   height: 100%; }
 
 .scroll-content {
+  display: block;
   position: relative;
   overflow: hidden;
   width: auto;
@@ -2364,6 +2365,18 @@ body, .ionic-body {
   background-color: #fff;
   vertical-align: top; }
 
+.page {
+  display: block;
+  position: relative;
+  overflow: hidden;
+  width: auto;
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -moz-box-flex: 1;
+  -moz-flex: 1;
+  -ms-flex: 1;
+  flex: 1; }
+
 /**
  * Typography
  * --------------------------------------------------

dist/js/ionic-angular.js

@@ -1670,7 +1670,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
     scope: true,
     require: '^navRouter',
     link: function($scope, $element, $attr, navCtrl) {
-      $element.addClass('pane');
+      $element.addClass('page');
 
       $scope.icon = $attr.icon;
       $scope.iconOn = $attr.iconOn;

js/ext/angular/src/directive/ionicNavRouter.js

@@ -307,7 +307,7 @@ angular.module('ionic.ui.navRouter', ['ionic.service.gesture'])
     scope: true,
     require: '^navRouter',
     link: function($scope, $element, $attr, navCtrl) {
-      $element.addClass('pane');
+      $element.addClass('page');
 
       $scope.icon = $attr.icon;
       $scope.iconOn = $attr.iconOn;

js/ext/angular/test/navRouter.html

@@ -21,7 +21,7 @@
     </pane>
 
     <script id="page1.html" type="text/ng-template">
-      <nav-page title="'Bears'">
+      <nav-page title="'Bears'" hide-back-button="true">
         <h1>Page 1</h1>
         <span>{{num}}</span>
         <a class="button button-pure" nav-back>Back</a>

scss/_scaffolding.scss

@@ -59,6 +59,8 @@ body, .ionic-body {
 }
 
 .scroll-content {
+  display: block;
+
   position: relative;
   overflow: hidden;
 
@@ -159,3 +161,13 @@ body, .ionic-body {
   vertical-align: top;
 
 }
+
+.page {
+  display: block;
+
+  position: relative;
+  overflow: hidden;
+
+  width: auto;
+  @include flex(1);
+}