From 1aa975e199c66f4f2629d55e065ba9e42e6bc99c Mon Sep 17 00:00:00 2001
From: lilia <liliakai@gmail.com>
Date: Fri, 1 Apr 2016 11:04:20 -0700
Subject: [PATCH] Differentiate active vs selected conversation states

// FREEBIE
---
 js/views/inbox_view.js   | 4 ++--
 stylesheets/_global.scss | 6 ++++--
 stylesheets/manifest.css | 8 +++++---
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/js/views/inbox_view.js b/js/views/inbox_view.js
index abb9e789e..384ed7552 100644
--- a/js/views/inbox_view.js
+++ b/js/views/inbox_view.js
@@ -119,12 +119,12 @@
                 return;
             }
 
-            this.$('#header').addClass('inactive');
+            this.$('#header, .gutter').addClass('inactive');
             this.$('.conversation-stack').removeClass('inactive');
         },
         focusHeader: function() {
             this.$('.conversation-stack').addClass('inactive');
-            this.$('#header').removeClass('inactive');
+            this.$('#header, .gutter').removeClass('inactive');
             this.$('.conversation:first .menu').trigger('close');
         },
         reloadBackgroundPage: function() {
diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss
index 2333baf8e..18b48a848 100644
--- a/stylesheets/_global.scss
+++ b/stylesheets/_global.scss
@@ -291,6 +291,10 @@ $avatar-size: 44px;
     border: solid 1px rgba(255,255,255,0.6);
   }
 }
+.inactive .contact.selected {
+  padding-left: 7px;
+  border-left: 5px solid $blue;
+}
 .contact {
   position: relative;
   padding: 12px;
@@ -301,8 +305,6 @@ $avatar-size: 44px;
 
   &.selected {
     background: rgb(236, 243, 252);
-    padding-left: 7px;
-    border-left: 5px solid $blue;
   }
 
   &:first-child {
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index dcfd7f2df..3e6a2aea1 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -243,6 +243,10 @@ img.emoji {
     color: white;
     border: solid 1px rgba(255, 255, 255, 0.6); }
 
+.inactive .contact.selected {
+  padding-left: 7px;
+  border-left: 5px solid #2090ea; }
+
 .contact {
   position: relative;
   padding: 12px;
@@ -251,9 +255,7 @@ img.emoji {
   background: rgba(255, 255, 255, 0.6);
   margin: 1px; }
   .contact.selected {
-    background: #ecf3fc;
-    padding-left: 7px;
-    border-left: 5px solid #2090ea; }
+    background: #ecf3fc; }
   .contact:first-child {
     margin-top: 0; }
   .contact:last-child::after {