mirror of
https://github.com/guyg1474/hcrb.git
synced 2026-10-15 23:13:28 +02:00
- Gemeinsame Zugänge mit Rollen: Admin darf alles, Mitglied nutzt Kalender, Fahrtplaner, Treffpunkte und bearbeitet Mitglieder (kein Hinzufügen, Löschen, Import, keine Patches, keine Statistik-Korrektur) - Server prüft die Rechte (403), Konten ohne Rolle gelten als Admin - npm run user: add <name> [admin|mitglied], role <name> <rolle> - Neue öffentliche Seite Kooperationen mit Titelbild, Anführer, Social-Media-Links und Beschreibung, Pflege durch Admin - Kopfzeile bleibt bei mittlerer Breite einzeilig - Texte auf Wunsch gekürzt Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
107 lines
4.8 KiB
HTML
107 lines
4.8 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Kooperationen – HCRB</title>
|
||
<link rel="stylesheet" href="/css/style.css">
|
||
</head>
|
||
<body>
|
||
<main>
|
||
<!-- Übersicht aller Kooperationen -->
|
||
<section id="overview">
|
||
<header class="page-head">
|
||
<div>
|
||
<span class="eyebrow">Verbündete Teams</span>
|
||
<h1>Kooperationen</h1>
|
||
<p>Gruppen, mit denen die HCRB zusammen spielt, plant und unterwegs ist.</p>
|
||
</div>
|
||
<div class="actions">
|
||
<button type="button" id="add-btn" class="primary" hidden>Kooperation hinzufügen</button>
|
||
</div>
|
||
</header>
|
||
<div id="coop-grid" class="coop-grid"></div>
|
||
<div id="coop-empty" class="empty-state" hidden>
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" aria-hidden="true"><path d="M7 11l3-3 3 2 3-3 4 4-6 6-2-1-2 1-6-6z"/><path d="M3 9l4 2M21 9l-4 2"/></svg>
|
||
<strong>Noch keine Kooperationen</strong>
|
||
<span id="coop-empty-hint">Sobald der Admin eine Kooperation einträgt, erscheint sie hier.</span>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Einzelne Kooperation: Titelbild, Anführer, Soziale Medien, Beschreibung -->
|
||
<article id="detail" hidden>
|
||
<a href="#" class="back-link" id="back-link">‹ Alle Kooperationen</a>
|
||
<div class="coop-hero" id="detail-hero">
|
||
<img id="detail-img" alt="" hidden>
|
||
<div class="coop-hero-text">
|
||
<span class="eyebrow">Kooperation</span>
|
||
<h1 id="detail-name"></h1>
|
||
</div>
|
||
</div>
|
||
<div class="split wide-left coop-info">
|
||
<div class="card">
|
||
<h2>Über die Gruppe</h2>
|
||
<p id="detail-description" class="coop-description"></p>
|
||
</div>
|
||
<div class="card">
|
||
<h2>Anführer</h2>
|
||
<p id="detail-leader" class="coop-leader"></p>
|
||
<h2 class="spaced">Soziale Medien</h2>
|
||
<div id="detail-socials" class="coop-socials"></div>
|
||
<div id="detail-admin" class="row wrap admin-actions" hidden>
|
||
<button type="button" id="detail-edit">Bearbeiten</button>
|
||
<button type="button" id="detail-delete" class="link danger">Löschen</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<!-- Formular (nur Admin) -->
|
||
<div class="card" id="coop-form-card" hidden>
|
||
<h2 id="coop-form-title">Kooperation hinzufügen</h2>
|
||
<form id="coop-form" class="split">
|
||
<div>
|
||
<label class="dropzone wide" id="dropzone" for="coop-file">
|
||
<img id="coop-preview" alt="Vorschau" hidden>
|
||
<span id="drop-text"></span>
|
||
<input type="file" id="coop-file" accept="image/png,image/jpeg,image/webp,image/svg+xml,.svg" hidden>
|
||
</label>
|
||
<label class="inline" id="remove-image-wrap" hidden>
|
||
<input type="checkbox" id="coop-remove-image"> Titelbild entfernen
|
||
</label>
|
||
</div>
|
||
<div>
|
||
<label>Name der Gruppe
|
||
<input type="text" id="coop-name" required maxlength="80" placeholder="z. B. Black Wolves Airsoft">
|
||
</label>
|
||
<label>Anführer
|
||
<input type="text" id="coop-leader" maxlength="120" placeholder="Name oder Rufname">
|
||
</label>
|
||
<label>Kurze Beschreibung
|
||
<textarea id="coop-description" maxlength="2000" placeholder="Wer sind sie, wo spielen sie, was machen wir zusammen …"></textarea>
|
||
</label>
|
||
<fieldset class="socials-fields">
|
||
<legend>Soziale Medien (optional, Link einfügen)</legend>
|
||
<div class="grid2">
|
||
<label>Website <input type="text" id="social-website" inputmode="url" placeholder="https://…"></label>
|
||
<label>Instagram <input type="text" id="social-instagram" inputmode="url" placeholder="instagram.com/…"></label>
|
||
<label>YouTube <input type="text" id="social-youtube" inputmode="url" placeholder="youtube.com/@…"></label>
|
||
<label>TikTok <input type="text" id="social-tiktok" inputmode="url" placeholder="tiktok.com/@…"></label>
|
||
<label>Facebook <input type="text" id="social-facebook" inputmode="url" placeholder="facebook.com/…"></label>
|
||
<label>Discord <input type="text" id="social-discord" inputmode="url" placeholder="discord.gg/…"></label>
|
||
</div>
|
||
</fieldset>
|
||
<p id="coop-error" class="warn" hidden></p>
|
||
<div class="row wrap">
|
||
<button type="submit" class="primary" id="coop-submit">Speichern</button>
|
||
<button type="button" id="coop-cancel">Abbrechen</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</main>
|
||
|
||
<script type="module" src="/js/kooperationen.js"></script>
|
||
</body>
|
||
</html>
|