Add social features and harden beta release
This commit is contained in:
+120
-57
@@ -78,6 +78,33 @@
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.event-group { display: grid; gap: 8px; }
|
||||
|
||||
.linked-events {
|
||||
display: grid;
|
||||
gap: 7px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.concert-card.linked-event {
|
||||
padding: 14px 18px;
|
||||
border-left: 3px solid #a78bfa;
|
||||
background: #121720;
|
||||
}
|
||||
|
||||
.linked-event .concert-artist { font-size: 1.05rem; margin-bottom: 5px; }
|
||||
.linked-event .concert-meta { font-size: .9rem; }
|
||||
|
||||
.event-category {
|
||||
display: inline-block;
|
||||
margin-bottom: 7px;
|
||||
color: #aab4c3;
|
||||
font-size: .78rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: .04em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.past-concerts-title {
|
||||
margin: 28px 0 0;
|
||||
}
|
||||
@@ -127,6 +154,33 @@
|
||||
color: #8b949e;
|
||||
}
|
||||
|
||||
.search-panel { margin-bottom: 26px; padding: 16px; background: rgba(16,16,16,.92); border: 1px solid #3a3030; border-radius: 14px; }
|
||||
.search-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
|
||||
.search-form input { margin: 0; }
|
||||
.search-results-title { margin: 24px 0 12px; font-size: 1.15rem; }
|
||||
.user-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; margin-bottom: 24px; }
|
||||
.user-result { display: flex; align-items: center; gap: 11px; padding: 12px; background: #101010; border: 1px solid #3a3030; border-radius: 11px; }
|
||||
.user-result:hover { border-color: #dc2626; }
|
||||
.user-result-avatar { width: 44px; height: 44px; flex: 0 0 44px; object-fit: cover; border-radius: 50%; background: #292524; display: grid; place-items: center; font-weight: 800; }
|
||||
.user-result-name { min-width: 0; }
|
||||
.user-result-name strong, .user-result-name span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.user-result-name span { color: #a8a29e; font-size: .86rem; }
|
||||
|
||||
body {
|
||||
background: radial-gradient(circle at 50% -20%, #3a0909 0, transparent 34rem), #050505;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.page-header { padding-bottom: 22px; border-bottom: 1px solid #3f2424; }
|
||||
.page-header h1 { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; letter-spacing: .05em; text-transform: uppercase; text-shadow: 0 2px 18px rgba(185, 28, 28, .45); }
|
||||
.new-concert-button { background: #991b1b; border: 1px solid #dc2626; }
|
||||
.new-concert-button:hover { background: #b91c1c; }
|
||||
.admin-button:hover { border-color: #dc2626; }
|
||||
.concert-card { background: linear-gradient(145deg, #101010, #181313); border-color: #3a3030; }
|
||||
.concert-card:hover { border-color: #dc2626; background: #1c1212; }
|
||||
.concert-date { color: #ef4444; }
|
||||
.concert-card.linked-event { border-left-color: #dc2626; background: #0d0d0d; }
|
||||
|
||||
@media (max-width: 600px) {
|
||||
|
||||
.page-header {
|
||||
@@ -139,12 +193,31 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.linked-events { margin-left: 16px; }
|
||||
.search-form { grid-template-columns: 1fr; }
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
||||
{% macro event_card(concert, linked=false) %}
|
||||
<a href="/concerts/{{ concert.id }}" class="concert-card{% if linked %} linked-event{% endif %}">
|
||||
<span class="event-category">{{ concert.event_type_label }}</span>
|
||||
<div class="concert-artist">
|
||||
{% if concert.event_type == 'festival' %}🎪{% elif concert.event_type == 'other' %}🥂{% else %}🎸{% endif %}
|
||||
{{ concert.artist }}
|
||||
</div>
|
||||
<div class="concert-meta">
|
||||
<div class="concert-date">
|
||||
📅 {{ concert.date }}{% if concert.end_date %} – {{ concert.end_date }}{% else %} um {{ concert.time }} Uhr{% endif %}
|
||||
</div>
|
||||
<div>📍 {{ concert.venue }}</div>
|
||||
</div>
|
||||
</a>
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
<body>
|
||||
|
||||
@@ -155,11 +228,11 @@
|
||||
<div>
|
||||
|
||||
<h1>
|
||||
🐧 Pingu Concerts
|
||||
{% if archive %}☠ Vergangene Veranstaltungen{% else %}🐧 Pingu Concerts{% endif %}
|
||||
</h1>
|
||||
|
||||
<div class="subtitle">
|
||||
Unser Konzertkalender
|
||||
{% if archive %}Das Archiv vergangener Nächte{% else %}Konzerte, Festivals und alles davor{% endif %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -167,8 +240,8 @@
|
||||
|
||||
<div class="header-actions">
|
||||
|
||||
<a href="/profile" class="admin-button">
|
||||
👤 Mein Profil
|
||||
<a href="{% if archive %}/{% else %}/events/past{% endif %}" class="admin-button">
|
||||
{% if archive %}⚡ Bevorstehend{% else %}☠ Vergangene{% endif %}
|
||||
</a>
|
||||
|
||||
{% if user.is_admin %}
|
||||
@@ -183,79 +256,69 @@
|
||||
href="/concerts/new"
|
||||
class="new-concert-button"
|
||||
>
|
||||
+ Konzert hinzufügen
|
||||
+ Veranstaltung hinzufügen
|
||||
</a>
|
||||
|
||||
{% include '_user_menu.html' %}
|
||||
|
||||
</div>
|
||||
|
||||
</header>
|
||||
|
||||
<section class="search-panel" aria-label="Suche">
|
||||
<form class="search-form" method="get" action="{% if archive %}/events/past{% else %}/{% endif %}">
|
||||
<input type="search" name="q" value="{{ search_query }}" placeholder="Veranstaltungen, Orte oder User suchen …" aria-label="Veranstaltungen oder User suchen">
|
||||
<button class="new-concert-button" type="submit">Suchen</button>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
{% if search_query %}
|
||||
<h2 class="search-results-title">User zu „{{ search_query }}“</h2>
|
||||
{% if user_results %}
|
||||
<div class="user-results">
|
||||
{% for result in user_results %}
|
||||
<a class="user-result" href="/users/{{ result.username }}">
|
||||
{% if result.avatar_path %}<img class="user-result-avatar" src="{{ result.avatar_path }}" alt="">{% else %}<span class="user-result-avatar">{{ result.display_name[:1] }}</span>{% endif %}
|
||||
<span class="user-result-name"><strong>{{ result.display_name }}</strong><span>@{{ result.username }}</span></span>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}<p class="subtitle">Keine passenden User gefunden.</p>{% endif %}
|
||||
<h2 class="search-results-title">Veranstaltungen zu „{{ search_query }}“</h2>
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% if upcoming_concerts or past_concerts %}
|
||||
|
||||
<div class="concert-list">
|
||||
|
||||
{% for concert in upcoming_concerts %}
|
||||
|
||||
<a
|
||||
href="/concerts/{{ concert.id }}"
|
||||
class="concert-card"
|
||||
>
|
||||
|
||||
<div class="concert-artist">
|
||||
🎸 {{ concert.artist }}
|
||||
</div>
|
||||
|
||||
|
||||
<div class="concert-meta">
|
||||
|
||||
<div class="concert-date">
|
||||
📅 {{ concert.date }}
|
||||
um {{ concert.time }} Uhr
|
||||
<div class="event-group">
|
||||
{{ event_card(concert) }}
|
||||
{% if concert.children %}
|
||||
<div class="linked-events">
|
||||
{% for child in concert.children %}{{ event_card(child, true) }}{% endfor %}
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
📍 {{ concert.venue }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
|
||||
{% if past_concerts %}
|
||||
{% if archive and past_concerts %}
|
||||
|
||||
<h2 class="past-concerts-title">
|
||||
Vergangene Konzerte
|
||||
Archiv
|
||||
</h2>
|
||||
|
||||
{% for concert in past_concerts %}
|
||||
|
||||
<a
|
||||
href="/concerts/{{ concert.id }}"
|
||||
class="concert-card"
|
||||
>
|
||||
|
||||
<div class="concert-artist">
|
||||
🎸 {{ concert.artist }}
|
||||
</div>
|
||||
|
||||
<div class="concert-meta">
|
||||
|
||||
<div class="concert-date">
|
||||
📅 {{ concert.date }}
|
||||
um {{ concert.time }} Uhr
|
||||
<div class="event-group">
|
||||
{{ event_card(concert) }}
|
||||
{% if concert.children %}
|
||||
<div class="linked-events">
|
||||
{% for child in concert.children %}{{ event_card(child, true) }}{% endfor %}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
📍 {{ concert.venue }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
|
||||
@@ -268,11 +331,11 @@
|
||||
<div class="empty-state">
|
||||
|
||||
<h2>
|
||||
Noch keine Konzerte 🎸
|
||||
{% if archive %}Noch keine vergangenen Veranstaltungen ☠{% else %}Noch keine Veranstaltungen 🎸{% endif %}
|
||||
</h2>
|
||||
|
||||
<p>
|
||||
Leg das erste Konzert an!
|
||||
{% if archive %}Hier erscheinen abgeschlossene Veranstaltungen.{% else %}Leg die erste Veranstaltung an!{% endif %}
|
||||
</p>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user