From eabd270a9420eee8c6aeff0a9b060a12045063b0 Mon Sep 17 00:00:00 2001
From: Thibaut <thibaut@me.com>
Date: Sun, 12 Oct 2014 10:50:35 -0400
Subject: [PATCH] Give the app UI a maximum width for better readability

Fixes #125.
---
 assets/stylesheets/components/_app.scss    | 5 ++++-
 assets/stylesheets/components/_mobile.scss | 6 ++++++
 assets/stylesheets/global/_base.scss       | 2 +-
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/assets/stylesheets/components/_app.scss b/assets/stylesheets/components/_app.scss
index ccc7011b..92816176 100644
--- a/assets/stylesheets/components/_app.scss
+++ b/assets/stylesheets/components/_app.scss
@@ -1,9 +1,12 @@
 ._app {
   position: relative;
   z-index: 1;
+  max-width: 80rem;
   height: 100%;
   padding-top: $headerHeight;
   overflow: hidden;
+  background: white;
+  box-shadow: 1px 0 #c4c9cc, 1px 0 1px rgba(black, .15);
   -webkit-transition: opacity .2s;
           transition: opacity .2s;
   @extend %border-box;
@@ -26,7 +29,7 @@
     line-height: 1;
     margin-top: -.75em;
     font-size: 4rem;
-    color: #ccc;
+    color: #c8c8c8;
     text-align: center;
     letter-spacing: -.125rem;
     opacity: 0;
diff --git a/assets/stylesheets/components/_mobile.scss b/assets/stylesheets/components/_mobile.scss
index 13c64315..57e05e65 100644
--- a/assets/stylesheets/components/_mobile.scss
+++ b/assets/stylesheets/components/_mobile.scss
@@ -4,6 +4,7 @@
 
 ._mobile {
   font-size: 100%;
+  background: white;
 
   // Layout
 
@@ -11,6 +12,11 @@
 
   ._app, ._container, ._content { overflow: visible; }
 
+  ._app {
+    max-width: none;
+    box-shadow: none;
+  }
+
   ._container {
     margin: 0;
     border: 0;
diff --git a/assets/stylesheets/global/_base.scss b/assets/stylesheets/global/_base.scss
index e0d31628..ae2eadd7 100644
--- a/assets/stylesheets/global/_base.scss
+++ b/assets/stylesheets/global/_base.scss
@@ -1,7 +1,7 @@
 html {
   height: 100%;
   font-size: 100%;
-  background: white;
+  background: #fafafa;
 
   @media #{$mediumScreen} { font-size: 93.75%; }
 }