From c13ca6eb198cecbff984f597f4db59642085f9b3 Mon Sep 17 00:00:00 2001
From: chapoi <101828855+chapoi@users.noreply.github.com>
Date: Fri, 4 Oct 2024 14:10:36 +0200
Subject: [PATCH] UX: chat index mini refactor (#29082)

---
 plugins/chat/assets/stylesheets/common/index.scss            | 1 -
 .../stylesheets/{common => desktop}/chat-side-panel.scss     | 1 -
 plugins/chat/assets/stylesheets/desktop/index.scss           | 1 +
 plugins/chat/assets/stylesheets/mobile/chat-footer.scss      | 2 ++
 plugins/chat/assets/stylesheets/mobile/chat-index.scss       | 5 +++++
 plugins/chat/assets/stylesheets/mobile/chat-side-panel.scss  | 3 ---
 plugins/chat/assets/stylesheets/mobile/index.scss            | 1 -
 7 files changed, 8 insertions(+), 6 deletions(-)
 rename plugins/chat/assets/stylesheets/{common => desktop}/chat-side-panel.scss (93%)
 delete mode 100644 plugins/chat/assets/stylesheets/mobile/chat-side-panel.scss

diff --git a/plugins/chat/assets/stylesheets/common/index.scss b/plugins/chat/assets/stylesheets/common/index.scss
index e9ea15a319a..9f9de91d375 100644
--- a/plugins/chat/assets/stylesheets/common/index.scss
+++ b/plugins/chat/assets/stylesheets/common/index.scss
@@ -34,7 +34,6 @@
 @import "chat-reply";
 @import "chat-replying-indicator";
 @import "chat-selection-manager";
-@import "chat-side-panel";
 @import "chat-skeleton";
 @import "chat-thread";
 @import "chat-side-panel-resizer";
diff --git a/plugins/chat/assets/stylesheets/common/chat-side-panel.scss b/plugins/chat/assets/stylesheets/desktop/chat-side-panel.scss
similarity index 93%
rename from plugins/chat/assets/stylesheets/common/chat-side-panel.scss
rename to plugins/chat/assets/stylesheets/desktop/chat-side-panel.scss
index 85edcf689b6..54fbb98d08d 100644
--- a/plugins/chat/assets/stylesheets/common/chat-side-panel.scss
+++ b/plugins/chat/assets/stylesheets/desktop/chat-side-panel.scss
@@ -1,7 +1,6 @@
 #main-chat-outlet.chat-view {
   min-height: 0;
   display: grid;
-  grid-template-rows: 100%;
   grid-template-areas: "main threads";
   grid-template-columns: 1fr auto;
 }
diff --git a/plugins/chat/assets/stylesheets/desktop/index.scss b/plugins/chat/assets/stylesheets/desktop/index.scss
index e5daeca9293..2a008fbb92b 100644
--- a/plugins/chat/assets/stylesheets/desktop/index.scss
+++ b/plugins/chat/assets/stylesheets/desktop/index.scss
@@ -8,4 +8,5 @@
 @import "chat-channel-info";
 @import "chat-message-creator";
 @import "chat-message-thread-indicator";
+@import "chat-side-panel";
 @import "sidebar-extensions";
diff --git a/plugins/chat/assets/stylesheets/mobile/chat-footer.scss b/plugins/chat/assets/stylesheets/mobile/chat-footer.scss
index 542f29042d5..fee1d6a2ea2 100644
--- a/plugins/chat/assets/stylesheets/mobile/chat-footer.scss
+++ b/plugins/chat/assets/stylesheets/mobile/chat-footer.scss
@@ -1,5 +1,7 @@
 .full-page-chat {
   #main-chat-outlet.chat-view {
+    display: grid;
+    grid-template-rows: 1fr auto;
     grid-template-areas:
       "list"
       "footer";
diff --git a/plugins/chat/assets/stylesheets/mobile/chat-index.scss b/plugins/chat/assets/stylesheets/mobile/chat-index.scss
index daea4db625a..a9d530f6990 100644
--- a/plugins/chat/assets/stylesheets/mobile/chat-index.scss
+++ b/plugins/chat/assets/stylesheets/mobile/chat-index.scss
@@ -6,6 +6,10 @@
   .chat-channel-name {
     font-size: var(--font-up-1-rem);
   }
+
+  .chat-channel-row:last-of-type {
+    border-bottom: 0;
+  }
 }
 
 .c-routes.--direct-messages,
@@ -13,4 +17,5 @@
 .c-routes.--threads {
   background: var(--primary-very-low);
   max-width: 100vw;
+  padding-bottom: 1rem;
 }
diff --git a/plugins/chat/assets/stylesheets/mobile/chat-side-panel.scss b/plugins/chat/assets/stylesheets/mobile/chat-side-panel.scss
deleted file mode 100644
index 916cd6bbef6..00000000000
--- a/plugins/chat/assets/stylesheets/mobile/chat-side-panel.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.chat-side-panel {
-  border-left: 0;
-}
diff --git a/plugins/chat/assets/stylesheets/mobile/index.scss b/plugins/chat/assets/stylesheets/mobile/index.scss
index 91bcf7e4774..f4bec3eb02f 100644
--- a/plugins/chat/assets/stylesheets/mobile/index.scss
+++ b/plugins/chat/assets/stylesheets/mobile/index.scss
@@ -8,7 +8,6 @@
 @import "chat-selection-manager";
 @import "chat-emoji-picker";
 @import "chat-composer-upload";
-@import "chat-side-panel";
 @import "chat-thread";
 @import "chat-threads-list";
 @import "chat-message-thread-indicator";