Give the app UI a maximum width for better readability

Fixes #125.
pull/129/head
Thibaut 10 years ago
parent 9adba7774c
commit eabd270a94

@ -1,9 +1,12 @@
._app { ._app {
position: relative; position: relative;
z-index: 1; z-index: 1;
max-width: 80rem;
height: 100%; height: 100%;
padding-top: $headerHeight; padding-top: $headerHeight;
overflow: hidden; overflow: hidden;
background: white;
box-shadow: 1px 0 #c4c9cc, 1px 0 1px rgba(black, .15);
-webkit-transition: opacity .2s; -webkit-transition: opacity .2s;
transition: opacity .2s; transition: opacity .2s;
@extend %border-box; @extend %border-box;
@ -26,7 +29,7 @@
line-height: 1; line-height: 1;
margin-top: -.75em; margin-top: -.75em;
font-size: 4rem; font-size: 4rem;
color: #ccc; color: #c8c8c8;
text-align: center; text-align: center;
letter-spacing: -.125rem; letter-spacing: -.125rem;
opacity: 0; opacity: 0;

@ -4,6 +4,7 @@
._mobile { ._mobile {
font-size: 100%; font-size: 100%;
background: white;
// Layout // Layout
@ -11,6 +12,11 @@
._app, ._container, ._content { overflow: visible; } ._app, ._container, ._content { overflow: visible; }
._app {
max-width: none;
box-shadow: none;
}
._container { ._container {
margin: 0; margin: 0;
border: 0; border: 0;

@ -1,7 +1,7 @@
html { html {
height: 100%; height: 100%;
font-size: 100%; font-size: 100%;
background: white; background: #fafafa;
@media #{$mediumScreen} { font-size: 93.75%; } @media #{$mediumScreen} { font-size: 93.75%; }
} }

Loading…
Cancel
Save