mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Adding sass variables for footer, subfooter and subheader heights
Allowing to footers and subheader with diferent height. FIX #2334
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user