From 0e2c805b41179ad45f4f3aade636cfc740de997a Mon Sep 17 00:00:00 2001
From: lebaudantoine <lebaud.antoine131@gmail.com>
Date: Wed, 21 Aug 2024 19:17:24 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84(frontend)=20reserve=20left=20paddi?=
 =?UTF-8?q?ng=20for=20select=20options?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Extra padding should be reserved for select options that
display a checkmark when an option is selected.
---
 src/frontend/src/primitives/Select.tsx        | 2 +-
 src/frontend/src/primitives/menuItemRecipe.ts | 7 +++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/frontend/src/primitives/Select.tsx b/src/frontend/src/primitives/Select.tsx
index 4fe7191b..9f851d2c 100644
--- a/src/frontend/src/primitives/Select.tsx
+++ b/src/frontend/src/primitives/Select.tsx
@@ -72,7 +72,7 @@ export const Select = <T extends string | number>({
           <ListBox>
             {items.map((item) => (
               <ListBoxItem
-                className={menuItemRecipe()}
+                className={menuItemRecipe({ extraPadding: true })}
                 id={item.value}
                 key={item.value}
               >
diff --git a/src/frontend/src/primitives/menuItemRecipe.ts b/src/frontend/src/primitives/menuItemRecipe.ts
index b96fa2e5..ed78d370 100644
--- a/src/frontend/src/primitives/menuItemRecipe.ts
+++ b/src/frontend/src/primitives/menuItemRecipe.ts
@@ -10,7 +10,6 @@ export const menuItemRecipe = cva({
   base: {
     paddingY: 0.125,
     paddingX: 0.5,
-    paddingLeft: 1.5,
     textAlign: 'left',
     width: 'full',
     borderRadius: 4,
@@ -44,7 +43,11 @@ export const menuItemRecipe = cva({
         alignItems: 'center',
         gap: '1rem',
         paddingY: '0.4rem',
-        paddingLeft: 0.5,
+      },
+    },
+    extraPadding: {
+      true: {
+        paddingLeft: 1.5,
       },
     },
   },