chore: Refactors chatlist header css to work with RTL (#6520)

authored by 1277421+nithindavid@users.noreply.github.com

app/javascript/dashboard/components/ChatList.vue

@@ -53,11 +53,10 @@
         <woot-button
           v-else
           v-tooltip.right="$t('FILTER.TOOLTIP_LABEL')"
-          variant="clear"
+          variant="smooth"
           color-scheme="secondary"
           icon="filter"
-          size="small"
-          class="btn-filter"
+          size="tiny"
           @click="onToggleAdvanceFiltersModal"
         />
       </div>
@@ -838,10 +837,6 @@ export default {
   align-items: center;
 }
 
-.btn-filter {
-  margin: 0 var(--space-smaller);
-}
-
 .filter__applied {
   padding: 0 0 var(--space-slab) 0 !important;
   border-bottom: 1px solid var(--color-border);
@@ -850,4 +845,14 @@ export default {
 .delete-custom-view__button {
   margin-right: var(--space-normal);
 }
+
+.tab--chat-type {
+  padding: 0 var(--space-normal);
+
+  ::v-deep {
+    .tabs {
+      padding: 0;
+    }
+  }
+}
 </style>

app/javascript/dashboard/components/SidemenuIcon.vue

@@ -22,7 +22,6 @@ export default {
 </script>
 <style scoped lang="scss">
 .toggle-sidebar {
-  margin-right: var(--space-small);
   margin-left: var(--space-minus-small);
 }
 </style>

app/javascript/dashboard/components/layout/AvailabilityStatus.vue

@@ -181,7 +181,7 @@ export default {
   align-items: center;
   display: flex;
   justify-content: space-between;
-  padding: var(--space-smaller) 0 var(--space-smaller) var(--space-small);
+  padding: var(--space-smaller);
   margin: 0;
 
   .info-wrap {

app/javascript/dashboard/components/widgets/conversation/ChatFilter.vue

@@ -44,3 +44,14 @@ export default {
   },
 };
 </script>
+<style lang="scss" scoped>
+.status--filter {
+  background-color: var(--color-background-light);
+  border: 1px solid var(--color-border);
+  font-size: var(--font-size-mini);
+  height: var(--space-medium);
+  margin: 0 var(--space-smaller);
+  padding: 0 var(--space-medium) 0 var(--space-small);
+  width: auto;
+}
+</style>