Skip to content

Commit c26572f

Browse files
ctecte
committed
More tweaks
1 parent a80b8bc commit c26572f

File tree

5 files changed

+22
-20
lines changed

5 files changed

+22
-20
lines changed

‎webview-ui/src/components/settings/ModelPicker.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ export const ModelPicker = ({
138138
{searchValue.length > 0 && (
139139
<div className="absolute right-2 top-0 bottom-0 flex items-center justify-center">
140140
<X
141-
className="text-vscode-input-foreground opacity-50 hover:opacity-100 cursor-pointer size-4 rounded-full p-0.5"
141+
className="text-vscode-input-foreground opacity-50 hover:opacity-100 size-4 p-0.5 cursor-pointer"
142142
onClick={onClearSearch}
143143
/>
144144
</div>
@@ -152,7 +152,7 @@ export const ModelPicker = ({
152152
{model}
153153
<Check
154154
className={cn(
155-
"ml-auto",
155+
"size-4 p-0.5 ml-auto",
156156
model === selectedModelId ? "opacity-100" : "opacity-0",
157157
)}
158158
/>

‎webview-ui/src/components/ui/dropdown-menu.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ const DropdownMenuContent = React.forwardRef<
2626
className={cn(
2727
"z-50 min-w-[8rem] overflow-hidden rounded-xs p-1 shadow-xs",
2828
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
29-
"border border-vscode-dropdown-border",
29+
"border border-vscode-focusBorder",
3030
"bg-vscode-dropdown-background",
3131
"text-vscode-dropdown-foreground",
3232
className,
@@ -120,7 +120,7 @@ const DropdownMenuSeparator = React.forwardRef<
120120
>(({ className, ...props }, ref) => (
121121
<DropdownMenuPrimitive.Separator
122122
ref={ref}
123-
className={cn("-mx-1 my-1 h-px bg-vscode-input-border", className)}
123+
className={cn("-mx-1 my-1 h-px bg-vscode-dropdown-foreground/10", className)}
124124
{...props}
125125
/>
126126
))

‎webview-ui/src/components/ui/popover.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,10 @@ const PopoverContent = React.forwardRef<
2020
align={align}
2121
sideOffset={sideOffset}
2222
className={cn(
23-
"z-50 w-72 rounded-xs border border-vscode-dropdown-border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
23+
"z-50 w-72 rounded-xs p-4 shadow-xs outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
24+
"bg-popover",
25+
"border border-vscode-focusBorder",
26+
"text-popover-foreground",
2427
className,
2528
)}
2629
{...props}

‎webview-ui/src/components/ui/select-dropdown.tsx‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -117,10 +117,7 @@ export const SelectDropdown = React.forwardRef<React.ElementRef<typeof DropdownM
117117
onEscapeKeyDown={() => setOpen(false)}
118118
onInteractOutside={() => setOpen(false)}
119119
container={portalContainer}
120-
className={cn(
121-
"bg-vscode-dropdown-background text-vscode-dropdown-foreground border border-vscode-dropdown-border z-50",
122-
contentClassName,
123-
)}>
120+
className={contentClassName}>
124121
{options.map((option, index) => {
125122
if (option.type === DropdownOptionType.SEPARATOR) {
126123
return <DropdownMenuSeparator key={`sep-${index}`} />
@@ -131,22 +128,21 @@ export const SelectDropdown = React.forwardRef<React.ElementRef<typeof DropdownM
131128
(option.disabled && shortcutText && option.label.includes(shortcutText))
132129
) {
133130
return (
134-
<div key={`label-${index}`} className="px-2 py-1.5 text-xs opacity-50">
131+
<DropdownMenuItem key={`label-${index}`} disabled>
135132
{option.label}
136-
</div>
133+
</DropdownMenuItem>
137134
)
138135
}
139136

140137
return (
141138
<DropdownMenuItem
142139
key={`item-${option.value}`}
143140
disabled={option.disabled}
144-
className="text-xs focus:bg-vscode-list-activeSelectionBackground focus:text-vscode-list-activeSelectionForeground cursor-pointer"
145141
onClick={() => handleSelect(option)}>
146142
{option.label}
147143
{option.value === value && (
148144
<DropdownMenuShortcut>
149-
<Check className="w-3 h-3" />
145+
<Check className="size-4 p-0.5" />
150146
</DropdownMenuShortcut>
151147
)}
152148
</DropdownMenuItem>

‎webview-ui/src/components/ui/select.tsx‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from "react"
22
import { PortalProps } from "@radix-ui/react-portal"
33
import * as SelectPrimitive from "@radix-ui/react-select"
4-
import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
4+
import { Check, ChevronDown, ChevronUp } from "lucide-react"
55

66
import { cn } from "@/lib/utils"
77

@@ -31,7 +31,7 @@ function SelectTrigger({ className, children, ...props }: React.ComponentProps<t
3131
{...props}>
3232
{children}
3333
<SelectPrimitive.Icon asChild>
34-
<ChevronDownIcon className="size-4 opacity-50" />
34+
<ChevronDown className="size-4 opacity-50" />
3535
</SelectPrimitive.Icon>
3636
</SelectPrimitive.Trigger>
3737
)
@@ -49,7 +49,10 @@ function SelectContent({
4949
<SelectPrimitive.Content
5050
data-slot="select-content"
5151
className={cn(
52-
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-72 min-w-[8rem] overflow-hidden rounded-xs border border-vscode-focusBorder shadow-xs",
52+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-72 min-w-[8rem] overflow-hidden rounded-xs shadow-xs",
53+
"bg-popover",
54+
"border border-vscode-focusBorder",
55+
"text-popover-foreground",
5356
position === "popper" &&
5457
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
5558
className,
@@ -94,7 +97,7 @@ function SelectItem({ className, children, ...props }: React.ComponentProps<type
9497
{...props}>
9598
<span className="absolute right-2 flex size-3.5 items-center justify-center">
9699
<SelectPrimitive.ItemIndicator>
97-
<CheckIcon className="size-4" />
100+
<Check className="size-4 p-0.5" />
98101
</SelectPrimitive.ItemIndicator>
99102
</span>
100103
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
@@ -106,7 +109,7 @@ function SelectSeparator({ className, ...props }: React.ComponentProps<typeof Se
106109
return (
107110
<SelectPrimitive.Separator
108111
data-slot="select-separator"
109-
className={cn("bg-vscode-dropdown-border pointer-events-none -mx-1 my-1 h-px", className)}
112+
className={cn("bg-vscode-dropdown-foreground/10 pointer-events-none -mx-1 my-1 h-px", className)}
110113
{...props}
111114
/>
112115
)
@@ -118,7 +121,7 @@ function SelectScrollUpButton({ className, ...props }: React.ComponentProps<type
118121
data-slot="select-scroll-up-button"
119122
className={cn("flex cursor-default items-center justify-center py-1", className)}
120123
{...props}>
121-
<ChevronUpIcon className="size-4" />
124+
<ChevronUp className="size-4" />
122125
</SelectPrimitive.ScrollUpButton>
123126
)
124127
}
@@ -132,7 +135,7 @@ function SelectScrollDownButton({
132135
data-slot="select-scroll-down-button"
133136
className={cn("flex cursor-default items-center justify-center py-1", className)}
134137
{...props}>
135-
<ChevronDownIcon className="size-4" />
138+
<ChevronDown className="size-4" />
136139
</SelectPrimitive.ScrollDownButton>
137140
)
138141
}

0 commit comments

Comments
 (0)