mirror of
https://github.com/khoj-ai/khoj.git
synced 2024-11-23 15:38:55 +01:00
Improve dropdown menus on web app setting page with scroll & min-width
- Previously when settings list became long the dropdown height would overflow screen height. Now it's max height is clamped and y-scroll - Previously the dropdown content would take width of content. This would mean the menu could sometimes be less wide than the button. It felt strange. Now dropdown content is at least width of parent button
This commit is contained in:
parent
80df3bb8c4
commit
bbd24f1e98
1 changed files with 7 additions and 1 deletions
|
@ -387,7 +387,13 @@ const DropdownComponent: React.FC<DropdownComponentProps> = ({ items, selected,
|
||||||
<CaretDown className="h-4 w-4 ml-auto text-muted-foreground" />
|
<CaretDown className="h-4 w-4 ml-auto text-muted-foreground" />
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent>
|
<DropdownMenuContent
|
||||||
|
style={{
|
||||||
|
maxHeight: "200px",
|
||||||
|
overflowY: "auto",
|
||||||
|
minWidth: "var(--radix-dropdown-menu-trigger-width)",
|
||||||
|
}}
|
||||||
|
>
|
||||||
<DropdownMenuRadioGroup
|
<DropdownMenuRadioGroup
|
||||||
value={position}
|
value={position}
|
||||||
onValueChange={async (value) => {
|
onValueChange={async (value) => {
|
||||||
|
|
Loading…
Reference in a new issue