diff --git a/images/back.png b/images/back.png
new file mode 100644
index 000000000..9e662f6d4
Binary files /dev/null and b/images/back.png differ
diff --git a/index.html b/index.html
index b361e182e..27eec2f57 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,7 @@
diff --git a/js/views/inbox_view.js b/js/views/inbox_view.js
index 1fd11c06e..d006e9183 100644
--- a/js/views/inbox_view.js
+++ b/js/views/inbox_view.js
@@ -23,6 +23,7 @@
this.$gutter = $('#gutter');
this.$contacts = $('#contacts');
this.$fab = this.$el.find('.fab');
+ this.$back = this.$el.find('.back');
this.newConversationView = new Whisper.NewConversationView();
this.newConversationView.$el.hide().appendTo(this.$gutter);
@@ -45,6 +46,7 @@
}.bind(this));
},
events: {
+ 'click .back': 'hideCompose',
'click .fab': 'showCompose',
'keyup input.new-message': 'compose'
},
@@ -53,13 +55,17 @@
this.$contacts.hide();
this.newConversationView.$el.show();
this.newConversationView.reset();
+ this.$back.show();
+ },
+ hideCompose: function() {
+ this.newConversationView.$el.hide();
+ this.$contacts.show();
+ this.$fab.show();
+ this.$back.hide();
},
compose: function(e) {
if (e.keyCode === 27) {
- // hide compose
- this.newConversationView.$el.hide();
- this.$contacts.show();
- this.$fab.show();
+ this.hideCompose();
}
}
});
diff --git a/stylesheets/index.scss b/stylesheets/index.scss
index 88759c543..f5f37c1a7 100644
--- a/stylesheets/index.scss
+++ b/stylesheets/index.scss
@@ -15,6 +15,14 @@ input.new-message {
width: 100%;
}
+.back {
+ display: none;
+ float: left;
+ width: 36px;
+ height: 36px;
+ background: $blue url('/images/back.png') no-repeat center center;
+}
+
.fab {
z-index: 1;
position: fixed;
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index 935bbb7b4..b6beb9dd8 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -9,6 +9,13 @@ input.new-message {
box-sizing: border-box;
width: 100%; }
+.back {
+ display: none;
+ float: left;
+ width: 36px;
+ height: 36px;
+ background: #2a92e7 url("/images/back.png") no-repeat center center; }
+
.fab {
z-index: 1;
position: fixed;
@@ -119,13 +126,11 @@ body {
.title-bar button {
height: 36px;
line-height: 36px;
- float: right;
margin-right: 8px;
padding: 0;
border: 0;
outline: 0;
- color: white;
- background: transparent; }
+ color: white; }
button {
cursor: pointer; }
diff --git a/stylesheets/view/_conversation.scss b/stylesheets/view/_conversation.scss
index f38a40c8a..b5e0f5f02 100644
--- a/stylesheets/view/_conversation.scss
+++ b/stylesheets/view/_conversation.scss
@@ -24,13 +24,11 @@ body {
button {
height: 36px;
line-height: 36px;
- float: right;
margin-right: 8px;
padding: 0;
border: 0;
outline: 0;
color: white;
- background: transparent;
}
}