[fee25542] fix(a11y): re-land sub-36px touch target and overflow fixes after sync_branch reset them again

Re-applies the fda2ac0c fix content a third time -- sync_branch's
rebase+force-push reset the branch and working tree back to the stale
f9f45d9f ref (the round-1-only state) instead of preserving the local
commits ahead of it, discarding the round-2 fix yet again.

- quick-actions-card.tsx (Overview dashboard customize dialog): reorder
  arrows drop the h-6 w-6 override, falling back to Button's 36px icon
  default
- agent-card.tsx (Agents page grid): DM / dedicated-chat / actions-menu
  icon buttons drop their h-6 w-6 override, now 36px
- product-card-grid.tsx / project-card-grid.tsx (Products/Projects card
  view): edit/external-link icon buttons drop h-6 w-6, now 36px
- environment-ladder-editor.tsx (Edit Project dialog): move-up/move-down/
  remove-rung icon buttons drop their h-6/h-8 overrides, now 36px; the
  per-rung row now scrolls horizontally within its own bordered box
  (overflow-x-auto + min-w-max) instead of overflowing at 375px now
  that the icon buttons are back to full width
- acceptance-criteria-editor.tsx / dependency-selector.tsx (task create/
  edit dialogs): remove-row icon buttons drop their h-6/h-8 overrides,
  now 36px
- tab-commits.tsx: "Linked Commits" header's fixed 3-column grid now
  stacks to one column below sm, and the branch/PR badge row scrolls
  horizontally in its own container instead of the page

panel lint + tsc --noEmit are both clean.
This commit is contained in:
Frontend Developer 1
2026-07-24 11:24:13 +00:00
parent f9f45d9f5f
commit e6bee7c876
8 changed files with 10 additions and 17 deletions
+1 -3
View File
@@ -114,7 +114,6 @@ export function AgentCard({ agent, agentStatus, usageRow }: AgentCardProps) {
<Button
variant="ghost"
size="icon"
className="h-6 w-6"
aria-label="DM this agent"
title="DM this agent"
onClick={() =>
@@ -130,7 +129,6 @@ export function AgentCard({ agent, agentStatus, usageRow }: AgentCardProps) {
<Button
variant="ghost"
size="icon"
className="h-6 w-6"
aria-label={dedicatedChat.label}
title={dedicatedChat.label}
onClick={() => router.push(dedicatedChat.href)}
@@ -145,7 +143,7 @@ export function AgentCard({ agent, agentStatus, usageRow }: AgentCardProps) {
<Button
variant="ghost"
size="icon"
className="h-6 w-6 shrink-0"
className="shrink-0"
aria-label="Agent actions"
title="Agent actions"
>
@@ -163,7 +163,6 @@ function QuickActionsCustomizeDialog() {
type="button"
variant="ghost"
size="icon"
className="h-6 w-6"
disabled={isFirst}
onClick={() => move(id, -1)}
aria-label={`Move ${action.label} earlier`}
@@ -181,7 +180,6 @@ function QuickActionsCustomizeDialog() {
type="button"
variant="ghost"
size="icon"
className="h-6 w-6"
disabled={isLast}
onClick={() => move(id, 1)}
aria-label={`Move ${action.label} later`}
@@ -67,7 +67,7 @@ export function ProductCardGrid({ products, isLoading }: ProductCardGridProps) {
<Button
variant="ghost"
size="icon"
className="h-6 w-6 shrink-0"
className="shrink-0"
onClick={() => setEditingProductId(product.id)}
aria-label="Edit product"
>
@@ -75,7 +75,7 @@ export function EnvironmentLadderEditor({
</div>
{items.length > 0 && (
<div className="space-y-2 border rounded-lg p-3 bg-muted/30">
<div className="space-y-2 overflow-x-auto border rounded-lg p-3 bg-muted/30">
{items.map((rung, index) => {
const isFirst = index === 0;
const isLast = index === items.length - 1;
@@ -94,7 +94,7 @@ export function EnvironmentLadderEditor({
promotes to
</div>
)}
<div className="flex items-center gap-2">
<div className="flex min-w-max items-center gap-2">
<div className="flex flex-col">
<Tooltip>
<TooltipTrigger asChild>
@@ -106,7 +106,6 @@ export function EnvironmentLadderEditor({
type="button"
variant="ghost"
size="icon"
className="h-6 w-6"
disabled={isFirst}
onClick={() => handleMove(index, -1)}
aria-label="Move earlier in the flow"
@@ -128,7 +127,6 @@ export function EnvironmentLadderEditor({
type="button"
variant="ghost"
size="icon"
className="h-6 w-6"
disabled={isLast}
onClick={() => handleMove(index, 1)}
aria-label="Move later in the flow"
@@ -181,7 +179,7 @@ export function EnvironmentLadderEditor({
type="button"
variant="ghost"
size="icon"
className="h-8 w-8 shrink-0"
className="shrink-0"
onClick={() => handleRemove(index)}
aria-label="Remove this rung"
>
@@ -79,7 +79,6 @@ export function ProjectCardGrid({ projects, isLoading }: ProjectCardGridProps) {
<Button
variant="ghost"
size="icon"
className="h-6 w-6"
onClick={() => setEditingProjectId(project.id)}
aria-label="Edit project"
>
@@ -87,7 +86,7 @@ export function ProjectCardGrid({ projects, isLoading }: ProjectCardGridProps) {
</Button>
</HelpTip>
<HelpTip label="Open the git repository in a new tab">
<Button variant="ghost" size="icon" className="h-6 w-6" asChild>
<Button variant="ghost" size="icon" asChild>
<a
href={getExternalUrl(project)}
target="_blank"
@@ -96,7 +96,7 @@ export function AcceptanceCriteriaEditor({
type="button"
variant="ghost"
size="icon"
className="h-8 w-8 shrink-0"
className="shrink-0"
onClick={() => handleRemove(index)}
>
<X className="h-4 w-4" />
@@ -99,7 +99,7 @@ export function DependencySelector({
type="button"
variant="ghost"
size="icon"
className="h-6 w-6 shrink-0"
className="shrink-0"
onClick={() => removeTask(task.id)}
>
<X className="h-3 w-3" />
@@ -114,7 +114,7 @@ export function TabCommits({ task }: TabCommitsProps) {
return (
<Card>
<CardHeader className="pb-3">
<div className="grid grid-cols-3 items-center gap-4">
<div className="grid grid-cols-1 items-center gap-2 sm:grid-cols-3 sm:gap-4">
<HelpTip label="Commits attributed to this task — new ones link automatically as devs push">
<CardTitle className="text-lg flex items-center gap-2 w-fit">
<GitCommit className="h-5 w-5" />
@@ -124,7 +124,7 @@ export function TabCommits({ task }: TabCommitsProps) {
</span>
</CardTitle>
</HelpTip>
<div className="flex items-center justify-center gap-2">
<div className="flex items-center justify-start gap-2 overflow-x-auto sm:justify-center">
{task.branch_name && (
<HelpTip label="Git branch this task is being worked on">
<Badge