Initial commit: WrestleDesk full project

- Django backend with DRF (clubs, wrestlers, trainers, exercises, templates, trainings, homework, locations, leistungstest)
- Next.js 16 frontend with React, Shadcn UI, Tailwind
- JWT authentication
- Full CRUD for all entities
- Calendar view for trainings
- Homework management system
- Leistungstest tracking
This commit is contained in:
Andrej Spielmann
2026-03-26 13:24:57 +01:00
commit 3fefc550fe
256 changed files with 38295 additions and 0 deletions
@@ -0,0 +1 @@
{"reason":"idle timeout","timestamp":1774346494860}
@@ -0,0 +1 @@
12159
@@ -0,0 +1,130 @@
<h2>Leistungstest Timer — Layout</h2>
<p class="subtitle">Pro Ringer: links Info/Timer, rechts Übungen. Timer läuft durchgehend.</p>
<div class="split">
<div class="mockup">
<div class="mockup-header">Ringer 1: Max Mustermann</div>
<div class="mockup-body" style="padding:16px;background:#f8fafc">
<div style="text-align:center;margin-bottom:12px">
<div style="font-size:48px;font-weight:bold;font-family:monospace">05:23</div>
<div style="font-size:12px;color:#64748b">Gesamtzeit</div>
</div>
<div style="display:flex;gap:8px;justify-content:center;margin-bottom:16px">
<button class="mock-button" style="background:#1B1A55;color:white;padding:8px 16px;border-radius:6px;border:none;font-size:13px">⏸ Pausieren</button>
</div>
<div style="border:1px solid #e2e8f0;border-radius:8px;overflow:hidden">
<div style="background:#f1f5f9;padding:8px 12px;font-size:12px;font-weight:600;color:#475569;border-bottom:1px solid #e2e8f0">
ÜBUNGEN
</div>
<div style="padding:12px;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#dcfce7;border-radius:6px;border:1px solid #86efac">
<div>
<div style="font-weight:500;font-size:13px">Liegestütze</div>
<div style="font-size:11px;color:#64748b">Soll: 30s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#22c55e;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">✓ 0:12</span>
<span style="color:#22c55e;font-size:18px"></span>
</div>
</div>
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#fef9c3;border-radius:6px;border:1px solid #fde047">
<div>
<div style="font-weight:500;font-size:13px">Kniebeugen</div>
<div style="font-size:11px;color:#64748b">Soll: 45s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#eab308;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">⏸ 0:28</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:12px;cursor:pointer">✓ Erledigt</button>
</div>
</div>
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#f8fafc;border-radius:6px;border:1px solid #e2e8f0">
<div>
<div style="font-weight:500;font-size:13px">Burpees</div>
<div style="font-size:11px;color:#64748b">Soll: 20s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#94a3b8;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">Ausstehend</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:12px;cursor:pointer">▶ Start</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="mockup">
<div class="mockup-header">Ringer 2: Anna Schmidt</div>
<div class="mockup-body" style="padding:16px;background:#f8fafc">
<div style="text-align:center;margin-bottom:12px">
<div style="font-size:48px;font-weight:bold;font-family:monospace;color:#94a3b8">02:41</div>
<div style="font-size:12px;color:#64748b">Gesamtzeit</div>
</div>
<div style="display:flex;gap:8px;justify-content:center;margin-bottom:16px">
<button class="mock-button" style="background:#1B1A55;color:white;padding:8px 16px;border-radius:6px;border:none;font-size:13px">▶ Fortsetzen</button>
</div>
<div style="border:1px solid #e2e8f0;border-radius:8px;overflow:hidden">
<div style="background:#f1f5f9;padding:8px 12px;font-size:12px;font-weight:600;color:#475569;border-bottom:1px solid #e2e8f0">
ÜBUNGEN
</div>
<div style="padding:12px;display:flex;flex-direction:column;gap:8px">
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#fef9c3;border-radius:6px;border:1px solid #fde047">
<div>
<div style="font-weight:500;font-size:13px">Liegestütze</div>
<div style="font-size:11px;color:#64748b">Soll: 30s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#eab308;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">⏸ 0:31</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:12px;cursor:pointer">✓ Erledigt</button>
</div>
</div>
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#f8fafc;border-radius:6px;border:1px solid #e2e8f0">
<div>
<div style="font-weight:500;font-size:13px">Kniebeugen</div>
<div style="font-size:11px;color:#64748b">Soll: 45s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#94a3b8;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">Ausstehend</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:12px;cursor:pointer">▶ Start</button>
</div>
</div>
<div style="display:flex;justify-content:space-between;align-items:center;padding:8px;background:#f8fafc;border-radius:6px;border:1px solid #e2e8f0">
<div>
<div style="font-weight:500;font-size:13px">Burpees</div>
<div style="font-size:11px;color:#64748b">Soll: 20s</div>
</div>
<div style="display:flex;align-items:center;gap:8px">
<span style="background:#94a3b8;color:white;padding:4px 10px;border-radius:12px;font-size:11px;font-weight:600">Ausstehend</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:12px;cursor:pointer">▶ Start</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section" style="margin-top:16px">
<h3>Zustände pro Übung</h3>
<div style="display:flex;gap:16px;margin-top:8px;flex-wrap:wrap">
<div style="flex:1;min-width:140px;padding:12px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0">
<div style="font-weight:600;font-size:12px;color:#64748b;margin-bottom:4px">AUSSTEHEND</div>
<div style="font-size:11px;color:#94a3b8">Grau — noch nicht gestartet</div>
<div style="margin-top:6px;font-size:12px">Button: ▶ Start</div>
</div>
<div style="flex:1;min-width:140px;padding:12px;background:#fef9c3;border-radius:8px;border:1px solid #fde047">
<div style="font-weight:600;font-size:12px;color:#a16207;margin-bottom:4px">AKTIV / LÄUFT</div>
<div style="font-size:11px;color:#a16207">Gelb — Timer läuft für diese Übung</div>
<div style="margin-top:6px;font-size:12px">Button: ✓ Erledigt (speichert Zeit)</div>
</div>
<div style="flex:1;min-width:140px;padding:12px;background:#dcfce7;border-radius:8px;border:1px solid #86efac">
<div style="font-weight:600;font-size:12px;color:#166534;margin-bottom:4px">ERLEDIGT</div>
<div style="font-size:11px;color:#166534">Grün — Zeit gespeichert, keine Aktion mehr</div>
<div style="margin-top:6px;font-size:12px">Zeit badge: ✓ 0:12</div>
</div>
</div>
</div>
<p style="font-size:12px;color:#94a3b8;margin-top:12px">
<strong>Wichtig:</strong> Der globale Timer läuft durchgehend (nicht reset zwischen Übungen).
Jede Übung hat eine eigene "Erledigt"-Zeit. Soll = Zeit (Sekunden), kein Reps.
</p>
@@ -0,0 +1,103 @@
<h2>Leistungstest Timer — Alle Ringer links, Übungen rechts</h2>
<p class="subtitle">Eine gemeinsame Zeit. Pro Übung "Erledigt" klicken = Zeit wird gespeichert.</p>
<div style="display:flex;gap:16px;align-items:flex-start">
<!-- LINKS: Ringer-Liste -->
<div style="width:260px;flex-shrink:0">
<div style="font-weight:600;font-size:13px;color:#475569;margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px">Ringer</div>
<div style="border:1px solid #e2e8f0;border-radius:10px;overflow:hidden">
<div style="background:#f1f5f9;padding:10px 12px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center">
<span style="font-size:12px;font-weight:600;color:#475569">3 Ringer</span>
<span style="font-size:11px;color:#64748b">2/3 erledigt</span>
</div>
<div style="padding:8px;display:flex;flex-direction:column;gap:4px">
<div style="padding:10px 10px;border-radius:8px;border:2px solid #22c55e;background:#dcfce7;cursor:pointer">
<div style="font-weight:500;font-size:13px">Max Mustermann</div>
<div style="font-size:11px;color:#166534;margin-top:2px">✓ 3/3 Übungen</div>
</div>
<div style="padding:10px 10px;border-radius:8px;border:2px solid #1B1A55;background:#f8fafc;cursor:pointer">
<div style="font-weight:500;font-size:13px">Anna Schmidt</div>
<div style="font-size:11px;color:#64748b;margin-top:2px">2/3 Übungen</div>
</div>
<div style="padding:10px 10px;border-radius:8px;border:1px solid #e2e8f0;background:#f8fafc;cursor:pointer;opacity:0.7">
<div style="font-weight:500;font-size:13px">Tom Klein</div>
<div style="font-size:11px;color:#94a3b8;margin-top:2px">0/3 Übungen</div>
</div>
</div>
</div>
</div>
<!-- RECHTS: Timer + Übungen -->
<div style="flex:1">
<!-- Globaler Timer -->
<div style="background:#1B1A55;border-radius:12px;padding:20px;text-align:center;margin-bottom:16px">
<div style="font-size:14px;font-weight:600;color:#9290C3;margin-bottom:4px;text-transform:uppercase;letter-spacing:1px">Gemeinsame Zeit</div>
<div style="font-size:64px;font-weight:bold;color:white;font-family:monospace;letter-spacing:2px">05:23</div>
<div style="margin-top:12px;display:flex;gap:8px;justify-content:center">
<button style="background:rgba(255,255,255,0.15);color:white;padding:8px 20px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">⏸ Pausieren</button>
<button style="background:#dc2626;color:white;padding:8px 20px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">■ Training beenden</button>
</div>
</div>
<!-- Aktueller Ringer -->
<div style="margin-bottom:12px;display:flex;align-items:center;gap:8px">
<div style="width:8px;height:8px;border-radius:50%;background:#22c55e"></div>
<span style="font-weight:600;font-size:15px">Anna Schmidt</span>
<span style="font-size:12px;color:#64748b;background:#f1f5f9;padding:2px 8px;border-radius:10px">2/3 erledigt</span>
</div>
<!-- Übungen -->
<div style="border:1px solid #e2e8f0;border-radius:10px;overflow:hidden">
<div style="background:#f1f5f9;padding:10px 14px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center">
<span style="font-size:12px;font-weight:600;color:#475569">ÜBUNGEN</span>
<span style="font-size:11px;color:#64748b">Soll-Zeit in Sekunden</span>
</div>
<!-- Übung 1: Erledigt -->
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#dcfce7">
<div style="width:28px;height:28px;border-radius:50%;background:#22c55e;display:flex;align-items:center;justify-content:center;color:white;font-size:16px;font-weight:bold;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px">Liegestütze</div>
<div style="font-size:12px;color:#64748b">Soll: 30s</div>
</div>
<div style="display:flex;align-items:center;gap:10px">
<span style="background:#166534;color:white;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600">✓ 0:28</span>
<span style="font-size:12px;color:#64748b">+2s</span>
</div>
</div>
<!-- Übung 2: Aktiv -->
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#fef9c3">
<div style="width:28px;height:28px;border-radius:50%;background:#eab308;display:flex;align-items:center;justify-content:center;color:white;font-size:14px;font-weight:bold;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px">Kniebeugen</div>
<div style="font-size:12px;color:#a16207">Soll: 45s · <strong>Aktiv!</strong></div>
</div>
<div style="display:flex;align-items:center;gap:10px">
<span style="background:#a16207;color:white;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600">⏸ 0:31</span>
<button style="background:#166534;color:white;padding:8px 16px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">✓ Erledigt</button>
</div>
</div>
<!-- Übung 3: Ausstehend -->
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#fff">
<div style="width:28px;height:28px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:12px;font-weight:bold;flex-shrink:0">3</div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px">Burpees</div>
<div style="font-size:12px;color:#94a3b8">Soll: 20s</div>
</div>
<div style="display:flex;align-items:center;gap:10px">
<span style="background:#e2e8f0;color:#64748b;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600"></span>
<button style="background:#1B1A55;color:white;padding:8px 16px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">▶ Start</button>
</div>
</div>
</div>
<!-- Hinweis -->
<div style="margin-top:12px;padding:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;font-size:12px;color:#64748b">
<strong>Anna ist dran:</strong> Die aktive Übung ist gelb markiert. Klicke "Start" bei Burpees um die Zeit zu starten, dann "Erledigt" um die Zeit zu speichern. Alle Ringer teilen sich die gleiche Gesamtzeit.
</div>
</div>
</div>
@@ -0,0 +1,178 @@
<h2>Pro Ringer: eigene Übungen, auto-start nach Erledigt</h2>
<p class="subtitle">Klick "Erledigt" → nächste Übung startet automatisch. Alle Ringer parallel, eigene Geschwindigkeit.</p>
<div style="display:flex;gap:16px;align-items:flex-start">
<!-- LINKS: Ringer-Liste -->
<div style="width:240px;flex-shrink:0">
<div style="font-weight:600;font-size:13px;color:#475569;margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px">Ringer</div>
<div style="border:1px solid #e2e8f0;border-radius:10px;overflow:hidden">
<div style="background:#f1f5f9;padding:10px 12px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center">
<span style="font-size:12px;font-weight:600;color:#475569">3 Ringer</span>
<span style="font-size:11px;color:#64748b">2/3 ✓</span>
</div>
<div style="padding:8px;display:flex;flex-direction:column;gap:4px">
<!-- Max: alle erledigt -->
<div style="padding:10px;border-radius:8px;border:2px solid #22c55e;background:#dcfce7;cursor:pointer">
<div style="font-weight:600;font-size:13px">Max Mustermann</div>
<div style="font-size:11px;color:#166534;margin-top:3px">✓ Alle 3 Übungen</div>
<div style="margin-top:6px;display:flex;flex-direction:column;gap:3px">
<div style="font-size:10px;background:#bbf7d0;color:#166534;padding:2px 6px;border-radius:4px;text-align:center">✓ Liegestütze 0:28</div>
<div style="font-size:10px;background:#bbf7d0;color:#166534;padding:2px 6px;border-radius:4px;text-align:center">✓ Kniebeugen 0:44</div>
<div style="font-size:10px;background:#bbf7d0;color:#166534;padding:2px 6px;border-radius:4px;text-align:center">✓ Burpees 0:19</div>
</div>
</div>
<!-- Anna: aktiv bei Übung 2 -->
<div style="padding:10px;border-radius:8px;border:2px solid #1B1A55;background:#f8fafc;cursor:pointer">
<div style="font-weight:600;font-size:13px">Anna Schmidt</div>
<div style="font-size:11px;color:#1B1A55;margin-top:3px">Übung 2 von 3</div>
<div style="margin-top:6px;display:flex;flex-direction:column;gap:3px">
<div style="font-size:10px;background:#bbf7d0;color:#166534;padding:2px 6px;border-radius:4px;text-align:center">✓ Liegestütze 0:28</div>
<div style="font-size:10px;background:#fef9c3;color:#a16207;padding:2px 6px;border-radius:4px;text-align:center;border:1px solid #fde047">▶ Kniebeugen 0:31</div>
<div style="font-size:10px;background:#f1f5f9;color:#94a3b8;padding:2px 6px;border-radius:4px;text-align:center">○ Burpees</div>
</div>
</div>
<!-- Tom: noch nicht gestartet -->
<div style="padding:10px;border-radius:8px;border:1px solid #e2e8f0;background:#f8fafc;cursor:pointer;opacity:0.7">
<div style="font-weight:500;font-size:13px">Tom Klein</div>
<div style="font-size:11px;color:#94a3b8;margin-top:3px">Noch nicht gestartet</div>
<div style="margin-top:6px;display:flex;flex-direction:column;gap:3px">
<div style="font-size:10px;background:#f1f5f9;color:#94a3b8;padding:2px 6px;border-radius:4px;text-align:center">○ Liegestütze</div>
<div style="font-size:10px;background:#f1f5f9;color:#94a3b8;padding:2px 6px;border-radius:4px;text-align:center">○ Kniebeugen</div>
<div style="font-size:10px;background:#f1f5f9;color:#94a3b8;padding:2px 6px;border-radius:4px;text-align:center">○ Burpees</div>
</div>
</div>
</div>
</div>
</div>
<!-- RECHTS: Detail-Ansicht des ausgewählten Ringers -->
<div style="flex:1">
<!-- Globaler Timer -->
<div style="background:#1B1A55;border-radius:12px;padding:20px;text-align:center;margin-bottom:16px">
<div style="font-size:14px;font-weight:600;color:#9290C3;margin-bottom:4px;text-transform:uppercase;letter-spacing:1px">Gemeinsame Zeit</div>
<div style="font-size:64px;font-weight:bold;color:white;font-family:monospace;letter-spacing:2px">05:23</div>
<div style="margin-top:12px;display:flex;gap:8px;justify-content:center">
<button style="background:rgba(255,255,255,0.15);color:white;padding:8px 20px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">⏸ Pausieren</button>
<button style="background:#dc2626;color:white;padding:8px 20px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">■ Training beenden</button>
</div>
</div>
<!-- Ringer Header -->
<div style="margin-bottom:12px;display:flex;align-items:center;gap:10px">
<div style="width:10px;height:10px;border-radius:50%;background:#1B1A55"></div>
<span style="font-weight:700;font-size:18px">Anna Schmidt</span>
<span style="font-size:12px;color:#64748b;background:#f1f5f9;padding:3px 10px;border-radius:10px">Übung 2 von 3</span>
<span style="font-size:12px;color:#166534;background:#dcfce7;padding:3px 10px;border-radius:10px">1/3 ✓</span>
</div>
<!-- Anna's Übungen -->
<div style="border:1px solid #e2e8f0;border-radius:10px;overflow:hidden">
<div style="background:#f1f5f9;padding:10px 14px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center">
<span style="font-size:12px;font-weight:600;color:#475569">ANNA's ÜBUNGEN</span>
<span style="font-size:11px;color:#64748b">Soll-Zeit</span>
</div>
<!-- Übung 1: Erledigt -->
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#dcfce7">
<div style="width:32px;height:32px;border-radius:50%;background:#22c55e;display:flex;align-items:center;justify-content:center;color:white;font-size:18px;font-weight:bold;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:600;font-size:15px">Liegestütze</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#64748b;text-decoration:line-through">Soll: 30s</div>
<div style="font-size:14px;font-weight:700;color:#166534">✓ 0:28</div>
</div>
<div style="width:80px;text-align:center">
<span style="font-size:11px;color:#166534;background:#bbf7d0;padding:3px 8px;border-radius:10px;font-weight:600">+2s</span>
</div>
</div>
<!-- Übung 2: Aktiv — läuft gerade -->
<div style="padding:18px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#fef9c3;border-left:4px solid #eab308">
<div style="width:32px;height:32px;border-radius:50%;background:#eab308;display:flex;align-items:center;justify-content:center;color:white;font-size:14px;font-weight:bold;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:15px;color:#a16207">Kniebeugen</div>
<div style="font-size:12px;color:#a16207;font-weight:500">Aktiv — Zeit läuft!</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#a16207;font-weight:600">Soll: 45s</div>
<div style="font-size:22px;font-weight:700;color:#a16207;font-family:monospace">0:31</div>
</div>
<button style="background:#166534;color:white;padding:10px 18px;border-radius:8px;border:none;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap">✓ Erledigt</button>
</div>
<!-- Übung 3: Ausstehend — kommt als nächstes -->
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#f8fafc;opacity:0.8">
<div style="width:32px;height:32px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:13px;font-weight:bold;flex-shrink:0">3</div>
<div style="flex:1">
<div style="font-weight:500;font-size:15px;color:#64748b">Burpees</div>
<div style="font-size:11px;color:#94a3b8">Startet automatisch nach Kniebeugen</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#94a3b8">Soll: 20s</div>
</div>
<div style="width:80px;text-align:center">
<span style="font-size:11px;color:#94a3b8;background:#f1f5f9;padding:3px 8px;border-radius:10px">Ausstehend</span>
</div>
</div>
</div>
<!-- Auto-Start Hinweis -->
<div style="margin-top:12px;padding:12px;background:#fffbeb;border:1px solid #fde047;border-radius:8px;font-size:12px;color:#92400e">
<strong>Auto-Start:</strong> Wenn Anna bei "Kniebeugen" auf "✓ Erledigt" klickt → startet "Burpees" automatisch. Der globale Timer läuft weiter. Andere Ringer (Tom) können parallel starten wenn du ihn auswählst.
</div>
<!-- Tom's Ansicht (grau weil nicht ausgewählt) -->
<div style="margin-top:24px;padding-top:16px;border-top:2px dashed #e2e8f0">
<div style="margin-bottom:12px;display:flex;align-items:center;gap:10px">
<div style="width:10px;height:10px;border-radius:50%;background:#94a3b8"></div>
<span style="font-weight:600;font-size:16px;color:#64748b">Tom Klein</span>
<span style="font-size:12px;color:#94a3b8;background:#f1f5f9;padding:3px 10px;border-radius:10px">0/3</span>
<span style="font-size:11px;color:#94a3b8;margin-left:4px">(klicken zum Starten)</span>
</div>
<div style="border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;opacity:0.6">
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#f8fafc">
<div style="width:32px;height:32px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:13px;font-weight:bold;flex-shrink:0">1</div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px;color:#64748b">Liegestütze</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#94a3b8">Soll: 30s</div>
</div>
<button style="background:#64748b;color:white;padding:8px 16px;border-radius:8px;border:none;font-size:13px;cursor:not-allowed">▶ Start</button>
</div>
<div style="padding:14px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #f1f5f9;background:#f8fafc">
<div style="width:32px;height:32px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:13px;font-weight:bold;flex-shrink:0">2</div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px;color:#64748b">Kniebeugen</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#94a3b8">Soll: 45s</div>
</div>
<div style="width:80px"></div>
</div>
<div style="padding:14px;display:flex;align-items:center;gap:14px;background:#f8fafc">
<div style="width:32px;height:32px;border-radius:50%;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:13px;font-weight:bold;flex-shrink:0">3</div>
<div style="flex:1">
<div style="font-weight:500;font-size:14px;color:#64748b">Burpees</div>
</div>
<div style="text-align:right">
<div style="font-size:13px;color:#94a3b8">Soll: 20s</div>
</div>
<div style="width:80px"></div>
</div>
</div>
<div style="margin-top:10px;padding:10px;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:8px;text-align:center">
<span style="font-size:12px;color:#94a3b8">Klicke auf Tom in der Liste um seine Übungen zu starten</span>
</div>
</div>
</div>
</div>
@@ -0,0 +1,132 @@
<h2>Drei Ringer parallel — jeder seine eigene Zeile</h2>
<p class="subtitle">Wie eine Tabelle: pro Ringer eine Zeile. Alle 3 parallel. Eigene Zeiten pro Übung.</p>
<!-- Header: Timer -->
<div style="background:#1B1A55;border-radius:12px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px">
<div style="display:flex;align-items:center;gap-16px">
<span style="font-size:13px;font-weight:600;color:#9290C3;text-transform:uppercase;letter-spacing:1px">Gemeinsame Zeit</span>
<div style="font-size:36px;font-weight:bold;color:white;font-family:monospace;letter-spacing:2px;margin-left:24px">05:23</div>
</div>
<div style="display:flex;gap:8px">
<button style="background:rgba(255,255,255,0.15);color:white;padding:8px 18px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">⏸ Pausieren</button>
<button style="background:#dc2626;color:white;padding:8px 18px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer">■ Training beenden</button>
</div>
</div>
<!-- WRESTLER ROWS: wie eine tabelle, aber pro ringer eine "zeile" -->
<div style="display:flex;flex-direction:column;gap:12px">
<!-- RINGER 1: Max — alle erledigt -->
<div style="border:2px solid #22c55e;border-radius:12px;overflow:hidden;background:#f0fdf4">
<div style="display:flex;align-items:center;padding:12px 16px;background:#dcfce7;border-bottom:1px solid #bbf7d0">
<div style="width:12px;height:12px;border-radius:50%;background:#22c55e;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:16px;color:#166534">Max Mustermann</div>
<div style="font-size:11px;color:#166534;margin-top:1px">✓ Alle 3 Übungen erledigt</div>
</div>
<div style="font-size:11px;color:#166534;background:#bbf7d0;padding:3px 10px;border-radius:10px;font-weight:600">3/3 ✓</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<div style="flex:1;min-width:120px;background:#bbf7d0;border-radius:8px;padding:10px 12px;border:1px solid #86efac">
<div style="font-size:11px;color:#166534;font-weight:600;margin-bottom:4px">Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#166534">Soll: 30s</span>
<span style="font-size:13px;font-weight:700;color:#166534">✓ 0:28</span>
</div>
</div>
<div style="flex:1;min-width:120px;background:#bbf7d0;border-radius:8px;padding:10px 12px;border:1px solid #86efac">
<div style="font-size:11px;color:#166534;font-weight:600;margin-bottom:4px">Kniebeugen</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#166534">Soll: 45s</span>
<span style="font-size:13px;font-weight:700;color:#166534">✓ 0:44</span>
</div>
</div>
<div style="flex:1;min-width:120px;background:#bbf7d0;border-radius:8px;padding:10px 12px;border:1px solid #86efac">
<div style="font-size:11px;color:#166534;font-weight:600;margin-bottom:4px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#166534">Soll: 20s</span>
<span style="font-size:13px;font-weight:700;color:#166534">✓ 0:19</span>
</div>
</div>
</div>
</div>
<!-- RINGER 2: Anna — aktiv -->
<div style="border:2px solid #1B1A55;border-radius:12px;overflow:hidden;background:#fff">
<div style="display:flex;align-items:center;padding:12px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0">
<div style="width:12px;height:12px;border-radius:50%;background:#1B1A55;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:16px;color:#1B1A55">Anna Schmidt</div>
<div style="font-size:11px;color:#1B1A55;margin-top:1px">Aktive Übung: Kniebeugen</div>
</div>
<div style="font-size:11px;color:#a16207;background:#fef9c3;padding:3px 10px;border-radius:10px;font-weight:600">2/3</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<!-- Erledigt -->
<div style="flex:1;min-width:120px;background:#dcfce7;border-radius:8px;padding:10px 12px;border:1px solid #86efac">
<div style="font-size:11px;color:#166534;font-weight:600;margin-bottom:4px">Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#166534">Soll: 30s</span>
<span style="font-size:13px;font-weight:700;color:#166534">✓ 0:28</span>
</div>
</div>
<!-- Aktiv: läuft -->
<div style="flex:1;min-width:160px;background:#fef9c3;border-radius:8px;padding:12px 14px;border:2px solid #eab308">
<div style="font-size:11px;color:#a16207;font-weight:600;margin-bottom:6px">▶ Kniebeugen</div>
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
<span style="font-size:10px;color:#a16207">Soll: 45s</span>
<span style="font-size:18px;font-weight:700;color:#a16207;font-family:monospace">0:31</span>
</div>
<button style="width:100%;background:#166534;color:white;padding:7px;border-radius:6px;border:none;font-size:12px;font-weight:600;cursor:pointer">✓ Erledigt</button>
</div>
<!-- Ausstehend -->
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.7">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#94a3b8">Soll: 20s</span>
<span style="font-size:12px;color:#94a3b8">Ausstehend</span>
</div>
</div>
</div>
</div>
<!-- RINGER 3: Tom — Start-Buttons -->
<div style="border:2px solid #e2e8f0;border-radius:12px;overflow:hidden;background:#f8fafc">
<div style="display:flex;align-items:center;padding:12px 16px;background:#f1f5f9;border-bottom:1px solid #e2e8f0">
<div style="width:12px;height:12px;border-radius:50%;background:#94a3b8;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:600;font-size:16px;color:#64748b">Tom Klein</div>
<div style="font-size:11px;color:#94a3b8;margin-top:1px">Noch nicht gestartet</div>
</div>
<div style="font-size:11px;color:#94a3b8;background:#e2e8f0;padding:3px 10px;border-radius:10px;font-weight:600">0/3</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<div style="flex:1;min-width:140px;background:#fff;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0">
<div style="font-size:11px;color:#64748b;font-weight:600;margin-bottom:6px">Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#94a3b8">Soll: 30s</span>
<button style="background:#1B1A55;color:white;padding:6px 12px;border-radius:6px;border:none;font-size:11px;font-weight:600;cursor:pointer">▶ Start</button>
</div>
</div>
<div style="flex:1;min-width:140px;background:#fff;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0">
<div style="font-size:11px;color:#64748b;font-weight:600;margin-bottom:6px">Kniebeugen</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#94a3b8">Soll: 45s</span>
<button style="background:#e2e8f0;color:#94a3b8;padding:6px 12px;border-radius:6px;border:none;font-size:11px;font-weight:600;cursor:not-allowed">▶ Start</button>
</div>
</div>
<div style="flex:1;min-width:140px;background:#fff;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0">
<div style="font-size:11px;color:#64748b;font-weight:600;margin-bottom:6px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:10px;color:#94a3b8">Soll: 20s</span>
<button style="background:#e2e8f0;color:#94a3b8;padding:6px 12px;border-radius:6px;border:none;font-size:11px;font-weight:600;cursor:not-allowed">▶ Start</button>
</div>
</div>
</div>
</div>
</div>
<div style="margin-top:14px;padding:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;font-size:12px;color:#64748b">
<strong>So funktioniert's:</strong> Alle 3 Ringer arbeiten parallel. Anna hat gerade Kniebeugen aktiv (gelb) — nach dem Klick auf "✓ Erledigt" startet Burpees automatisch. Tom kann jederzeit auf "▶ Start" bei Liegestütze klicken um seine erste Übung zu starten. Der globale Timer läuft für alle gemeinsam.
</div>
@@ -0,0 +1,130 @@
<h2>Timer start → alle beginnen Übung 1 automatisch</h2>
<p class="subtitle">Soll = Reps (z.B. "3x10"). Trainer klickt "Erledigt" pro Ringer wenn fertig.</p>
<!-- Header: Timer + Start -->
<div style="background:#1B1A55;border-radius:12px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px">
<div style="display:flex;align-items:center;gap:24px">
<span style="font-size:13px;font-weight:600;color:#9290C3;text-transform:uppercase;letter-spacing:1px">Gemeinsame Zeit</span>
<div style="font-size:36px;font-weight:bold;color:white;font-family:monospace;letter-spacing:2px">00:00</div>
</div>
<button style="background:#22c55e;color:white;padding:10px 24px;border-radius:8px;border:none;font-size:14px;font-weight:600;cursor:pointer">▶ Training starten</button>
</div>
<!-- WRESTLER ROWS -->
<div style="display:flex;flex-direction:column;gap:12px">
<!-- RINGER 1: Max — Übung 1 läuft gerade -->
<div style="border:2px solid #eab308;border-radius:12px;overflow:hidden;background:#fff">
<div style="display:flex;align-items:center;padding:12px 16px;background:#fef9c3;border-bottom:1px solid #fde047">
<div style="width:12px;height:12px;border-radius:50%;background:#eab308;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:16px;color:#a16207">Max Mustermann</div>
<div style="font-size:11px;color:#a16207;margin-top:1px">Übung 1 läuft...</div>
</div>
<div style="font-size:11px;color:#a16207;background:#fef3c7;padding:3px 10px;border-radius:10px;font-weight:600">0/3</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<!-- Übung 1: Aktiv -->
<div style="flex:1;min-width:160px;background:#fef9c3;border-radius:8px;padding:12px 14px;border:2px solid #eab308">
<div style="font-size:11px;color:#a16207;font-weight:600;margin-bottom:6px">▶ Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
<span style="font-size:11px;color:#a16207;font-weight:500">Soll: <strong>3×10</strong></span>
<span style="font-size:20px;font-weight:700;color:#a16207;font-family:monospace">0:28</span>
</div>
<button style="width:100%;background:#166534;color:white;padding:8px;border-radius:6px;border:none;font-size:13px;font-weight:600;cursor:pointer">✓ Erledigt</button>
</div>
<!-- Übung 2+3: Wartend -->
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Kniebeugen</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×15</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×20</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
</div>
</div>
<!-- RINGER 2: Anna — Übung 1 läuft -->
<div style="border:2px solid #eab308;border-radius:12px;overflow:hidden;background:#fff">
<div style="display:flex;align-items:center;padding:12px 16px;background:#fef9c3;border-bottom:1px solid #fde047">
<div style="width:12px;height:12px;border-radius:50%;background:#eab308;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:16px;color:#a16207">Anna Schmidt</div>
<div style="font-size:11px;color:#a16207;margin-top:1px">Übung 1 läuft...</div>
</div>
<div style="font-size:11px;color:#a16207;background:#fef3c7;padding:3px 10px;border-radius:10px;font-weight:600">0/3</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<div style="flex:1;min-width:160px;background:#fef9c3;border-radius:8px;padding:12px 14px;border:2px solid #eab308">
<div style="font-size:11px;color:#a16207;font-weight:600;margin-bottom:6px">▶ Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
<span style="font-size:11px;color:#a16207;font-weight:500">Soll: <strong>3×10</strong></span>
<span style="font-size:20px;font-weight:700;color:#a16207;font-family:monospace">0:31</span>
</div>
<button style="width:100%;background:#166534;color:white;padding:8px;border-radius:6px;border:none;font-size:13px;font-weight:600;cursor:pointer">✓ Erledigt</button>
</div>
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Kniebeugen</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×15</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×20</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
</div>
</div>
<!-- RINGER 3: Tom — Übung 1 läuft -->
<div style="border:2px solid #eab308;border-radius:12px;overflow:hidden;background:#fff">
<div style="display:flex;align-items:center;padding:12px 16px;background:#fef9c3;border-bottom:1px solid #fde047">
<div style="width:12px;height:12px;border-radius:50%;background:#eab308;margin-right:10px;flex-shrink:0"></div>
<div style="flex:1">
<div style="font-weight:700;font-size:16px;color:#a16207">Tom Klein</div>
<div style="font-size:11px;color:#a16207;margin-top:1px">Übung 1 läuft...</div>
</div>
<div style="font-size:11px;color:#a16207;background:#fef3c7;padding:3px 10px;border-radius:10px;font-weight:600">0/3</div>
</div>
<div style="padding:14px 16px;display:flex;gap:10px;flex-wrap:wrap">
<div style="flex:1;min-width:160px;background:#fef9c3;border-radius:8px;padding:12px 14px;border:2px solid #eab308">
<div style="font-size:11px;color:#a16207;font-weight:600;margin-bottom:6px">▶ Liegestütze</div>
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px">
<span style="font-size:11px;color:#a16207;font-weight:500">Soll: <strong>3×10</strong></span>
<span style="font-size:20px;font-weight:700;color:#a16207;font-family:monospace">0:22</span>
</div>
<button style="width:100%;background:#166534;color:white;padding:8px;border-radius:6px;border:none;font-size:13px;font-weight:600;cursor:pointer">✓ Erledigt</button>
</div>
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Kniebeugen</div>
<div style="display:flex;justify-content;between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×15</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
<div style="flex:1;min-width:120px;background:#f8fafc;border-radius:8px;padding:10px 12px;border:1px solid #e2e8f0;opacity:0.6">
<div style="font-size:11px;color:#94a3b8;font-weight:600;margin-bottom:4px">Burpees</div>
<div style="display:flex;justify-content:space-between;align-items:center">
<span style="font-size:11px;color:#94a3b8">Soll: 3×20</span>
<span style="font-size:11px;color:#94a3b8"></span>
</div>
</div>
</div>
</div>
</div>
<div style="margin-top:14px;padding:12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;font-size:12px;color:#1e40af">
<strong>Flow:</strong> Trainer klickt "▶ Training starten" → ALLE 3 Ringer beginnen gleichzeitig Übung 1 ("Liegestütze 3×10"). Der Timer läuft. Trainer klickt bei Max auf "✓ Erledigt" → Zeit wird gespeichert (0:28), Max's nächste Übung (Kniebeugen) startet automatisch. Anna und Tom sind noch bei Übung 1.
</div>