Refactor title bar text style

index.html

@@ -16,7 +16,7 @@
         <div class='title-bar' id='header'>
           <div class='back'>
             <button></button>
-            <span>New Message</span>
+            <span class='title-text'>New Message</span>
           </div>
         </div>
         <div class='notifications'>

stylesheets/_global.scss

@@ -35,6 +35,14 @@ body {
   color: $blue;
 }
 
+.title-text {
+  display: block;
+  text-align: center;
+  height: $header-height;
+  line-height: $header-height;
+  font-family: $roboto-light;
+}
+
 .menu {
   position: relative;
   float: right;

stylesheets/_index.scss

@@ -31,18 +31,13 @@ input.new-message {
   text-align: center;
   button {
     float: left;
-    width: 36px;
-    height: 36px;
+    width: $header-height;
+    height: $header-height;
     background: $header-color url('/images/back.png') no-repeat center center;
   }
 
   span {
-    display: inline-block;
-    height: 36px;
-    line-height: 36px;
-    font-family: $roboto-light;
-    color: $blue;
-    text-indent: -36px;
+    text-indent: -$header-height;
   }
 }
 

stylesheets/manifest.css

@@ -45,6 +45,13 @@ body {
   box-shadow: 0 -4px 3px 4px rgba(165, 165, 165, 0.8);
   color: #2a92e7; }
 
+.title-text {
+  display: block;
+  text-align: center;
+  height: 36px;
+  line-height: 36px;
+  font-family: Roboto-Light, "Helvetica Neue", Arial, Helvetica, sans-serif; }
+
 .menu {
   position: relative;
   float: right;
@@ -134,11 +141,6 @@ input.new-message {
     height: 36px;
     background: #f2f2f2 url("/images/back.png") no-repeat center center; }
   .back span {
-    display: inline-block;
-    height: 36px;
-    line-height: 36px;
-    font-family: Roboto-Light, "Helvetica Neue", Arial, Helvetica, sans-serif;
-    color: #2a92e7;
     text-indent: -36px; }
 
 .new-conversation .new-group-update-form {