From 858e7279b09b4b959a6e30673546043506ab8697 Mon Sep 17 00:00:00 2001 From: David Hill Date: Mon, 23 Mar 2026 13:19:23 +0000 Subject: [PATCH] tui: make remove buttons on comment chips and image attachments more visible with solid background and border --- packages/app/src/components/comment-chip.tsx | 2 +- packages/app/src/components/prompt-input/image-attachments.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/src/components/comment-chip.tsx b/packages/app/src/components/comment-chip.tsx index d3074484f4..58a339fe3f 100644 --- a/packages/app/src/components/comment-chip.tsx +++ b/packages/app/src/components/comment-chip.tsx @@ -22,7 +22,7 @@ type CommentChipProps = { const removeClass = "absolute top-0 right-0 size-6 opacity-0 pointer-events-none transition-opacity group-hover:opacity-100 group-hover:pointer-events-auto group-focus-within:opacity-100 group-focus-within:pointer-events-auto" const removeIconClass = - "absolute top-1 right-1 size-3.5 rounded-[var(--radius-sm)] flex items-center justify-center bg-transparent group-hover/remove:bg-surface-base-hover group-active/remove:bg-surface-base-active" + "absolute top-1 right-1 size-4 rounded-[var(--radius-sm)] border border-border-weak-base flex items-center justify-center bg-[var(--surface-raised-stronger-non-alpha)] group-active/remove:bg-surface-base-active" export const CommentChip: Component = (props) => { const variant = () => props.variant ?? "preview" diff --git a/packages/app/src/components/prompt-input/image-attachments.tsx b/packages/app/src/components/prompt-input/image-attachments.tsx index 294a830732..f0b78f265c 100644 --- a/packages/app/src/components/prompt-input/image-attachments.tsx +++ b/packages/app/src/components/prompt-input/image-attachments.tsx @@ -24,7 +24,7 @@ const imageClass = "size-12 rounded-[6px] object-cover border border-border-weak const removeClass = "absolute top-0 right-0 size-6 opacity-0 pointer-events-none transition-opacity group-hover:opacity-100 group-hover:pointer-events-auto group-focus-within:opacity-100 group-focus-within:pointer-events-auto" const removeIconClass = - "absolute top-1 right-1 size-3.5 rounded-[var(--radius-sm)] flex items-center justify-center bg-transparent group-hover/remove:bg-surface-base-hover group-active/remove:bg-surface-base-active" + "absolute top-1 right-1 size-4 rounded-[var(--radius-sm)] border border-border-weak-base flex items-center justify-center bg-[var(--surface-raised-stronger-non-alpha)] group-active/remove:bg-surface-base-active" export const PromptImageAttachments: Component = (props) => { return (