14 lines
4.6 KiB
HTML
14 lines
4.6 KiB
HTML
<!DOCTYPE html><html lang="{{ language() }}"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>{{ _('Gefolgt · MetalCircle') }}</title><link rel="stylesheet" href="/static/css/style.css"><style>
|
||
.follow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.follow-card{min-width:0;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.follow-card h2{margin:0 0 8px;font-size:1rem}.follow-list{display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0;list-style:none}.follow-list li{display:flex;align-items:center;gap:5px;min-width:0;padding:5px 8px;background:#171212;border:1px solid var(--border);border-radius:999px;font-size:.88rem}.follow-list li>a,.follow-list li>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.follow-list form{flex:0 0 auto;margin:0}.follow-remove{padding:0;color:#fca5a5;background:none;border:0;cursor:pointer;font-size:1rem;line-height:1}.follow-events{display:grid;gap:10px}.follow-event{display:block;padding:14px;background:#0b0b0b;border:1px solid var(--border);border-radius:10px}.follow-event:hover{border-color:#ef4444}.follow-reason{color:var(--muted);font-size:.82rem}
|
||
@media(max-width:760px){.follow-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.follow-card{padding:9px}.follow-card h2{margin-bottom:6px;font-size:.94rem}.follow-list{gap:5px}.follow-list li{gap:4px;padding:4px 7px;font-size:.82rem}.follow-grid .follow-card:last-child{grid-column:1/-1}}
|
||
@media(max-width:360px){.follow-grid{grid-template-columns:1fr}.follow-grid .follow-card:last-child{grid-column:auto}}
|
||
</style><link rel="stylesheet" href="/static/css/language.css">
|
||
</head><body><header><div class="header-inner"><a href="/" class="logo"><img class="brand-logo" src="/static/images/metalcircle-full.png" alt="MetalCircle"></a>{% include '_header_controls.html' %}</div>
|
||
</header><main>
|
||
<div class="page-title"><h1>{{ _('⭐ Gefolgt') }}</h1><p>{{ _('Bands, Locations, Personen und passende kommende Veranstaltungen.') }}</p></div>
|
||
<div class="follow-grid"><section class="follow-card"><h2>Bands</h2><ul class="follow-list">{% for band in followed_bands %}<li><span>{{ band.name }}</span><form method="post" action="/following/bands/remove"><input type="hidden" name="band_key" value="{{ band.key }}"><button class="follow-remove" type="submit" title="{{ _('Nicht mehr folgen') }}" aria-label="{{ band.name }} {{ _('nicht mehr folgen') }}">×</button></form></li>{% else %}<li>{{ _('Noch keine Band gefolgt.') }}</li>{% endfor %}</ul></section>
|
||
<section class="follow-card"><h2>{{ _('Personen') }}</h2><ul class="follow-list">{% for person in followed_users %}<li><a href="/users/{{ person.username }}">{{ person.name }}</a><form method="post" action="/following/users/remove"><input type="hidden" name="followed_id" value="{{ person.id }}"><button class="follow-remove" type="submit" title="{{ _('Nutzer nicht mehr folgen') }}" aria-label="{{ person.name }} {{ _('Nutzer nicht mehr folgen') }}">×</button></form></li>{% else %}<li>{{ _('Du folgst noch keinen Nutzern.') }}</li>{% endfor %}</ul></section>
|
||
<section class="follow-card"><h2>{{ _('Locations') }}</h2><ul class="follow-list">{% for venue in followed_venues %}<li><span>{{ venue.name }}{% if venue.city %} · {{ venue.city }}{% endif %}</span><form method="post" action="/following/venues/remove"><input type="hidden" name="venue_id" value="{{ venue.id }}"><button class="follow-remove" type="submit" title="{{ _('Location nicht mehr folgen') }}" aria-label="{{ venue.name }} {{ _('Location nicht mehr folgen') }}">×</button></form></li>{% else %}<li>{{ _('Noch keiner Location gefolgt.') }}</li>{% endfor %}</ul></section>
|
||
<section class="follow-card" style="grid-column:1/-1"><h2>{{ _('Kommende Treffer') }}</h2><div class="follow-events">{% for event in events %}<a class="follow-event" href="/concerts/{{ event.id }}"><strong>{{ event.artist }}</strong><br>{{ event.date }} · {{ event.time }}{% if event.venue %} · {{ event.venue }}{% endif %}{% if event.matched_band or event.matched_venue %}<div class="follow-reason">{% if event.matched_band %}Band{% endif %}{% if event.matched_band and event.matched_venue %} {{ _('und') }} {% endif %}{% if event.matched_venue %}{{ _('Location') }}{% endif %} {{ _('gefolgt') }}</div>{% endif %}{% if event.going_users %}<div class="follow-reason">{{ _('Gehen hin:') }} {% for person in event.going_users %}{{ person.name }}{% if not loop.last %}, {% endif %}{% endfor %}</div>{% endif %}</a>{% else %}<p>{{ _('Momentan gibt es keine kommenden Treffer.') }}</p>{% endfor %}</div></section></div>
|
||
</main></body></html>
|