Grayscale/nanobot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(webui): soften form control focus rings

Browse Source
This commit is contained in:
chengyongru
2026-08-11 14:39:07 +08:00
committed by chengyongru
parent cac39477ba
commit 3778e7e628
10 changed files with 47 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/components/ui/form-control.ts
+2
View File
@@ -0,0 +1,2 @@
export const formControlFocusClassName =
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/50";
webui/src/components/ui/input.tsx
+3 -1
View File
@@ -1,5 +1,6 @@
import * as React from "react";
import { formControlFocusClassName } from "@/components/ui/form-control";
import { cn } from "@/lib/utils";
export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
@@ -10,7 +11,8 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
<input
type={type}
className={cn(
"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
formControlFocusClassName,
className,
)}
ref={ref}
webui/src/components/ui/textarea.tsx
+3 -1
View File
@@ -1,5 +1,6 @@
import * as React from "react";
import { formControlFocusClassName } from "@/components/ui/form-control";
import { cn } from "@/lib/utils";
export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
@@ -9,7 +10,8 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
return (
<textarea
className={cn(
"flex min-h-[60px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
"flex min-h-[60px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
formControlFocusClassName,
className,
)}
ref={ref}