Display gray # instead of colored + for no-name contacts

For consistency with android.

background.html

@@ -95,7 +95,7 @@
       </div>
   </script>
   <script type='text/x-tmpl-mustache' id='avatar'>
-      <span class='avatar color{{avatar.color}}' style='background-image: url("{{ avatar.url }}");'>
+<span class='avatar {{#avatar.color }} color{{avatar.color}} {{/avatar.color}}' style='background-image: url("{{ avatar.url }}");'>
         {{ avatar.content }}
       </span>
   </script>

js/models/conversations.js

@@ -244,7 +244,10 @@
         if (this.avatarUrl) {
             return { url: this.avatarUrl };
         } else if (this.isPrivate()) {
-            var title = this.getTitle() || '';
+            var title = this.get('name');
+            if (!title) {
+                return { content: '#', color: 'gray' };
+            }
             var initials = title.trim()[0];
             return {
                 color: Math.abs(this.hashCode()) % 17,

stylesheets/_global.scss

@@ -357,6 +357,7 @@ $avatar-size: 44px;
 }
 
 // avatar colors
+.avatar.colorgray { background-color: #999999 }
 .avatar.color0  { background-color: #e57373 }
 .avatar.color1  { background-color: #f06292 }
 .avatar.color2  { background-color: #ba68c8 }

stylesheets/manifest.css

@@ -274,6 +274,9 @@ img.emoji {
   .attachment-preview img {
     width: 100%; }
 
+.avatar.colorgray {
+  background-color: #999999; }
+
 .avatar.color0 {
   background-color: #e57373; }