fix: Design issues after RTL changes (#6718)

app/javascript/dashboard/components/ChatList.vue

@@ -45,7 +45,6 @@
             variant="smooth"
             color-scheme="alert"
             icon="delete"
-            class="delete-custom-view__button"
             @click="onClickOpenDeleteFoldersModal"
           />
         </div>
@@ -835,17 +834,14 @@ export default {
 .filter--actions {
   display: flex;
   align-items: center;
+  gap: var(--space-micro);
 }
 
 .filter__applied {
-  padding: 0 0 var(--space-slab) 0 !important;
+  padding-bottom: var(--space-slab) !important;
   border-bottom: 1px solid var(--color-border);
 }
 
-.delete-custom-view__button {
-  margin-right: var(--space-normal);
-}
-
 .tab--chat-type {
   padding: 0 var(--space-normal);
 

app/javascript/dashboard/routes/dashboard/contacts/components/Header.vue

@@ -3,7 +3,7 @@
     <div class="table-actions-wrap">
       <div class="left-aligned-wrap">
         <woot-sidemenu-icon />
-        <h1 class="page-title">
+        <h1 class="page-title header-title">
           {{ headerTitle }}
         </h1>
       </div>
@@ -167,6 +167,15 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
+  max-width: 100%;
+  min-width: var(--space-mega);
+
+  .header-title {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 var(--space-small);
+  }
 }
 
 .right-aligned-wrap {