fix(sidebar): move flex styles to CSS file & adding margin , rounded on item

Author: Mohit5Upadhyay

packages/ui-components/src/Containers/Sidebar/SidebarItem/index.module.css

@@ -4,10 +4,12 @@
   @apply font-regular
     relative
     z-20
+    mb-px
     flex
     w-full
     items-center
     overflow-hidden
+    rounded-md
     text-sm
     text-neutral-800
     dark:text-neutral-200;
@@ -30,7 +32,11 @@
 
   .label {
     @apply font-regular
-      p-2;
+      flex
+      items-center
+      gap-1.5
+      p-2
+      text-sm;
   }
 
   .progressionIcon {

packages/ui-components/src/Containers/Sidebar/SidebarItem/index.tsx

@@ -35,7 +35,7 @@ const SidebarItem: FC<SidebarItemProps> = ({
       <ProgressionIcon className={styles.progressionIcon} />
     )}
 
-    <div className={`${styles.label} flex items-center gap-1.5`}>
+    <div className={styles.label}>
       <span>{label}</span>
 
       {/^https?:/.test(link) && <ArrowUpRightIcon className={styles.icon} />}