💄(frontend) reserve left padding for select options
Extra padding should be reserved for select options that display a checkmark when an option is selected.
This commit is contained in:
committed by
aleb_the_flash
parent
9782eb8c7c
commit
0e2c805b41
@@ -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}
|
||||
>
|
||||
|
||||
@@ -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,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user