From 152f59cc952a389a30e68e9a8df5610a5d0021e3 Mon Sep 17 00:00:00 2001
From: lilia <liliakai@gmail.com>
Date: Fri, 27 Nov 2015 15:43:45 -0800
Subject: [PATCH] Restyle first run hint

// FREEBIE
---
 background.html          | 6 +++---
 js/views/hint_view.js    | 2 +-
 stylesheets/_index.scss  | 8 ++++++++
 stylesheets/manifest.css | 5 +++++
 4 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/background.html b/background.html
index da519f3b..a8d94248 100644
--- a/background.html
+++ b/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'>
diff --git a/js/views/hint_view.js b/js/views/hint_view.js
index 0319ea46..8847c5c1 100644
--- a/js/views/hint_view.js
+++ b/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',
     });
 })();
diff --git a/stylesheets/_index.scss b/stylesheets/_index.scss
index afa617ab..7fc42b74 100644
--- a/stylesheets/_index.scss
+++ b/stylesheets/_index.scss
@@ -217,3 +217,11 @@ input.search {
     }
   }
 }
+
+.conversation.placeholder {
+  p {
+    color: $grey;
+    text-align: center;
+    margin-top: 120px;
+  }
+}
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index df34ce26..b1aba90e 100644
--- a/stylesheets/manifest.css
+++ b/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;