From 60d8c941deaa594b9af8379a0c797367a570668d Mon Sep 17 00:00:00 2001
From: kai <kai@pinguholic.de>
Date: Tue, 25 Aug 2026 13:00:45 +0200
Subject: [PATCH] =?UTF-8?q?kommentarfunktion=20und=20n=C3=A4chster=20admin?=
 =?UTF-8?q?=20button=20fix?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/main.py                       |   3 +
 app/static/style.css              | 117 ++++++++++++++++++++++++++----
 app/templates/concert_detail.html |  80 +++++++++++++++++---
 3 files changed, 177 insertions(+), 23 deletions(-)

diff --git a/app/main.py b/app/main.py
index 0c27d48..0c1bb0c 100644
--- a/app/main.py
+++ b/app/main.py
@@ -1146,6 +1146,7 @@ def concert_detail(request: Request, concert_id: int):
         for row in attendance_rows
     ]
     attending_users = [item for item in attendance if item["status"] == "attending"]
+    ticket_seekers = [item for item in attendance if item["status"] == "ticket_search"]
     current_attendance = next(
         (item["status"] for item in attendance if item["user_id"] == user["id"]),
         None,
@@ -1162,6 +1163,8 @@ def concert_detail(request: Request, concert_id: int):
         current_attendance=current_attendance,
         attending_users=attending_users,
         attending_count=len(attending_users),
+        ticket_seekers=ticket_seekers,
+        ticket_seeker_count=len(ticket_seekers),
     )
 
 
diff --git a/app/static/style.css b/app/static/style.css
index 803fbb9..d22d593 100644
--- a/app/static/style.css
+++ b/app/static/style.css
@@ -45,38 +45,40 @@ a {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    min-height: 42px;
-    padding: 10px 16px;
-    color: #ffffff;
-    border: 0;
-    border-radius: 10px;
+    padding: 10px 14px;
+    background: #161b22;
+    border: 1px solid #3d4856;
+    border-radius: 9px;
+    color: #e6edf3;
     font: inherit;
     font-weight: bold;
-    line-height: 1;
     text-decoration: none;
     cursor: pointer;
-    transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
+    transition: background 0.15s ease, border-color 0.15s ease;
 }
 
 .concert-action:hover {
-    transform: translateY(-1px);
-    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.25);
+    border-color: #58a6ff;
+    background: #1b3554;
 }
 
 .concert-action-edit {
-    background: #238636;
+    border-color: #58a6ff;
+    background: #1b3554;
 }
 
 .concert-action-edit:hover {
-    background: #2ea043;
+    background: #24476d;
 }
 
 .concert-action-delete {
-    background: #b42318;
+    border-color: #9f3a38;
+    background: #321617;
 }
 
 .concert-action-delete:hover {
-    background: #dc2626;
+    border-color: #f87171;
+    background: #4b1d20;
 }
 
 .concert-detail {
@@ -252,6 +254,95 @@ a {
     padding-left: 22px;
 }
 
+.attendance-groups {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+    gap: 16px;
+    margin-top: 14px;
+}
+
+.attendance-groups h3 {
+    margin: 0;
+    font-size: 1rem;
+    color: #e6edf3;
+}
+
+.attendance-groups p {
+    margin-bottom: 0;
+}
+
+.comments-section {
+    margin-top: 35px;
+    padding: 25px;
+    background: #0d1117;
+    border: 1px solid #30363d;
+    border-radius: 12px;
+}
+
+.comments-section h2 {
+    margin-top: 0;
+}
+
+.comment-form {
+    margin: 0;
+}
+
+.comment-form label {
+    display: block;
+    color: #b8c1cc;
+    margin-bottom: 8px;
+}
+
+.comment-form textarea {
+    width: 100%;
+    padding: 12px;
+    resize: vertical;
+    background: #161b22;
+    border: 1px solid #3d4856;
+    border-radius: 9px;
+    color: #e6edf3;
+    font: inherit;
+}
+
+.comment-submit {
+    margin-top: 10px;
+}
+
+.comment-list {
+    display: grid;
+    gap: 12px;
+    margin-top: 22px;
+}
+
+.comment {
+    padding: 16px;
+    background: #161b22;
+    border: 1px solid #30363d;
+    border-radius: 10px;
+}
+
+.comment-meta {
+    display: flex;
+    justify-content: space-between;
+    gap: 12px;
+    color: #b8c1cc;
+}
+
+.comment-meta span {
+    font-size: 0.9rem;
+}
+
+.comment p {
+    margin: 10px 0 0;
+    line-height: 1.55;
+    white-space: pre-wrap;
+}
+
+.comments-empty {
+    margin-bottom: 0;
+    color: #8b949e;
+}
+
 @media (max-width: 600px) {
 
     .container {
diff --git a/app/templates/concert_detail.html b/app/templates/concert_detail.html
index e027279..610805d 100644
--- a/app/templates/concert_detail.html
+++ b/app/templates/concert_detail.html
@@ -240,26 +240,86 @@
 
                 <details class="attendance-list">
                     <summary>
-                        {{ attending_count }} Zusage{% if attending_count != 1 %}n{% endif %} anzeigen
+                        {{ attending_count }} Zusage{% if attending_count != 1 %}n{% endif %}
+                        · {{ ticket_seeker_count }} sucht Ticket
                     </summary>
 
-                    {% if attending_users %}
+                    <div class="attendance-groups">
 
-                        <ul>
-                            {% for attendee in attending_users %}
-                                <li>{{ attendee.name }}</li>
-                            {% endfor %}
-                        </ul>
+                        <div>
+                            <h3>✓ Zugesagt</h3>
 
-                    {% else %}
+                            {% if attending_users %}
+                                <ul>
+                                    {% for attendee in attending_users %}
+                                        <li>{{ attendee.name }}</li>
+                                    {% endfor %}
+                                </ul>
+                            {% else %}
+                                <p>Noch niemand hat zugesagt.</p>
+                            {% endif %}
+                        </div>
 
-                        <p>Noch niemand hat zugesagt.</p>
+                        <div>
+                            <h3>🎟️ Sucht ein Ticket</h3>
 
-                    {% endif %}
+                            {% if ticket_seekers %}
+                                <ul>
+                                    {% for seeker in ticket_seekers %}
+                                        <li>{{ seeker.name }}</li>
+                                    {% endfor %}
+                                </ul>
+                            {% else %}
+                                <p>Aktuell sucht niemand ein Ticket.</p>
+                            {% endif %}
+                        </div>
+
+                    </div>
                 </details>
 
             </section>
 
+            <section class="comments-section" id="comments">
+
+                <h2>💬 Kommentare</h2>
+
+                <form method="post" action="/concerts/{{ concert.id }}/comments" class="comment-form">
+                    <label for="comment-body">Mit anderen Konzertbesuchern austauschen</label>
+                    <textarea
+                        id="comment-body"
+                        name="body"
+                        rows="4"
+                        maxlength="2000"
+                        required
+                        placeholder="Schreib einen Kommentar …"
+                    ></textarea>
+                    <button type="submit" class="attendance-option comment-submit">
+                        Kommentar senden
+                    </button>
+                </form>
+
+                {% if comments %}
+
+                    <div class="comment-list">
+                        {% for comment in comments %}
+                            <article class="comment">
+                                <div class="comment-meta">
+                                    <strong>{{ comment.author }}</strong>
+                                    <span>{{ comment.created_at }}</span>
+                                </div>
+                                <p>{{ comment.body }}</p>
+                            </article>
+                        {% endfor %}
+                    </div>
+
+                {% else %}
+
+                    <p class="comments-empty">Noch keine Kommentare. Mach den Anfang!</p>
+
+                {% endif %}
+
+            </section>
+
         </div>
 
     </article>