Adding sass variables for footer, subfooter and subheader heights

Allowing to footers and subheader with diferent height.

FIX #2334
This commit is contained in:
Arturo
2014-11-28 16:00:57 -03:00
parent ff055d6f6d
commit ffd6ed6376
5 changed files with 20 additions and 12 deletions

View File

@@ -333,6 +333,8 @@
border-bottom-width: 0;
background-position: top;
height: $bar-footer-height;
&.item-input-inset {
position: absolute;
}
@@ -346,10 +348,14 @@
.bar-subheader {
top: $bar-height;
display: block;
height: $bar-subheader-height;
}
.bar-subfooter {
bottom: $bar-height;
bottom: $bar-footer-height;
display: block;
height: $bar-subfooter-height;
}
.nav-bar-block {
@@ -365,4 +371,3 @@
.bar .buttons .hide {
display: none;
}

View File

@@ -65,13 +65,13 @@
top: $bar-height;
}
.has-subheader {
top: (2 * $bar-height);
top: $bar-height + $bar-subheader-height;
}
.has-tabs-top {
top: $bar-height + $tabs-height;
}
.has-header.has-subheader.has-tabs-top {
top: 2 * $bar-height + $tabs-height;
top: $bar-height + $bar-subheader-height + $tabs-height;
}
}
}

View File

@@ -31,13 +31,13 @@
top: $bar-height + $ios-statusbar-height;
}
.has-subheader {
top: (2 * $bar-height) + $ios-statusbar-height;
top: $bar-height + $bar-subheader-height + $ios-statusbar-height;
}
.has-tabs-top {
top: $bar-height + $tabs-height + $ios-statusbar-height;
}
.has-header.has-subheader.has-tabs-top {
top: 2 * $bar-height + $tabs-height + $ios-statusbar-height;
top: $bar-height + $bar-subheader-height + $tabs-height + $ios-statusbar-height;
}
}
&.status-bar-hide {
@@ -57,4 +57,3 @@
-webkit-transition: none !important;
transition: none !important;
}

View File

@@ -311,20 +311,20 @@ ion-infinite-scroll {
}
.has-subheader {
top: $bar-height * 2;
top: $bar-height + $bar-subheader-height;
}
.has-tabs-top {
top: $bar-height + $tabs-height;
}
.has-header.has-subheader.has-tabs-top {
top: 2 * $bar-height + $tabs-height;
top: $bar-height + $bar-subheader-height + $tabs-height;
}
.has-footer {
bottom: $bar-height;
bottom: $bar-footer-height;
}
.has-subfooter {
bottom: $bar-height * 2;
bottom: $bar-footer-height + $bar-subfooter-height;
}
.has-tabs,
@@ -333,7 +333,7 @@ ion-infinite-scroll {
}
.has-footer.has-tabs {
bottom: $tabs-height + $bar-height;
bottom: $tabs-height + $bar-footer-height;
}
// A full screen section with a solid background

View File

@@ -162,6 +162,10 @@ $bar-padding-portrait: 5px !default;
$bar-padding-landscape: 5px !default;
$bar-transparency: 1 !default;
$bar-footer-height: 44px !default;
$bar-subheader-height: 44px !default;
$bar-subfooter-height: 44px !default;
$bar-light-bg: rgba($button-light-bg, $bar-transparency) !default;
$bar-light-text: $button-light-text !default;
$bar-light-border: $button-light-border !default;