libretech
351e3dfc23
per user-request einen branch der main-content UND rewrite-content trägt — saubere separierung statt symlink/merge-conflict. struktur: - slides/<course>/ → main-content restored, eigene assets (kein new-demo-leak) - slides/<course>-2026/ → rewrite-content, eigene assets (komplett kopiert + new demos) Makefile: COURSES += 223015b-2026 223015c-2026 dhbw-2026 mit eigenen NAME/KAPITEL/DEPLOY/KLAUSUR-konfig. Klausur für b+c=1, dhbw=leer. Deploy-paths /hdm/223015b-2026 etc. make build durchlaufen für alle 6 decks, 0 fehler. dedup: 223015c+dhbw assets identisch in beiden ordnern (kein neu-demos auf b ergänzt). 223015b 86 → 120 files in -2026 (= +34 neue eroeffner/usb-c-drei-achsen/container-vs-codec/etc).
64 lines
2.8 KiB
HTML
64 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Test Automation Trophy</title>
|
|
<style>
|
|
:root {
|
|
--dark: #1a1a2e;
|
|
--muted: #6b7280;
|
|
--border: #cbd5e1;
|
|
--bg-soft: #f8fafc;
|
|
}
|
|
html, body { margin: 0; padding: 0; background: #fff; min-height: 100vh; font-family: system-ui, -apple-system, sans-serif; color: var(--dark); }
|
|
body { padding: 28px 32px; display: flex; flex-direction: column; align-items: center; }
|
|
h1 { margin: 0 0 4px; font-size: 1.55rem; text-align: center; }
|
|
.sub { color: var(--muted); margin-bottom: 28px; font-size: 0.92rem; text-align: center; }
|
|
|
|
.trophy { display: flex; flex-direction: column; align-items: center; gap: 0; width: 480px; }
|
|
|
|
.layer {
|
|
display: flex; align-items: center; justify-content: center;
|
|
font-weight: 700; font-size: 1.05rem; color: var(--dark);
|
|
border-radius: 6px; transition: opacity 0.2s;
|
|
}
|
|
.layer .count {
|
|
font-size: 0.78rem; font-weight: 400; color: var(--muted);
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.e2e { background: #fca5a5; width: 40%; height: 54px; clip-path: polygon(10% 100%, 90% 100%, 100% 0%, 0% 0%); }
|
|
.integration{ background: #60a5fa; width: 80%; height: 86px; }
|
|
.unit { background: #c4b5fd; width: 40%; height: 54px; clip-path: polygon(0% 100%, 100% 100%, 85% 0%, 15% 0%); }
|
|
.static { background: #fde68a; width: 28%; height: 60px; clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 20% 100%); }
|
|
|
|
.legend {
|
|
margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr;
|
|
gap: 8px 24px; font-size: 0.88rem; width: 480px;
|
|
}
|
|
.leg { display: flex; align-items: center; gap: 10px; }
|
|
.swatch { width: 16px; height: 16px; border-radius: 3px; flex-shrink: 0; }
|
|
.leg strong { display: block; }
|
|
.leg span { color: var(--muted); font-size: 0.82rem; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Test Automation Trophy</h1>
|
|
<p class="sub">Schicht-Modell nach Kent C. Dodds — Breite = empfohlener Anteil</p>
|
|
|
|
<div class="trophy">
|
|
<div class="layer e2e">E2E</div>
|
|
<div class="layer integration">Integration</div>
|
|
<div class="layer unit">Unit</div>
|
|
<div class="layer static">Static</div>
|
|
</div>
|
|
|
|
<div class="legend">
|
|
<div class="leg"><div class="swatch" style="background:#fde68a"></div><div><strong>Static</strong><span>Linting, Type-Check, Format</span></div></div>
|
|
<div class="leg"><div class="swatch" style="background:#c4b5fd"></div><div><strong>Unit</strong><span>Einzelne Funktionen / Komponenten</span></div></div>
|
|
<div class="leg"><div class="swatch" style="background:#60a5fa"></div><div><strong>Integration</strong><span>Zusammenspiel mehrerer Teile ← Fokus</span></div></div>
|
|
<div class="leg"><div class="swatch" style="background:#fca5a5"></div><div><strong>End to End</strong><span>Ganzer User-Flow im Browser</span></div></div>
|
|
</div>
|
|
</body>
|
|
</html>
|