Skip to content

Commit 0788e72

Browse files
committed
Fix logo glyph invisible in dark mode
The sidebar logo tile uses var(--text-primary) as its background, which inverts to near-white in dark mode, but the key glyph was hardcoded stroke="white" — washing out to white-on-white. Drive the glyph from currentColor and set the tile color to var(--surface) so it inverts against the tile and stays legible in both themes.
1 parent 17f5276 commit 0788e72

2 files changed

Lines changed: 3 additions & 1 deletion

File tree

docs/docs.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,8 @@ body {
5454
.docs-logo-mark {
5555
width: 30px; height: 30px; flex-shrink: 0;
5656
background: var(--text-primary); border-radius: var(--radius-sm);
57+
/* glyph inverts against the tile so it stays legible in both themes */
58+
color: var(--surface);
5759
display: flex; align-items: center; justify-content: center;
5860
}
5961
.docs-logo-name {

docs/docs.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
<a class="docs-logo" href="index.html">
1919
<div class="docs-logo-mark">
2020
<svg width="18" height="18" viewBox="0 0 48 48" fill="none">
21-
<path d="M41.9996 4L37.9996 8M37.9996 8L43.9996 14L36.9996 21L30.9996 15M37.9996 8L30.9996 15M22.7796 23.22C23.8123 24.2389 24.6332 25.4521 25.1951 26.7896C25.757 28.1271 26.0488 29.5625 26.0536 31.0133C26.0585 32.464 25.7763 33.9014 25.2234 35.2426C24.6705 36.5838 23.8577 37.8025 22.8319 38.8283C21.806 39.8541 20.5874 40.6669 19.2462 41.2198C17.9049 41.7728 16.4676 42.0549 15.0168 42.0501C13.5661 42.0452 12.1307 41.7534 10.7932 41.1915C9.45565 40.6296 8.24251 39.8087 7.22357 38.776C5.21983 36.7014 4.1111 33.9228 4.13616 31.0386C4.16122 28.1544 5.31808 25.3955 7.35757 23.356C9.39706 21.3165 12.156 20.1596 15.0402 20.1346C17.9243 20.1095 20.7029 21.2183 22.7776 23.222L22.7796 23.22ZM22.7796 23.22L30.9996 15" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
21+
<path d="M41.9996 4L37.9996 8M37.9996 8L43.9996 14L36.9996 21L30.9996 15M37.9996 8L30.9996 15M22.7796 23.22C23.8123 24.2389 24.6332 25.4521 25.1951 26.7896C25.757 28.1271 26.0488 29.5625 26.0536 31.0133C26.0585 32.464 25.7763 33.9014 25.2234 35.2426C24.6705 36.5838 23.8577 37.8025 22.8319 38.8283C21.806 39.8541 20.5874 40.6669 19.2462 41.2198C17.9049 41.7728 16.4676 42.0549 15.0168 42.0501C13.5661 42.0452 12.1307 41.7534 10.7932 41.1915C9.45565 40.6296 8.24251 39.8087 7.22357 38.776C5.21983 36.7014 4.1111 33.9228 4.13616 31.0386C4.16122 28.1544 5.31808 25.3955 7.35757 23.356C9.39706 21.3165 12.156 20.1596 15.0402 20.1346C17.9243 20.1095 20.7029 21.2183 22.7776 23.222L22.7796 23.22ZM22.7796 23.22L30.9996 15" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
2222
</svg>
2323
</div>
2424
<div>

0 commit comments

Comments
 (0)