diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js index 784159e7a..0550fa63e 100644 --- a/js/views/conversation_view.js +++ b/js/views/conversation_view.js @@ -297,7 +297,7 @@ this.setDisappearingMessages(seconds), onGoBack: () => { - this.$('.conversation-content-right').hide(); + this.hideConversationRight(); }, onUpdateGroupName: () => { @@ -340,6 +340,17 @@ onClicked: this.selectMember.bind(this), }); + this.hideConversationRight = () => { + this.$('.conversation-content-right').css({ + 'margin-right': '-22vw', + }); + }; + this.showConversationRight = () => { + this.$('.conversation-content-right').css({ + 'margin-right': '0vw', + }); + }; + this.showGroupSettings = () => { if (!this.groupSettings) { this.groupSettings = new Whisper.ReactWrapperView({ @@ -354,11 +365,12 @@ } else { this.groupSettings.update(getGroupSettingsProps(this.model)); } - this.$('.conversation-content-right').show(); + + this.showConversationRight(); }; this.hideGroupSettings = () => { - this.$('.conversation-content-right').hide(); + this.showConversationRight(); }; this.memberView.render(); diff --git a/stylesheets/_conversation.scss b/stylesheets/_conversation.scss index de9c4e857..fba978b8a 100644 --- a/stylesheets/_conversation.scss +++ b/stylesheets/_conversation.scss @@ -433,7 +433,7 @@ flex-direction: row; align-items: center; margin-bottom: 8px; - padding-left: 0px 15px; + padding: 0px 15px; .send-message { flex-grow: 1; diff --git a/stylesheets/_session.scss b/stylesheets/_session.scss index c346039dd..f7e0a5bb4 100644 --- a/stylesheets/_session.scss +++ b/stylesheets/_session.scss @@ -587,10 +587,10 @@ label { position: absolute; left: 0px; right: 0px; - margin: 0px $session-margin-sm; + margin: 0px $session-margin-lg; align-items: center; justify-content: space-between; - height: 48px; + height: $main-view-header-height; .close-button { float: left; diff --git a/stylesheets/_session_group_panel.scss b/stylesheets/_session_group_panel.scss index f9d179803..1557f13bb 100644 --- a/stylesheets/_session_group_panel.scss +++ b/stylesheets/_session_group_panel.scss @@ -1,3 +1,9 @@ +.conversation-content-right { + transition: $session-transition-duration; + width: 22vw; + margin-right: -22vw; +} + .group-settings { display: flex; flex-direction: column;