Lift the selected tab and clipboard label above 4.5:1

Both drew small text in the raw accent, which misses the contrast floor on
a dark surface. They now blend the accent toward the text colour, as the
unselected tab already does.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
ClintchizandClaude Opus 5 committed 2026-09-18 16:32:20 +05:30
1 parent 32d3cac828
commit 03efca5bda
3 files changed
+5 -4

No files matched your search

+1 -1
View File
@@ -86,7 +86,7 @@ component Clipboard {
.wrn-clipboard__description { margin: 0; color: var(--wrn-color-muted); font-size: 0.8rem; }
.wrn-clipboard__control { display: flex; min-width: 0; align-items: stretch; overflow: hidden; border: 1px solid var(--wrn-color-border); border-radius: var(--wrn-radius); background: var(--wrn-color-surface); box-shadow: var(--wrn-shadow-1); }
.wrn-clipboard__value { min-width: 0; flex: 1; overflow: auto; padding: 0.7rem 0.85rem; color: var(--wrn-color-text); background: var(--wrn-color-surface-2); font: inherit; font-family: var(--wrn-font-mono, ui-monospace, monospace); white-space: nowrap; }
.wrn-clipboard__button { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.6rem 0.85rem; border: 0; border-left: 1px solid var(--wrn-color-border); color: var(--wrn-color-primary); background: transparent; font: inherit; font-size: 0.8rem; font-weight: 700; cursor: pointer; }
.wrn-clipboard__button { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.6rem 0.85rem; border: 0; border-left: 1px solid var(--wrn-color-border); color: color-mix(in srgb, var(--wrn-color-primary) 72%, var(--wrn-color-text)); background: transparent; font: inherit; font-size: 0.8rem; font-weight: 700; cursor: pointer; }
.wrn-clipboard__button:hover { background: var(--wrn-color-primary-soft); }
.wrn-clipboard__button:focus-visible { outline: 2px solid var(--wrn-color-focus); outline-offset: -3px; }
.wrn-clipboard__button:disabled { cursor: not-allowed; opacity: 0.55; }
+2 -1
View File
@@ -277,7 +277,8 @@ component Tabs {
.wrn-tabs__tab[aria-selected="true"] {
background: var(--wrn-color-surface);
color: var(--tabs-accent);
/* Small text on the accent alone misses 4.5:1, so it blends toward the text colour. */
color: color-mix(in srgb, var(--tabs-accent) 72%, var(--wrn-color-text));
box-shadow: var(--wrn-shadow-1);
}