From f9f45d9f5f9519cb296f9dcdfba21528cb0fee13 Mon Sep 17 00:00:00 2001
From: Frontend Developer 2 <fe-dev-2@roboco.tech>
Date: Thu, 23 Jul 2026 23:13:01 +0000
Subject: [PATCH] [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.
---
 panel/src/components/knowledge-base/kb-search-bar.tsx | 4 ++--
 panel/src/components/settings/self-hosted-section.tsx | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/panel/src/components/knowledge-base/kb-search-bar.tsx b/panel/src/components/knowledge-base/kb-search-bar.tsx
index 591527fb..4b1d6ace 100644
--- a/panel/src/components/knowledge-base/kb-search-bar.tsx
+++ b/panel/src/components/knowledge-base/kb-search-bar.tsx
@@ -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>
diff --git a/panel/src/components/settings/self-hosted-section.tsx b/panel/src/components/settings/self-hosted-section.tsx
index cdceb8a5..09d18d87 100644
--- a/panel/src/components/settings/self-hosted-section.tsx
+++ b/panel/src/components/settings/self-hosted-section.tsx
@@ -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"}