First version to show (raw) email bodies.

Made xwebmail work with new handlers package.
Pulls important headers from the database and provides extremely basic folder
view on webpage.
Reverted layout customizations returning folder view to original wider width.
JS App now handles all the rendering, index.html only contains placeholder
with background to indicate loading.

static/css/layouts/email.css

@@ -2,11 +2,23 @@
  * -- BASE STYLES --
  * Most of these are inherited from Base, but I want to change a few.
  */
-body {
-    color: #333;
+html {
+    height: 100%;
 }
 
+#content.loading {
+    background-image: url('/img/email-icon.jpg');
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    height: 100%;
+    width: 100%;
+}
 
+body {
+    color: #333;
+    height: 100%;
+}
 
 a {
     text-decoration: none;
@@ -122,6 +134,7 @@ a {
     color: rgb(75, 113, 151);
 }
 
+.email-label,
 .email-label-personal,
 .email-label-work,
 .email-label-travel {
@@ -131,6 +144,9 @@ a {
     margin-right: 0.5em;
     border-radius: 3px;
 }
+.email-label {
+    background: #888;
+}
 .email-label-personal {
     background: #ffc94c;
 }
@@ -188,7 +204,7 @@ a {
             margin: 0;
             font-weight: normal;
         }
-            .email-content-subtitle span {
+            .email-content-subtitle span.date {
                 color: #999;
             }
     .email-content-controls {
@@ -228,7 +244,7 @@ a {
     }
     #nav {
         margin-left:-500px; /* "left col (nav + list)" width */
-        width: 220px;
+        width:150px;
         height: 100%;
     }
 
@@ -244,7 +260,7 @@ a {
     }
 
     #list {
-        margin-left: -280px;
+        margin-left: -350px;
         width: 100%;
         height: 33%;
         border-bottom: 1px solid #ddd;
@@ -255,7 +271,7 @@ a {
         top: 33%;
         right: 0;
         bottom: 0;
-        left: 220px;
+        left: 150px;
         overflow: auto;
         width: auto; /* so that it's not 100% */
     }
@@ -271,8 +287,8 @@ a {
 
     /* This will take up the entire height, and be a little thinner */
     #list {
-        margin-left: -280px;
-        width: 280px;
+        margin-left: -350px;
+        width:350px;
         height: 100%;
         border-right: 1px solid #ddd;
     }