fix(SidebarItem): flex the container

mondaycom · Oct 23, 2023 · 309f083 · 309f083
1 parent 5b9eef4
commit 309f083
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/src/components/sidebar-item/sidebar-item.module.scss b/src/components/sidebar-item/sidebar-item.module.scss
@@ -1,6 +1,11 @@
-.name {
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
+.sidebarItem {
+  flex: 1;
   min-width: 0;
+
+  .name {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    min-width: 0;
+  }
 }
diff --git a/src/components/sidebar-item/sidebar-item.tsx b/src/components/sidebar-item/sidebar-item.tsx
@@ -12,7 +12,7 @@ interface SidebarItemProps {
 
 const SidebarItem: React.FC<SidebarItemProps> = ({ children, status }) => {
   return (
-    <Flex justify={Flex.justify.SPACE_BETWEEN} gap={Flex.gaps.MEDIUM}>
+    <Flex className={styles.sidebarItem} justify={Flex.justify.SPACE_BETWEEN} gap={Flex.gaps.MEDIUM}>
       <span className={styles.name}>{children}</span>
       <StatusTag type={status} />
     </Flex>