diff options
| -rw-r--r-- | src/App.js | 14 | ||||
| -rw-r--r-- | src/App.scss | 6 | ||||
| -rw-r--r-- | src/App.vue | 2 | ||||
| -rw-r--r-- | src/components/chat/chat.js | 1 | ||||
| -rw-r--r-- | src/components/chat/chat.scss | 3 | ||||
| -rw-r--r-- | src/components/mobile_post_status_button/mobile_post_status_button.js | 2 |
6 files changed, 26 insertions, 2 deletions
@@ -50,6 +50,16 @@ export default { window.removeEventListener('resize', this.updateMobileState) }, computed: { + classes () { + return [ + { + '-reverse': this.reverseLayout, + '-no-sticky-headers': this.noSticky, + '-has-new-post-button': this.newPostButtonShown + }, + '-' + this.layoutType + ] + }, currentUser () { return this.$store.state.users.currentUser }, userBackground () { return this.currentUser.background_image }, instanceBackground () { @@ -72,6 +82,10 @@ export default { !this.$store.getters.mergedConfig.hideISP && this.$store.state.instance.instanceSpecificPanelContent }, + newPostButtonShown () { + if (this.$route.name === 'chat' || this.$route.name === 'chats') return false + return this.$store.getters.mergedConfig.alwaysShowNewPostButton || this.layoutType === 'mobile' + }, showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel }, shoutboxPosition () { return this.$store.getters.mergedConfig.showNewPostButton || false diff --git a/src/App.scss b/src/App.scss index e65f3b2a..c8470c8a 100644 --- a/src/App.scss +++ b/src/App.scss @@ -222,6 +222,12 @@ nav { } } + &.-has-new-post-button { + .column { + padding-bottom: 20em; + } + } + &.-no-sticky-headers { .column { .panel-heading.-sticky { diff --git a/src/App.vue b/src/App.vue index b5f6e7d3..094a8ab9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -13,7 +13,7 @@ <div id="content" class="app-layout container" - :class="[{ '-reverse': reverseLayout, '-no-sticky-headers': noSticky }, '-' + layoutType]" + :class="classes" > <div class="underlay"/> <div id="sidebar" class="column -scrollable" :class="{ '-show-scrollbar': showScrollbars }"> diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js index a2789d2e..9a0ae107 100644 --- a/src/components/chat/chat.js +++ b/src/components/chat/chat.js @@ -91,6 +91,7 @@ const Chat = { ...mapState({ backendInteractor: state => state.api.backendInteractor, mastoUserSocketStatus: state => state.api.mastoUserSocketStatus, + mobileLayout: state => state.interface.layoutType === 'mobile', currentUser: state => state.users.currentUser }) }, diff --git a/src/components/chat/chat.scss b/src/components/chat/chat.scss index 34a335fe..1bad51b9 100644 --- a/src/components/chat/chat.scss +++ b/src/components/chat/chat.scss @@ -1,6 +1,9 @@ .chat-view { display: flex; height: 100%; + // Stick the form to the top/bottom of screen + margin-bottom: calc(var(--___columnMargin) / -2); + margin-top: calc(var(--___columnMargin) / -2); .chat-view-inner { height: auto; diff --git a/src/components/mobile_post_status_button/mobile_post_status_button.js b/src/components/mobile_post_status_button/mobile_post_status_button.js index 4866ac57..ecf79b64 100644 --- a/src/components/mobile_post_status_button/mobile_post_status_button.js +++ b/src/components/mobile_post_status_button/mobile_post_status_button.js @@ -45,7 +45,7 @@ const MobilePostStatusButton = { return this.autohideFloatingPostButton && (this.hidden || this.inputActive) }, isPersistent () { - return !!this.$store.getters.mergedConfig.showNewPostButton + return !!this.$store.getters.mergedConfig.alwaysShowNewPostButton }, autohideFloatingPostButton () { return !!this.$store.getters.mergedConfig.autohideFloatingPostButton |