Polish dashboard menu settings surfaces.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Developing-Gamer 2026-05-27 12:31:14 -07:00
parent 89af885d95
commit b435624de7
2 changed files with 6 additions and 5 deletions

View File

@ -71,7 +71,8 @@ export type DesignMenuProps =
| DesignMenuSelectorProps
| DesignMenuTogglesProps;
const destructiveItemClasses = "text-red-600 dark:text-red-400 focus:bg-red-500/10";
const destructiveItemClasses =
"text-red-600 dark:text-red-400 focus:bg-red-500/10 data-[highlighted]:bg-red-500/10 dark:focus:bg-red-500/15 dark:data-[highlighted]:bg-red-500/15";
export function DesignMenu(props: DesignMenuProps) {
const align = props.align ?? (props.variant === "toggles" ? "end" : "start");

View File

@ -69,8 +69,8 @@ export const SettingSwitch = React.memo(function SettingSwitch(props: {
}, [propOnCheckedChange]);
return (
<div className="flex items-start gap-3 rounded-lg border border-border/70 bg-background/80 px-3 py-3">
<div className="flex flex-1 flex-col gap-2">
<div className="flex items-center gap-3 rounded-xl border border-black/[0.08] bg-white/90 px-4 py-3 shadow-sm ring-1 ring-black/[0.06] dark:border-white/[0.06] dark:bg-background/60 dark:ring-white/[0.06]">
<div className="flex min-w-0 flex-1 flex-col gap-1">
<div className="flex items-center gap-3">
<Switch
id={id}
@ -79,13 +79,13 @@ export const SettingSwitch = React.memo(function SettingSwitch(props: {
disabled={props.disabled}
/>
<Label className="cursor-pointer" htmlFor={id}>
<Typography type="div" className="text-sm font-medium leading-none">
<Typography type="div" className="text-sm font-medium leading-snug">
{props.label}
</Typography>
</Label>
</div>
{props.hint && (
<Typography variant="secondary" className="text-xs pl-9">
<Typography variant="secondary" className="pl-11 text-xs leading-relaxed">
{props.hint}
</Typography>
)}