Files
ionic-framework/scss/ionic/_scaffolding.scss
2013-09-18 13:23:56 -05:00

95 lines
1.8 KiB
SCSS

// TODO: This might be inefficient?
// Make sure iOS Safari doesn't scale fonts on orientation changes
html {
@include user-select(none);
-webkit-text-size-adjust: 100%;
}
body {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
margin: 0;
padding: 0;
word-wrap: break-word;
font-size: 14px;
font-family: $base-font-family;
line-height: 1.25;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: none;
text-size-adjust: none;
-webkit-tap-highlight-color: transparent;
-webkit-overflow-scrolling: touch;
}
.view {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.content {
position: fixed;
right: 0;
bottom: 0;
left: 0;
overflow: auto;
// TODO: Fix the dynamic content height issue
//height: 100%;
}
/* Hack to force all relatively and absolutely positioned elements still render while scrolling
Note: This is a bug for "-webkit-overflow-scrolling: touch" (via ratchet) */
.content > *, .content-padded > * {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
.content-padded {
padding: $content-padding;
}
// 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-footer {
bottom: $bar-height;
}
// Specify that a content area will have tabs
.has-tabs {
bottom: $tabs-height;
}
.inset {
margin: $inset-margin;
}
.rounded {
border-radius: $border-radius-base;
}
.page, .full-section {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
overflow: auto;
width: 100%;
height: 100%;
background-color: #fff;
-webkit-overflow-scrolling: touch;
}