adjust select dropdown positioning and padding structure
This commit is contained in:
@@ -51,7 +51,7 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border-radius: var(--radius-md);
|
border-radius: var(--radius-md);
|
||||||
background-color: var(--surface-raised-stronger-non-alpha);
|
background-color: var(--surface-raised-stronger-non-alpha);
|
||||||
padding: 4px;
|
padding: 0;
|
||||||
box-shadow: var(--shadow-xs-border);
|
box-shadow: var(--shadow-xs-border);
|
||||||
z-index: 60;
|
z-index: 60;
|
||||||
|
|
||||||
@@ -66,6 +66,7 @@
|
|||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
padding: 4px;
|
||||||
|
|
||||||
&:focus {
|
&:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
|
|||||||
@@ -79,7 +79,7 @@ export function Select<T>(props: SelectProps<T> & ButtonProps) {
|
|||||||
<Kobalte<T, { category: string; options: T[] }>
|
<Kobalte<T, { category: string; options: T[] }>
|
||||||
{...others}
|
{...others}
|
||||||
data-component="select"
|
data-component="select"
|
||||||
placement="bottom-start"
|
placement="bottom-end"
|
||||||
value={local.current}
|
value={local.current}
|
||||||
options={grouped()}
|
options={grouped()}
|
||||||
optionValue={(x) => (local.value ? local.value(x) : (x as string))}
|
optionValue={(x) => (local.value ? local.value(x) : (x as string))}
|
||||||
|
|||||||
Reference in New Issue
Block a user