marek/guides
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
team3
2026-06-04 00:26:05 +02:00
parent c73d07be52
commit 614bce2c89
16 changed files with 491 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
templates/Format/Cheatsheet.md
View File

@@ -101,4 +101,21 @@ GENERIERUNG MIT FEEDBACK-LOOP (max 3 Iterationen)
INSTALLATION
- pip install weasyprint pdf2image
- apt install poppler-utils
```
```
DARKMODE (PFLICHT)
- Alle Farben ausschließlich über :root-Variablen definieren
(--ink, --muted, --line, --bg-soft, Akzent-Variablen).
- Zusätzlich einen Dunkelmodus-Block ausliefern:
@media screen {
html[data-theme="dark"] { ...dunkle Variablenwerte... }
html[data-theme="dark"] body { background: #15171c; }
}
- Die App aktiviert ihn über data-theme="dark" auf <html>.
KEIN prefers-color-scheme verwenden.
- Dunkle Werte: Hintergründe dunkel (#15171c / #23262e), Text hell (#e6e8ee),
Linien gedämpft (#2c3038). Akzentfarben so anheben, dass Überschriften und
Links auf dunklem Grund lesbar bleiben (Kontrast prüfen). Elemente mit hellem
Text auf Akzent-Hintergrund (z. B. Tabellenköpfe) dürfen ihre helle
Hintergrundfarbe behalten.
- Nur innerhalb von @media screen — Druck/PDF bleibt unverändert hell.

19
templates/Format/EndGuide.md
View File

@@ -140,4 +140,21 @@ CHECKLISTE PRO ABSCHNITT
INSTALLATION
- pip install weasyprint
- apt install poppler-utils (pdfinfo, pdftoppm, pdftotext)
- apt install poppler-utils (pdfinfo, pdftoppm, pdftotext)
DARKMODE (PFLICHT)
- Alle Farben ausschließlich über :root-Variablen definieren
(--ink, --muted, --line, --bg-soft, Akzent-Variablen).
- Zusätzlich einen Dunkelmodus-Block ausliefern:
@media screen {
html[data-theme="dark"] { ...dunkle Variablenwerte... }
html[data-theme="dark"] body { background: #15171c; }
}
- Die App aktiviert ihn über data-theme="dark" auf <html>.
KEIN prefers-color-scheme verwenden.
- Dunkle Werte: Hintergründe dunkel (#15171c / #23262e), Text hell (#e6e8ee),
Linien gedämpft (#2c3038). Akzentfarben so anheben, dass Überschriften und
Links auf dunklem Grund lesbar bleiben (Kontrast prüfen). Elemente mit hellem
Text auf Akzent-Hintergrund (z. B. Tabellenköpfe) dürfen ihre helle
Hintergrundfarbe behalten.
- Nur innerhalb von @media screen — Druck/PDF bleibt unverändert hell.

23
templates/Format/Guide.md
View File

@@ -751,4 +751,25 @@ Example (PHP-flavored, but the pattern is language-agnostic):
- [ ] Tables for comparisons/lists; code blocks only if technical, short, escaped
- [ ] Prose in the reader's language; terms explained on first use
- [ ] Built with WeasyPrint and **visually verified** by rendering pages
- [ ] Both HTML and PDF delivered
- [ ] Both HTML and PDF delivered
## 11. Dark mode (required)
The app toggles dark mode by setting `data-theme="dark"` on `<html>` inside its preview. Print/PDF always stays light.
- Define every color through the `:root` variables only (`--ink`, `--muted`, `--line`, `--bg-soft`, accent trio).
- Ship an additional override block:
```css
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee; --muted: #9aa3b2; --line: #2c3038; --bg-soft: #23262e;
/* lift accent shades so headings/links stay readable on dark */
}
html[data-theme="dark"] body { background: #15171c; }
}
```
- Do NOT use `prefers-color-scheme` — the app controls the attribute.
- Keep dark rules inside `@media screen` only, so WeasyPrint/PDF renders the light theme.
- Elements with light text on accent backgrounds (table headers, cover) may keep their light-theme background.

19
templates/Format/MiniGuide.md
View File

@@ -145,4 +145,21 @@ GENERIERUNG MIT FEEDBACK-LOOP (max 3 Iterationen)
INSTALLATION
- pip install weasyprint pdf2image
- apt install poppler-utils
```
```
DARKMODE (PFLICHT)
- Alle Farben ausschließlich über :root-Variablen definieren
(--ink, --muted, --line, --bg-soft, Akzent-Variablen).
- Zusätzlich einen Dunkelmodus-Block ausliefern:
@media screen {
html[data-theme="dark"] { ...dunkle Variablenwerte... }
html[data-theme="dark"] body { background: #15171c; }
}
- Die App aktiviert ihn über data-theme="dark" auf <html>.
KEIN prefers-color-scheme verwenden.
- Dunkle Werte: Hintergründe dunkel (#15171c / #23262e), Text hell (#e6e8ee),
Linien gedämpft (#2c3038). Akzentfarben so anheben, dass Überschriften und
Links auf dunklem Grund lesbar bleiben (Kontrast prüfen). Elemente mit hellem
Text auf Akzent-Hintergrund (z. B. Tabellenköpfe) dürfen ihre helle
Hintergrundfarbe behalten.
- Nur innerhalb von @media screen — Druck/PDF bleibt unverändert hell.

19
templates/Format/OnePager.md
View File

@@ -93,4 +93,21 @@ GENERIERUNG MIT FEEDBACK-LOOP (max 3 Iterationen)
INSTALLATION
- pip install weasyprint pdf2image
- apt install poppler-utils
```
```
DARKMODE (PFLICHT)
- Alle Farben ausschließlich über :root-Variablen definieren
(--ink, --muted, --line, --bg-soft, Akzent-Variablen).
- Zusätzlich einen Dunkelmodus-Block ausliefern:
@media screen {
html[data-theme="dark"] { ...dunkle Variablenwerte... }
html[data-theme="dark"] body { background: #15171c; }
}
- Die App aktiviert ihn über data-theme="dark" auf <html>.
KEIN prefers-color-scheme verwenden.
- Dunkle Werte: Hintergründe dunkel (#15171c / #23262e), Text hell (#e6e8ee),
Linien gedämpft (#2c3038). Akzentfarben so anheben, dass Überschriften und
Links auf dunklem Grund lesbar bleiben (Kontrast prüfen). Elemente mit hellem
Text auf Akzent-Hintergrund (z. B. Tabellenköpfe) dürfen ihre helle
Hintergrundfarbe behalten.
- Nur innerhalb von @media screen — Druck/PDF bleibt unverändert hell.

11
templates/Referenz/Cheatsheet.md
View File

@@ -22,6 +22,17 @@
--minus: #c0392b;
}
/* Darkmode — die App setzt data-theme="dark" auf <html>; Druck/PDF bleibt hell */
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee;
--muted: #9aa3b2;
--line: #2c3038;
--bg-soft: #23262e;
}
html[data-theme="dark"] body { background: #15171c; }
}
html, body {
font-family: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
color: var(--ink);

11
templates/Referenz/EndGuide.md
View File

@@ -59,6 +59,17 @@
--neutral: #b8860b;
}
/* Darkmode — die App setzt data-theme="dark" auf <html>; Druck/PDF bleibt hell */
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee;
--muted: #9aa3b2;
--line: #2c3038;
--bg-soft: #23262e;
}
html[data-theme="dark"] body { background: #15171c; }
}
html, body {
font-family: Charter, "Source Serif Pro", Georgia, serif;
color: var(--ink);

11
templates/Referenz/Guide.md
View File

@@ -64,6 +64,17 @@
--neutral: #b8860b;
}
/* Darkmode — die App setzt data-theme="dark" auf <html>; Druck/PDF bleibt hell */
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee;
--muted: #9aa3b2;
--line: #2c3038;
--bg-soft: #23262e;
}
html[data-theme="dark"] body { background: #15171c; }
}
html, body {
font-family: Charter, "Source Serif Pro", Georgia, serif;
color: var(--ink);

11
templates/Referenz/MiniGuide.md
View File

@@ -38,6 +38,17 @@
--minus: #c0392b;
}
/* Darkmode — die App setzt data-theme="dark" auf <html>; Druck/PDF bleibt hell */
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee;
--muted: #9aa3b2;
--line: #2c3038;
--bg-soft: #23262e;
}
html[data-theme="dark"] body { background: #15171c; }
}
html, body {
font-family: Charter, "Source Serif Pro", Georgia, serif;
color: var(--ink);

11
templates/Referenz/OnePager.md
View File

@@ -19,6 +19,17 @@
--bg-soft: #f5f5fb;
}
/* Darkmode — die App setzt data-theme="dark" auf <html>; Druck/PDF bleibt hell */
@media screen {
html[data-theme="dark"] {
--ink: #e6e8ee;
--muted: #9aa3b2;
--line: #2c3038;
--bg-soft: #23262e;
}
html[data-theme="dark"] body { background: #15171c; }
}
html, body {
font-family: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
color: var(--ink);