Hermes Agent
9491b78c2d
- --vb-* Design-Token für [data-bs-theme=dark] überschrieben - .vorbestell-box: background:#fff → #1e1e2e - .vorbestell-box__panel: tint → dark tint - .bsn-facts: background:#fff → #1e1e2e - .bsn-facts__tile: tint → dark tint - bsn-infobox, bsn-table, bsn-dachzeile, bsn-meta, bsn-recherche Text- und Border-Farben für Dark Mode Einfügen in: Astroid → Template Options → Custom Code → Custom CSS
88 lines
2.5 KiB
CSS
88 lines
2.5 KiB
CSS
/* ═══════════════════════════════════════════════════════════════════
|
|
BSN Dark Mode — Vorbestell-Box & bsn-facts (09.07.2026)
|
|
═══════════════════════════════════════════════════════════════════
|
|
EINFÜGEN IN: Astroid → Template Options → Custom Code → Custom CSS
|
|
Die Variablen-Überschreibungen müssen VOR den Komponenten-Regeln stehen.
|
|
═══════════════════════════════════════════════════════════════════ */
|
|
|
|
/* ── 1. DESIGN-TOKEN: vb-Variablen für Dark Mode ── */
|
|
[data-bs-theme="dark"] {
|
|
--vb-tint: #252538;
|
|
--vb-tint-border: #3a3a5c;
|
|
--vb-muted: #9090c0;
|
|
--vb-text: #c8c8d8;
|
|
--vb-accent: #7b7fd4;
|
|
--vb-accent-dark: #a0a4e8;
|
|
--vb-accent-hover: #9498e0;
|
|
}
|
|
|
|
/* ── 2. Vorbestell-Box ── */
|
|
[data-bs-theme="dark"] .vorbestell-box {
|
|
background: #1e1e2e;
|
|
}
|
|
|
|
[data-bs-theme="dark"] .vorbestell-box__panel {
|
|
background: var(--vb-tint);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .vorbestell-box__btn {
|
|
background: var(--vb-accent);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .vorbestell-box__btn:hover {
|
|
background: var(--vb-accent-hover);
|
|
}
|
|
|
|
/* ── 3. bsn-facts ── */
|
|
[data-bs-theme="dark"] .bsn-facts {
|
|
background: #1e1e2e;
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-facts__tile {
|
|
background: var(--vb-tint);
|
|
}
|
|
|
|
/* ── 4. bsn-infobox (Legacy) ── */
|
|
[data-bs-theme="dark"] .bsn-infobox {
|
|
background: #1e1e2e;
|
|
border-color: var(--vb-tint-border);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-infobox td {
|
|
border-color: var(--vb-tint-border);
|
|
color: var(--vb-text);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-infobox td:first-child {
|
|
color: var(--vb-accent-dark);
|
|
}
|
|
|
|
/* ── 5. bsn-table (Legacy) ── */
|
|
[data-bs-theme="dark"] .bsn-table td {
|
|
border-color: var(--vb-tint-border);
|
|
color: var(--vb-text);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-table td:first-child {
|
|
color: var(--vb-accent-dark);
|
|
}
|
|
|
|
/* ── 6. Text-Elemente ── */
|
|
[data-bs-theme="dark"] .bsn-dachzeile {
|
|
color: #aaa;
|
|
border-color: var(--vb-tint-border);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-meta {
|
|
color: #888;
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-recherche {
|
|
color: #888;
|
|
border-color: var(--vb-tint-border);
|
|
}
|
|
|
|
[data-bs-theme="dark"] .bsn-quellen h3 {
|
|
color: var(--vb-accent-dark);
|
|
}
|