From 8823b5e5042db3eb5992784517f21e0ab47ecf7e Mon Sep 17 00:00:00 2001
From: chapoi <101828855+chapoi@users.noreply.github.com>
Date: Fri, 15 Sep 2023 14:06:31 +0200
Subject: [PATCH] UX: fix overflow channel row + mobile remove styling tweak
 (#23611)

* UX: fix missing overflow ellipsis

* cleanup double declaration

* UX: add missing border-radius

*UX: delete icon animation tweak
---
 .../assets/stylesheets/common/chat-channel-row.scss    |  3 ++-
 .../assets/stylesheets/mobile/chat-channel-row.scss    | 10 ++++++----
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/plugins/chat/assets/stylesheets/common/chat-channel-row.scss b/plugins/chat/assets/stylesheets/common/chat-channel-row.scss
index 879553f836a..42156cbad7e 100644
--- a/plugins/chat/assets/stylesheets/common/chat-channel-row.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-channel-row.scss
@@ -9,6 +9,8 @@
 
   &__content {
     display: flex;
+    justify-content: space-between;
+    max-width: 100%;
     align-items: center;
     flex-grow: 1;
   }
@@ -69,7 +71,6 @@
   }
 
   .chat-channel-title {
-    width: 100%;
     overflow: hidden;
 
     &__users-count {
diff --git a/plugins/chat/assets/stylesheets/mobile/chat-channel-row.scss b/plugins/chat/assets/stylesheets/mobile/chat-channel-row.scss
index 480365cdb0e..23fd18bef8c 100644
--- a/plugins/chat/assets/stylesheets/mobile/chat-channel-row.scss
+++ b/plugins/chat/assets/stylesheets/mobile/chat-channel-row.scss
@@ -19,8 +19,6 @@
   }
 
   &__content {
-    display: flex;
-    flex-grow: 1;
     padding-inline: 1.5rem;
     z-index: 2;
     background: var(--primary-very-low);
@@ -32,11 +30,16 @@
       transition: margin-right 0.15s ease-out;
       margin-right: 0px !important;
     }
+    &:not(.-animate-reset) {
+      border-top-right-radius: 0.25rem;
+      border-bottom-right-radius: 0.25rem;
+    }
   }
 
   &__action-btn {
     z-index: 1;
     display: flex;
+    justify-content: flex-end;
     align-items: center;
     position: absolute;
     top: 0px;
@@ -50,8 +53,7 @@
       transform-origin: 50% 50%;
       transform-box: fill-box;
       transition: scale 0.2s ease-out;
-      margin: 0 1rem 0 auto;
-      padding-left: 1rem;
+      margin-inline: 0 1.5rem;
     }
 
     &.-not-at-threshold {