pleroma-fe

commit: 3e1b40ce29feae8ab2b13da35eece15df8a7697c
parent 0f28c28760f7a8615da18630fa49ff963d3f7533
Author: Henry Jameson <me@hjkos.com>
Date:   Sun, 10 Apr 2022 20:18:54 +0300

fix new post button not working day1, minor stylistic fixes

Diffstat:
M
src/App.js
14
++++++++++++++
M
src/App.scss
6
++++++
M
src/App.vue
2
+-
M
src/components/chat/chat.js
1
+
M
src/components/chat/chat.scss
3
+++
M
src/components/mobile_post_status_button/mobile_post_status_button.js
2
+-

6 files changed, 26 insertions(+), 2 deletions(-)
diff --git a/src/App.js b/src/App.js
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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