DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Startseite: neue "Event des Jahres"-Kachel unter den 3 Welt-Kacheln

Browse Source 
Nutzer-Wunsch 20.08.2026: volle Breite wie die 3 Welt-Kacheln zusammen,
zeigt immer genau zwei Events. Erste Belegung mit zwei bereits auf
zeitreise.html dokumentierten echten Events (28-Stunden-Stream 7. März
2026, Creator Cup 27. Juli - 2. August 2026) statt Platzhaltertext --
Texte sind gekuerzte, inhaltlich unveraenderte Fassungen der bestehenden
Zeitreise-Beschreibungen, beide Karten verlinken auf zeitreise.html. Alle
5 Sprachen gepflegt. Gleiche Karten-/Tag-Optik wie die Welt-Kacheln, damit
es wie ein natuerlicher vierter Baustein wirkt statt wie ein fremdes
Element.

Per Playwright verifiziert: exakt gleiche Breite wie .hero-grid (1180px),
2 Karten, kein horizontales Scrollen auf Mobil, keine Konsolenfehler.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
DogFatherGit
2026-08-20 12:51:17 +02:00
co-authored by Claude Opus 5
parent 9adebd9bc4
commit 071f3d0382
3 changed files with 107 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/main.css
+40
View File
@@ -1590,6 +1590,46 @@ header.site-header {
}
@media (max-width: 760px) { .hero-grid { grid-template-columns: 1fr; } }
/* "Event des Jahres" (20.08.2026) — volle Breite wie .hero-grid darüber (eigener Block,
kein Grid-Kind), zeigt bewusst IMMER genau zwei Events nebeneinander. Gleiche
Karten-/Tag-Optik wie die 3 Welt-Kacheln, damit es wie ein natürlicher Abschluss des
Grids wirkt statt wie ein fremdes Element. */
.jahres-events {
margin-top: 1.2rem;
background: var(--card-bg);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 1.6rem;
box-shadow: var(--shadow);
}
.jahres-events-head { margin-bottom: 1.2rem; }
.jahres-events-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.2rem;
}
@media (max-width: 760px) { .jahres-events-grid { grid-template-columns: 1fr; } }
.jahres-event-card {
display: block;
padding: 1.2rem 1.4rem;
border-radius: calc(var(--radius) - 4px);
border: 1px solid var(--border);
background: rgba(255, 255, 255, .02);
transition: border-color .15s ease, transform .15s ease;
}
.jahres-event-card:hover { border-color: var(--accent); transform: translateY(-3px); }
.jahres-event-datum {
display: block;
color: var(--accent);
font-weight: 700;
font-size: .82rem;
letter-spacing: .02em;
margin-bottom: .3rem;
}
.jahres-event-card h3 { margin: 0 0 .4rem; font-size: 1.15rem; }
.jahres-event-card p { margin: 0 0 .6rem; color: var(--text-muted); font-size: .93rem; line-height: 1.55; }
.jahres-event-mehr { color: var(--accent); font-weight: 600; font-size: .88rem; }
/* ---------- Cards ---------- */
.card {
background: var(--card-bg);