fix(mana/web): drop stray closing paren from hsl(var(--color-X))) CSS

The mechanical var()→hsl(var()) sweep in commit 6e20c298a left 14
lines across spiral/+page.svelte and KeyboardShortcutsModal.svelte
with three closing parens instead of two:

  background: hsl(var(--color-card)));
                                    ^ extra

Each of those originals had a hex fallback like
`var(--color-card, #fff)` and the replacer kept the trailing close
paren after dropping the fallback. The styles never showed up wrong
in the browser because the parser silently dropped the entire
declaration, but Tailwind 4's CSS validator catches it now and the
production build fails with "Missing opening (".

Mechanical fix via sed `s/hsl\(var\(--color-([a-z-]+)\)\)\);/
hsl(var(--color-$1));/g` on the two files. No semantic change.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-09 01:59:10 +02:00
parent c06e685754
commit 73d8e5c7ba
2 changed files with 14 additions and 14 deletions

View file

@ -56,7 +56,7 @@
transform: translate(-50%, -50%);
z-index: 55;
background: hsl(var(--color-card));
border: 1px solid hsl(var(--color-border)));
border: 1px solid hsl(var(--color-border));
border-radius: 12px;
padding: 24px;
min-width: 320px;
@ -89,7 +89,7 @@
}
.close-btn:hover {
background: hsl(var(--color-muted)));
background: hsl(var(--color-muted));
}
.shortcut-list {
@ -114,8 +114,8 @@
display: inline-flex;
align-items: center;
padding: 2px 8px;
background: hsl(var(--color-muted)));
border: 1px solid hsl(var(--color-border)));
background: hsl(var(--color-muted));
border: 1px solid hsl(var(--color-border));
border-radius: 5px;
font-size: 12px;
font-family: system-ui, sans-serif;

View file

@ -306,8 +306,8 @@
}
.section {
background: hsl(var(--color-card)));
border: 1px solid hsl(var(--color-border)));
background: hsl(var(--color-card));
border: 1px solid hsl(var(--color-border));
border-radius: 12px;
padding: 1.25rem;
}
@ -398,7 +398,7 @@
}
.pixel-detail code {
background: hsl(var(--color-background)));
background: hsl(var(--color-background));
padding: 0.125rem 0.5rem;
border-radius: 4px;
font-family: monospace;
@ -427,7 +427,7 @@
.stat {
text-align: center;
padding: 0.75rem;
background: hsl(var(--color-background)));
background: hsl(var(--color-background));
border-radius: 8px;
}
@ -466,7 +466,7 @@
.app-card {
padding: 0.75rem;
background: hsl(var(--color-background)));
background: hsl(var(--color-background));
border-radius: 8px;
}
@ -492,7 +492,7 @@
.app-bar {
height: 4px;
background: hsl(var(--color-border)));
background: hsl(var(--color-border));
border-radius: 2px;
overflow: hidden;
margin-bottom: 0.375rem;
@ -569,15 +569,15 @@
border-radius: 8px;
font-size: 0.875rem;
font-weight: 500;
border: 1px solid hsl(var(--color-border)));
background: hsl(var(--color-background)));
border: 1px solid hsl(var(--color-border));
background: hsl(var(--color-background));
color: hsl(var(--color-foreground));
cursor: pointer;
transition: all 0.15s;
}
.btn:hover:not(:disabled) {
background: hsl(var(--color-accent)));
background: hsl(var(--color-accent));
}
.btn:disabled {
@ -606,7 +606,7 @@
.info-box {
padding: 1rem;
background: hsl(var(--color-background)));
background: hsl(var(--color-background));
border-radius: 8px;
border-left: 4px solid hsl(var(--color-primary));
}