style: improve current provider visual feedback and toast duration
- Add light blue ring border to active provider card instead of solid border - Fix border flashing issue when switching providers - Reduce toast notification duration from 4s to 2s for better UX
This commit is contained in:
@@ -94,9 +94,9 @@ export function ProviderCard({
|
|||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"rounded-lg bg-card p-4 shadow-sm",
|
"rounded-lg bg-card p-4 shadow-sm",
|
||||||
"transition-[border-color,background-color,box-shadow] duration-200",
|
"transition-[border-color,background-color,box-shadow,ring] duration-200",
|
||||||
isCurrent
|
isCurrent
|
||||||
? "border-active border-border-active bg-primary/5"
|
? "border border-border-default bg-primary/5 ring-2 ring-blue-500/30 dark:ring-blue-400/30"
|
||||||
: "border border-border-default hover:border-border-hover",
|
: "border border-border-default hover:border-border-hover",
|
||||||
dragHandleProps?.isDragging &&
|
dragHandleProps?.isDragging &&
|
||||||
"cursor-grabbing border-active border-border-dragging shadow-lg",
|
"cursor-grabbing border-active border-border-dragging shadow-lg",
|
||||||
|
|||||||
@@ -7,6 +7,7 @@ export function Toaster() {
|
|||||||
richColors
|
richColors
|
||||||
theme="system"
|
theme="system"
|
||||||
toastOptions={{
|
toastOptions={{
|
||||||
|
duration: 2000,
|
||||||
classNames: {
|
classNames: {
|
||||||
toast:
|
toast:
|
||||||
"group rounded-md border bg-background text-foreground shadow-lg",
|
"group rounded-md border bg-background text-foreground shadow-lg",
|
||||||
|
|||||||
Reference in New Issue
Block a user