Bestenliste, Devlog-Filter, Galerie und leere Bereiche

Vier Stellen, die beim Durchsehen der Seiten aufgefallen sind.

Die Bestenliste zeigte nur Namen — und für Platz 1 bis 3 denselben Pokal
ohne Nummer, wodurch die Reihenfolge nur an der Position erkennbar war.
Jetzt: Rangnummer, Avatar und die ersten drei Plätze farblich abgesetzt.
Die Avatare kommen aus dem Member-Cache, der durch den GuildMembers-Intent
ohnehin gefüllt ist — das kostet keinen einzigen Discord-Aufruf. Wer nicht
im Cache liegt, bekommt seinen Anfangsbuchstaben statt eines leeren Kreises.

Die Projekt-Chips im Devlog-Archiv waren bloß Beschriftung. Jetzt filtern
Chips mit Anzahl nach Projekt (ECOGAME / D4RKBOT) — man will meist nur
eins von beiden lesen. Serverseitig über LIKE auf die erste Zeile, wo das
Projekt ohnehin steht; das spart eine Spalte und eine Migration. Eine
aktive Suche schlägt den Filter, sonst müsste die Volltextsuche beides
verbinden, ohne dass jemand danach fragt.

Galerie: Vorschaubilder von 240 auf 340 Pixel, und Name plus Datum stehen
dauerhaft am Bild statt nur beim Überfahren — am Handy gab es kein Hover
und damit nie eine Zuordnung.

Events, Changelog, Galerie und Level endeten bei wenig Inhalt mit einem
einzelnen Satz in einer sonst leeren Seite; das sah nach Fehler aus statt
nach „noch nichts da". Jetzt steht dort ein Block mit Symbol, Erklärung
was hier erscheinen wird, und Verweisen auf belebte Bereiche.

Dazu ein Sprung-nach-oben-Knopf im Devlog-Archiv und im Changelog, die
beide sehr lang werden.

Beim Testen gefunden: ESCAPE '\' in einem JS-String kommt als leeres
Zeichen in SQLite an ("ESCAPE expression must be a single character") —
der Backslash müsste doppelt entwertet werden. Jetzt ist das Escape-Zeichen
ein Ausrufezeichen, das die Falle gar nicht erst aufmacht.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/src/pages/Galerie.jsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { apiGet } from '../api.js';
-import { IconChevronLeft, IconChevronRight } from '../icons.jsx';
+import { IconChevronLeft, IconChevronRight, IconGallery } from '../icons.jsx';
+import EmptyState from '../components/EmptyState.jsx';
 import Lightbox from '../components/Lightbox.jsx';
 import { SkeletonGrid } from '../components/Skeleton.jsx';
 
@@ -38,7 +39,14 @@ export default function Galerie() {
             <section className="content">
                 {error && <p className="notice">Galerie konnte nicht geladen werden.</p>}
                 {!error && !data && <SkeletonGrid n={9} />}
-                {data?.total === 0 && <p className="notice">Noch keine Screenshots — poste welche im Discord!</p>}
+                {data?.total === 0 && (
+                    <EmptyState
+                        Icon={IconGallery}
+                        title="Noch keine Screenshots"
+                        text="Alles, was im Screenshot-Kanal landet, erscheint automatisch hier — mitsamt Name und Datum."
+                        actions={[{ to: '/devlogs', label: 'Devlogs lesen' }]}
+                    />
+                )}
 
                 <div className="gallery-grid">
                     {shots.map((s, i) => (