mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-21 18:55:16 +02:00
refactor: enhance UI components with improved hover effects and color consistency
This commit is contained in:
parent
bd5f1b3cdf
commit
cbfbf59c46
12 changed files with 33 additions and 35 deletions
|
|
@ -190,10 +190,10 @@ export function ChatShareButton({ thread, onVisibilityChange, className }: ChatS
|
|||
key={option.value}
|
||||
onClick={() => handleVisibilityChange(option.value)}
|
||||
className={cn(
|
||||
"w-full flex items-center gap-2.5 px-2.5 py-2 rounded-md transition-all",
|
||||
"hover:bg-accent/40 cursor-pointer",
|
||||
"w-full flex items-center gap-2.5 px-2.5 py-2 rounded-md transition-colors",
|
||||
"hover:bg-accent hover:text-accent-foreground cursor-pointer",
|
||||
"focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
||||
isSelected && "bg-primary/6 dark:bg-primary/8"
|
||||
isSelected && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
<div
|
||||
|
|
@ -239,8 +239,8 @@ export function ChatShareButton({ thread, onVisibilityChange, className }: ChatS
|
|||
onClick={handleCreatePublicLink}
|
||||
disabled={isCreatingSnapshot}
|
||||
className={cn(
|
||||
"w-full flex items-center gap-2.5 px-2.5 py-2 rounded-md transition-all",
|
||||
"hover:bg-accent/40 cursor-pointer",
|
||||
"w-full flex items-center gap-2.5 px-2.5 py-2 rounded-md transition-colors",
|
||||
"hover:bg-accent hover:text-accent-foreground cursor-pointer",
|
||||
"focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
||||
"disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -502,7 +502,7 @@ export const DocumentMentionPicker = forwardRef<
|
|||
className={cn(
|
||||
"w-full flex items-center gap-2 px-3 py-2 text-left transition-colors rounded-md",
|
||||
isAlreadySelected ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
|
||||
isHighlighted && "bg-accent"
|
||||
isHighlighted && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
<span className="shrink-0 text-muted-foreground text-sm">
|
||||
|
|
@ -559,7 +559,7 @@ export const DocumentMentionPicker = forwardRef<
|
|||
className={cn(
|
||||
"w-full flex items-center gap-2 px-3 py-2 text-left transition-colors rounded-md",
|
||||
isAlreadySelected ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
|
||||
isHighlighted && "bg-accent"
|
||||
isHighlighted && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
<span className="shrink-0 text-muted-foreground text-sm">
|
||||
|
|
@ -613,7 +613,7 @@ export const DocumentMentionPicker = forwardRef<
|
|||
className={cn(
|
||||
"w-full flex items-center gap-2 px-3 py-2 text-left transition-colors rounded-md",
|
||||
isAlreadySelected ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
|
||||
isHighlighted && "bg-accent"
|
||||
isHighlighted && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
<span className="shrink-0 text-muted-foreground text-sm">
|
||||
|
|
|
|||
|
|
@ -1041,9 +1041,10 @@ export function ModelSelector({
|
|||
onMouseEnter={() => setFocusedIndex(index)}
|
||||
className={cn(
|
||||
"group flex items-center gap-2.5 px-3 py-2 rounded-xl",
|
||||
"transition-all duration-150 mx-2 cursor-pointer hover:bg-accent/40",
|
||||
isSelected && "bg-primary/6 dark:bg-primary/8",
|
||||
isFocused && "bg-accent/50"
|
||||
"transition-colors duration-150 mx-2 cursor-pointer",
|
||||
"hover:bg-accent hover:text-accent-foreground",
|
||||
isFocused && "bg-accent text-accent-foreground",
|
||||
isSelected && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
{/* Provider icon */}
|
||||
|
|
|
|||
|
|
@ -161,7 +161,7 @@ export const PromptPicker = forwardRef<PromptPickerRef, PromptPickerProps>(funct
|
|||
onMouseEnter={() => setHighlightedIndex(index)}
|
||||
className={cn(
|
||||
"w-full flex items-center gap-2 px-3 py-2 text-left text-sm transition-colors rounded-md cursor-pointer",
|
||||
index === highlightedIndex && "bg-accent"
|
||||
index === highlightedIndex && "bg-accent text-accent-foreground"
|
||||
)}
|
||||
>
|
||||
<span className="shrink-0 text-muted-foreground">
|
||||
|
|
@ -183,7 +183,7 @@ export const PromptPicker = forwardRef<PromptPickerRef, PromptPickerProps>(funct
|
|||
className={cn(
|
||||
"w-full flex items-center gap-2 px-3 py-2 text-left text-sm transition-colors rounded-md cursor-pointer text-muted-foreground",
|
||||
highlightedIndex === createPromptIndex
|
||||
? "bg-accent text-foreground"
|
||||
? "bg-accent text-accent-foreground"
|
||||
: "hover:text-accent-foreground hover:bg-accent"
|
||||
)}
|
||||
>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue