Differentiate active vs selected conversation states

// FREEBIE

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() {

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 {

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 {