From 4f617a7293922fdce85462009feb7e52770a7e62 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 11 Apr 2022 23:30:41 +0300
Subject: [PATCH] fix for chat shadow
---
src/App.js | 5 ++++-
src/App.scss | 5 +++++
src/App.vue | 2 +-
src/components/chat/chat.scss | 4 +++-
4 files changed, 13 insertions(+), 3 deletions(-)
diff --git a/src/App.js b/src/App.js
index 39ef62e70..9cfaf4fa1 100644
--- a/src/App.js
+++ b/src/App.js
@@ -82,8 +82,11 @@ export default {
!this.$store.getters.mergedConfig.hideISP &&
this.$store.state.instance.instanceSpecificPanelContent
},
+ isChats () {
+ return this.$route.name === 'chat' || this.$route.name === 'chats'
+ },
newPostButtonShown () {
- if (this.$route.name === 'chat' || this.$route.name === 'chats') return false
+ if (this.isChats) return false
return this.$store.getters.mergedConfig.alwaysShowNewPostButton || this.layoutType === 'mobile'
},
showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel },
diff --git a/src/App.scss b/src/App.scss
index b5411585b..31d7fac25 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -207,6 +207,11 @@ nav {
z-index: 2;
}
+ &.-full-height {
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+
&.-scrollable {
--___paddingIncrease: calc(var(--columnGap) / 2);
diff --git a/src/App.vue b/src/App.vue
index 094a8ab98..707b91e5c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -26,7 +26,7 @@
<div id="notifs-sidebar" />
</template>
</div>
- <div id="main-scroller" class="column main">
+ <div id="main-scroller" class="column main" :class="{ '-full-height': isChats }">
<div
v-if="!currentUser"
class="login-hint panel panel-default"
diff --git a/src/components/chat/chat.scss b/src/components/chat/chat.scss
index 1bad51b93..7b4dd37fe 100644
--- a/src/components/chat/chat.scss
+++ b/src/components/chat/chat.scss
@@ -22,6 +22,8 @@
margin: 0 0 0 0;
border-radius: 10px 10px 0 0;
border-radius: var(--panelRadius, 10px) var(--panelRadius, 10px) 0 0;
+ margin-bottom: calc(var(--___columnMargin) * -1);
+ padding-bottom: var(--___columnMargin);
&::after {
border-radius: 0;
@@ -40,7 +42,7 @@
bottom: 0;
background-color: $fallback--bg;
background-color: var(--bg, $fallback--bg);
- z-index: 10;
+ z-index: 1;
}
.chat-view-heading {
--
GitLab