Restyle first run hint

// FREEBIE

background.html

@@ -22,11 +22,11 @@
           <div class='new-contact contact hide'></div>
         </div>
     </div>
-    <div class='conversation-stack'></div>
+    <div class='conversation-stack'>
+    </div>
   </script>
   <script type='text/x-tmpl-mustache' id='hint'>
-      <h3>Start here</h3>
-      <p>Search your groups and contacts by name or phone number.</p>
+      <p> Select a contact to start chatting. </p>
   </script>
   <script type='text/x-tmpl-mustache' id='conversation'>
     <div class='panel'>

js/views/hint_view.js

@@ -6,7 +6,7 @@
     window.Whisper = window.Whisper || {};
 
     Whisper.HintView = Whisper.View.extend({
-        className: 'firstRun hint',
+        className: 'conversation placeholder',
         templateName: 'hint',
     });
 })();

stylesheets/_index.scss

@@ -217,3 +217,11 @@ input.search {
     }
   }
 }
+
+.conversation.placeholder {
+  p {
+    color: $grey;
+    text-align: center;
+    margin-top: 120px;
+  }
+}

stylesheets/manifest.css

@@ -536,6 +536,11 @@ input.search {
       border-color: transparent #2eace0 transparent transparent;
       left: -30px; }
 
+.conversation.placeholder p {
+  color: #616161;
+  text-align: center;
+  margin-top: 120px; }
+
 .conversation {
   background-color: #ffffff;
   margin: 10px;