zv/wtr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: align language dropdown button

Browse Source
This commit is contained in:
zv
2026-06-14 11:21:29 +02:00
parent 3820e01be6
commit 1cd0491e6e
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/ui/language-toggle.tsx
View File

@@ -36,18 +36,20 @@ export function LanguageToggle() {
return ( return (
<div ref={rootRef} className="relative inline-flex"> <div ref={rootRef} className="relative inline-flex">
<Languages className="pointer-events-none absolute left-3.5 size-4 text-accent" />
<button <button
type="button" type="button"
aria-label={t("language.label")} aria-label={t("language.label")}
aria-expanded={open} aria-expanded={open}
aria-haspopup="listbox" aria-haspopup="listbox"
onClick={() => setOpen((current) => !current)} onClick={() => setOpen((current) => !current)}
className="surface-control flex h-11 min-w-36 items-center rounded-control py-2 pl-10 pr-10 text-left text-sm font-medium text-foreground transition hover:bg-surface-raised/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent" className="surface-control flex h-11 min-w-36 items-center justify-between gap-3 rounded-control px-3.5 py-2 text-left text-sm font-medium text-foreground transition hover:bg-surface-raised/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent"
> >
{labels[language]} <span className="flex min-w-0 items-center gap-2.5">
<Languages className="size-4 shrink-0 text-accent" aria-hidden="true" />
<span className="truncate">{labels[language]}</span>
</span>
<ChevronDown className="size-4 shrink-0 text-muted" aria-hidden="true" />
</button> </button>
<ChevronDown className="pointer-events-none absolute right-3.5 size-4 text-muted" />
{open && ( {open && (
<div <div
role="listbox" role="listbox"