feat(themes): colour families with light/dark, follow system, corners, frames, accent
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 1m30s

- Fjord (new), Polarized Hell and Suri Hell complete the families
  Klassik, Fjord, Terrakotta, Polarized, Suri
- settings: family table, follow-system, corners, button frames and an own
  accent colour (per device); compact quick picker in the user menus
- code colours in index.css are fallbacks only

chore(release): v0.14.0

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
sandrodachandClaude Opus 5.5 committed 2026-10-30 23:29:52 +01:00
1 parent 2c9b4762fc
commit 3f0e596356
16 files changed
+949 -58

No files matched your search

+38 -4
View File
@@ -15,6 +15,10 @@
@import './themes/theme-terracotta-night.css';
@import './themes/theme-polarized.css';
@import './themes/theme-suri.css';
@import './themes/theme-fjord.css';
@import './themes/theme-fjord-night.css';
@import './themes/theme-polarized-light.css';
@import './themes/theme-suri-light.css';
@tailwind base;
@tailwind components;
@@ -413,8 +417,9 @@ body {
color: var(--text-main);
}
/* Prism Syntax Highlighting Tokens (VS Code Dark+ / Light+ via Theme Variables) */
:root {
/* Prism Syntax Highlighting Tokens (VS Code Dark+ / Light+ via Theme Variables).
Fallbacks only (:where has no specificity): a theme's own --code-* values always win. */
:where(:root) {
--code-keyword: #569cd6;
--code-string: #ce9178;
--code-number: #b5cea8;
@@ -426,8 +431,7 @@ body {
--code-variable: #9cdcfe;
}
:root:not(.dark):not([data-theme="terracotta"]),
:root[data-theme="light"] {
:where(:root:not(.dark)) {
--code-keyword: #0000ff;
--code-string: #a31515;
--code-number: #098658;
@@ -603,3 +607,33 @@ fieldset:disabled :is(button, input, select, textarea) {
animation: none !important;
}
}
/* Corner switch (Darstellung): overrides the theme's radii on every theme */
:root[data-corners='square'] {
--radius-card: 0px !important;
--radius-btn: 2px !important;
--radius-input: 2px !important;
--radius-checkbox: 0px !important;
}
:root[data-corners='round'] {
--radius-card: 12px !important;
--radius-btn: 8px !important;
--radius-input: 8px !important;
--radius-checkbox: 4px !important;
}
/* Button frames switch (Darstellung): without frames, regular buttons are a soft tint instead */
:root[data-button-borders='off'] :is(.btn-action, .btn-icon, .btn-secondary, .tab-btn, .chip-btn) {
border-color: transparent !important;
}
:root[data-button-borders='off'] :is(.btn-action, .btn-icon, .btn-secondary, .chip-btn):not(:disabled) {
background-color: color-mix(in srgb, var(--text-main) 6%, transparent);
}
:root[data-button-borders='off'] :is(.btn-action, .btn-icon, .btn-secondary, .chip-btn):not(:disabled):hover {
background-color: color-mix(in srgb, var(--text-main) 11%, transparent);
}
/* … the selected tab keeps a visible accent tint */
:root[data-button-borders='off'] .chip-btn.border-accent {
background-color: var(--accent-dim) !important;
color: var(--accent-primary);
}