Skip to content

Commit

Permalink
fix(scss): make tabs,header,footer aligned right with statusbar
Browse files Browse the repository at this point in the history
Addresses #943

Before: we offset the has-header and other classes by 20px if a status
bar existed.

After: we simply offset the body by 20px if a status bar exists. This
makes the other classes automatically offset themselves.
  • Loading branch information
ajoslin committed Mar 31, 2014
1 parent 58de267 commit c2a38a6
Showing 1 changed file with 6 additions and 45 deletions.
51 changes: 6 additions & 45 deletions scss/_platform.scss
Original file line number Diff line number Diff line change
Expand Up @@ -5,54 +5,15 @@
* Platform specific tweaks when in Cordova.
*/

.platform-ios7.platform-cordova:not(.fullscreen) {
.platform-ios7.platform-cordova {
// iOS7 has a status bar which sits on top of the header.
// Bump down everything to make room for it. However, if
// if its in Cordova, and set to fullscreen, then disregard the bump.

.bar-header {
height: 64px;

&.item-input-inset .item-input-wrapper {
margin-top: 19px !important;
}

> * {
margin-top: 20px;
}
}

.has-header,
.bar-subheader {
top: 64px;
&:not(.fullscreen) {
margin-top: 20px;
}

.has-subheader {
top: 108px;
}
}

.platform-ios7.status-bar-hide {
// Cordova doesn't adjust the body height correctly, this makes up for it
margin-bottom: 20px;
}

.platform-android.platform-cordova {

.bar-header {
height: 48px;
}

.has-header,
.bar-subheader {
top: 48px;
}

.has-subheader {
top: 96px;
}

.title {
line-height: 48px;
&.status-bar-hide {
// Cordova doesn't adjust the body height correctly, this makes up for it
margin-bottom: 20px;
}
}

0 comments on commit c2a38a6

Please sign in to comment.