diff --git a/js/views/new_conversation_view.js b/js/views/new_conversation_view.js index 0c81499a2..e87d7c0bd 100644 --- a/js/views/new_conversation_view.js +++ b/js/views/new_conversation_view.js @@ -56,9 +56,17 @@ var Whisper = Whisper || {}; this.typeahead_view.$el.appendTo(this.$el.find('.contacts')); this.typeahead_collection.fetch(); + + this.new_contact = new Whisper.ConversationListItemView({ + model: new Whisper.Conversation({ + active_at: null + }) + }).render(); + this.$el.find('.new-contact').append(this.new_contact.el); }, filterContacts: function(query) { + this.new_contact.model.set('name', query); if (query.length) { this.typeahead_view.collection.reset( this.typeahead_collection.typeahead(query) diff --git a/stylesheets/index.scss b/stylesheets/index.scss index df686da41..2e8f2ec0b 100644 --- a/stylesheets/index.scss +++ b/stylesheets/index.scss @@ -6,6 +6,7 @@ display: none; } +.new-contact, .typeahead { .last-message, .last-timestamp { display: none; @@ -15,3 +16,7 @@ display: inline-block; } } + +.new-contact .contact::before { + content: 'New contact' +} diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css index 2ddb5d1cb..6d83b9fb0 100644 --- a/stylesheets/manifest.css +++ b/stylesheets/manifest.css @@ -4,11 +4,17 @@ .contact .checkbox { display: none; } -.typeahead .last-message, .typeahead .last-timestamp { +.new-contact .last-message, .new-contact .last-timestamp, +.typeahead .last-message, +.typeahead .last-timestamp { display: none; } +.new-contact .contact .checkbox, .typeahead .contact .checkbox { display: inline-block; } +.new-contact .contact::before { + content: "New contact"; } + @font-face { font-family: 'Roboto'; src: url("/fonts/Roboto-Regular.ttf") format("truetype"); }