init

templates/rooms.html

@@ -0,0 +1,48 @@
+<!doctype html>
+<html lang="de">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>{{.Title}} · SEND.NRW Chat</title>
+  <script src="https://unpkg.com/htmx.org@1.9.12"></script>
+  <link rel="stylesheet" href="/static/app.css">
+</head>
+<body>
+  <div class="shell">
+    <header class="topbar">
+      <a class="brand" href="/rooms">SEND.NRW Chat</a>
+      <form method="post" action="/logout">
+        <span class="user-pill">{{.Username}}</span>
+        <button class="ghost" type="submit">Logout</button>
+      </form>
+    </header>
+    <main class="grid-page">
+      <section class="hero card">
+        <div>
+          <p class="eyebrow">Räume</p>
+          <h1>Wähle einen Chatraum</h1>
+          <p class="muted">Nachrichten werden persistent gespeichert und live per Server-Sent Events verteilt.</p>
+        </div>
+      </section>
+
+      <section class="room-grid">
+        {{range .Rooms}}
+        <a class="room-card" href="/rooms/{{.ID}}">
+          <h2>{{.Name}}</h2>
+          <p>{{.Description}}</p>
+        </a>
+        {{end}}
+      </section>
+
+      <section class="card hero">
+        <h2>Neuen Raum erstellen</h2>
+        <form hx-post="/rooms" method="post" class="stack two-col-form">
+          <label>Name<input name="name" placeholder="Projekt Alpha" required minlength="2" maxlength="40"></label>
+          <label>Beschreibung<input name="description" placeholder="Worum geht es hier?" maxlength="120"></label>
+          <button type="submit">Raum erstellen</button>
+        </form>
+      </section>
+    </main>
+  </div>
+</body>
+</html>