From 50485f96bc0ac974a8a4c00a5c14f9264916aab2 Mon Sep 17 00:00:00 2001
From: bflatastic <bombayapirat@gmail.com>
Date: Fri, 23 May 2025 23:19:32 +0700
Subject: [PATCH] fixes to padding/margin

---
 .../menu-icon-selector/src/lib/menu-icon-selector.tsx      | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/frontend/libs/components/menu-icon-selector/src/lib/menu-icon-selector.tsx b/frontend/libs/components/menu-icon-selector/src/lib/menu-icon-selector.tsx
index 82071cbbe0..6f8d6c9bf4 100644
--- a/frontend/libs/components/menu-icon-selector/src/lib/menu-icon-selector.tsx
+++ b/frontend/libs/components/menu-icon-selector/src/lib/menu-icon-selector.tsx
@@ -81,13 +81,13 @@ export const MenuIconSelector: React.FC<MenuIconSelectorProps> = ({
     >
       <div
         ref={containerRef}
-        className="relative flex gap-1 bg-white/10 border-none rounded-xl px-1 py-1 min-w-max"
+        className="relative flex gap-1 bg-white/10 border-white/10 border rounded-xl px-1 py-1 min-w-max"
         style={{ minWidth: 0 }}
         onMouseLeave={() => setHoveredIndex(-1)}
       >
         {/* Active tab background */}
         <div
-          className="absolute z-10 rounded-lg bg-primary/80 shadow-md transition-all duration-150 ease-in-out"
+          className="absolute z-10 rounded-lg bg-primary/30 border-2 border-primary shadow-md transition-all duration-150 ease-in-out -ml-[1px]"
           style={{
             left: activeStyle.left,
             width: activeStyle.width,
@@ -98,7 +98,7 @@ export const MenuIconSelector: React.FC<MenuIconSelectorProps> = ({
         {/* Hover background (only if hovering a different tab) */}
         {hoveredIndex !== -1 && hoveredIndex !== selectedIndex && (
           <div
-            className="absolute z-20 rounded-lg bg-white/15 transition-all duration-150 ease-in-out pointer-events-none"
+            className="absolute z-20 rounded-lg bg-white/15 transition-all duration-150 ease-in-out pointer-events-none -ml-[1px]"
             style={{
               left: hoverStyle.left,
               width: hoverStyle.width,
@@ -114,6 +114,7 @@ export const MenuIconSelector: React.FC<MenuIconSelectorProps> = ({
             position="bottom"
             delay={100}
             closeOnClick={true}
+            className="font-medium"
           >
             <button
               ref={(el) => {