Getting rid of flexbox changes

This commit is contained in:
Max Lynch
2013-12-03 13:28:27 -06:00
parent d514eaa323
commit d030e3317d
4 changed files with 53 additions and 103 deletions

89
dist/css/ionic.css vendored
View File

@@ -2340,29 +2340,28 @@ body, .ionic-body {
position: static;
height: 100%; }
.overflow-scroll {
overflow-x: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch; }
.overflow-scroll .scroll {
position: static;
height: 100%; }
.has-header {
top: 44px; }
.has-subheader {
top: 88px; }
.has-footer {
bottom: 44px; }
.has-tabs {
bottom: 44px; }
.pane {
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
-webkit-align-items: stretch;
-moz-align-items: stretch;
align-items: stretch;
-webkit-align-content: stretch;
-moz-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
position: absolute;
position: fixed;
top: 0;
right: 0;
bottom: 0;
@@ -2370,51 +2369,7 @@ body, .ionic-body {
z-index: 1;
width: 100%;
height: 100%;
background-color: #fff;
vertical-align: top; }
.sub-pane {
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
-webkit-align-items: stretch;
-moz-align-items: stretch;
align-items: stretch;
-webkit-align-content: stretch;
-moz-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-moz-flex: 1;
-ms-flex: 1;
flex: 1;
position: relative;
overflow: hidden; }
.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; }
background-color: #fff; }
/**
* Typography

View File

@@ -2210,8 +2210,6 @@ angular.module('ionic.ui.tabs', ['ngAnimate'])
transclude(childScope, function(clone) {
childElement = clone;
clone.addClass('sub-pane');
$animate.enter(clone, $element.parent(), $element);
if($scope.title) {

View File

@@ -152,8 +152,6 @@ angular.module('ionic.ui.tabs', ['ngAnimate'])
transclude(childScope, function(clone) {
childElement = clone;
clone.addClass('sub-pane');
$animate.enter(clone, $element.parent(), $element);
if($scope.title) {

View File

@@ -158,14 +158,39 @@ body, .ionic-body {
}
.overflow-scroll {
overflow-x: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
.scroll {
position: static;
height: 100%;
}
}
// Pad top/bottom of content so it doesn't hide behind .bar-title and .bar-tab.
// Note: For these to work, content must come after both bars in the markup
.has-header {
top: $bar-height;
}
.has-subheader {
top: $bar-height * 2;
}
.has-footer {
bottom: $bar-height;
}
// Specify that a content area will have tabs
.has-tabs {
bottom: 44px;
}
// A full screen section with a solid background
.pane {
@include flex-direction(column);
@include display-flex();
@include align-items(stretch);
@include align-content(stretch);
position: absolute;
position: fixed;
top: 0;
right: 0;
bottom: 0;
@@ -174,30 +199,4 @@ body, .ionic-body {
width: 100%;
height: 100%;
background-color: #fff;
vertical-align: top;
}
//
// A sub container that uses flexbox but fills the remaining size of any pane.
//
.sub-pane {
@include flex-direction(column);
@include display-flex();
@include align-items(stretch);
@include align-content(stretch);
@include flex(1);
position: relative;
overflow: hidden;
}
.page {
display: block;
position: relative;
overflow: hidden;
width: auto;
@include flex(1);
}