[fee25542] fix(a11y): bump sub-36px icon-sm touch targets to 36px on remaining pages

Both kb-search-bar.tsx (Knowledge Base search clear button) and
self-hosted-section.tsx (Settings token show/hide button) used
Button size="icon-sm" (32px) for an absolutely-positioned input
adornment, below the 36px minimum touch-target size. Bumped both
to size="icon" (36px, matching the 36px input height) and adjusted
the absolute-position offset so the button still sits fully inside
each input's existing right padding reservation.

Audited every remaining dashboard page (everything Stream4-A's
wide-content/table fixes didn't already cover): no un-wrapped wide
tables remain (every <Table> already rides ResponsiveTable), and
every DialogContent across the repo already inherits or supplies
max-h-[*vh] + overflow-y-auto, so dialogs stay usable at small
viewport heights.
This commit is contained in:
Frontend Developer 2
2026-07-24 04:02:16 +00:00
committed by Frontend Developer 1
parent 2e9e05f38d
commit f9f45d9f5f
2 changed files with 3 additions and 3 deletions
@@ -68,10 +68,10 @@ export function KBSearchBar({
<HelpTip label="Clear search">
<Button
variant="ghost"
size="icon-sm"
size="icon"
onClick={handleClear}
aria-label="Clear search"
className="absolute right-1 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
className="absolute right-0 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
>
<X className="h-4 w-4" />
</Button>
@@ -209,7 +209,7 @@ export function SelfHostedSection({
<Button
type="button"
variant="ghost"
size="icon-sm"
size="icon"
onClick={() => setShowToken((v) => !v)}
className="absolute right-1 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
aria-label={showToken ? "Hide token" : "Show token"}