Add avatars to conversation headers

So as not to look repetitive, hide the per-message avatars in one-on-one
conversations.

// FREEBIE

background.html

@@ -42,6 +42,7 @@
                 <li><a class='destroy'>Delete messages</a></li>
             </ul>
           </div>
+          {{> avatar }}
           <span class='conversation-title'>{{ title }}</span>
       </div>
 

js/views/conversation_view.js

@@ -17,7 +17,8 @@
         render_attributes: function() {
             return {
                 group: this.model.get('type') === 'group',
-                title: this.model.getTitle()
+                title: this.model.getTitle(),
+                avatar: this.model.getAvatar()
             };
         },
         initialize: function(options) {
@@ -246,7 +247,7 @@
             $discussionContainer.outerHeight(
                     this.$el.outerHeight() -
                     $bottomBarNewHeight -
-                    $conversationHeader.outerHeight() - 20);
+                    $conversationHeader.outerHeight() - 40);
 
             this.view.scrollToBottomIfNeeded();
         },

stylesheets/_conversation.scss

@@ -1,7 +1,7 @@
 .conversation {
   background-color: #ffffff;
   margin: 10px;
-  padding: 10px;
+  padding: 20px;
   border-radius: 10px;
 
   .panel {
@@ -176,6 +176,7 @@
   .container { height: calc(100% - #{$header-height} - 85px); }
 }
 
+.private .entry .avatar,
 .private .sender,
 .outgoing .sender {
   display: none;

stylesheets/_index.scss

@@ -67,6 +67,13 @@
 .conversation-header {
   border-bottom: solid 1px darken($grey_l, 10%);
   margin-bottom: 4px;
+  .avatar {
+    float: left;
+    width: 70px;
+    height: 70px;
+    line-height: 70px;
+    font-size: x-large;
+  }
 }
 .menu.conversation-menu {
   button.drop-down {

stylesheets/manifest.css

@@ -454,6 +454,12 @@ img.emoji {
 .conversation-header {
   border-bottom: solid 1px #d9d9d9;
   margin-bottom: 4px; }
+  .conversation-header .avatar {
+    float: left;
+    width: 70px;
+    height: 70px;
+    line-height: 70px;
+    font-size: x-large; }
 
 .menu.conversation-menu button.drop-down {
   background: url("/images/arrow_drop_down.png") no-repeat center; }
@@ -539,7 +545,7 @@ input.search {
 .conversation {
   background-color: #ffffff;
   margin: 10px;
-  padding: 10px;
+  padding: 20px;
   border-radius: 10px; }
   .conversation .panel {
     height: 100%; }
@@ -661,6 +667,7 @@ input.search {
 .new-group-update .container {
   height: calc(100% - 36px - 85px); }
 
+.private .entry .avatar,
 .private .sender,
 .outgoing .sender {
   display: none; }