From a115660d4bf65b9014f7588bd050f41bae2c8b71 Mon Sep 17 00:00:00 2001 From: scheinriese Date: Thu, 21 May 2026 13:48:27 +0200 Subject: [PATCH] fix(icon): themed ghost-highlight outline via --ls-border-color middle step MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The ghost-tile outline still rendered neutral gray (rx-gray-08) in OG because Tailwind's gray-08 fallback chain is only two steps deep (`--lx-gray-08 → --rx-gray-08`) — no `--ls-*` intermediate, unlike gray-01 through gray-07. Inject `--ls-border-color` manually as the middle step. In OG that resolves to #0e5263 (a themed teal border, one shade lighter than the quaternary-teal ghost bg #094b5a), giving a subtle outline that sits in the same hue family as the tile. Radix themes are unaffected (--lx-gray-08 still wins step 1). Co-Authored-By: Claude Opus 4.7 --- src/main/frontend/components/icon.css | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/main/frontend/components/icon.css b/src/main/frontend/components/icon.css index eb18f9f3e0..b75f0c97e5 100644 --- a/src/main/frontend/components/icon.css +++ b/src/main/frontend/components/icon.css @@ -264,7 +264,12 @@ `!important` semantics that beat the hover-bg rule on .icons-row buttons. */ @apply !bg-gray-04; - outline: 1.5px solid var(--lx-gray-08, var(--rx-gray-08)); + /* Tailwind's gray-08 chain stops at `--lx-gray-08, --rx-gray-08` — + no `--ls-*` step. Inject `--ls-border-color` manually so OG + (where `--lx-gray-08` is unset) picks up the themed teal border + (#0e5263, one step lighter than the bg) instead of falling to + neutral `--rx-gray-08`. */ + outline: 1.5px solid var(--lx-gray-08, var(--ls-border-color, var(--rx-gray-08))); outline-offset: -1.5px; }