Es stand auf `inset: 0` und lag damit auch hinter Seiten- und Kopfleiste — beide undurchsichtig. Bei 1280×800 gemessen: 18,8 % der Breite, 7 % der Höhe, zusammen 24,4 % der Bildfläche, die niemand je zu sehen bekam. Solange alles weichgezeichnet war, fiel das nicht auf; ein verwischter Rand sieht wie jeder andere aus. Scharf beginnt der Inhalt mitten im Motiv — bei den Bergrettern mit einem angeschnittenen Kopf direkt an der Kante der Seitenleiste. Jetzt sitzt das Bild in dem Feld, in dem es auch zu sehen ist, und wird darin ganz zugeschnitten: links die Seitenleistenbreite, oben die Kopfleistenhöhe. Der Kontrast bleibt, wo er war — 3,95∶1 scharf statt 3,97∶1, derselbe Zuschnitt in einem anderen Feld. Am Telefon gibt es keine Seitenleiste; dort nimmt die Navigationszeile oben noch einen Streifen weg, solange man ganz oben steht, und ist nach dem ersten Bildlauf weg. Die beiden älteren Begründungen über der Regel standen noch da und sagten inzwischen das Gegenteil — die eine erklärte, warum das Bild über die volle Breite gehört. Sie sind zu einer zusammengefasst, die den ganzen Weg erzählt. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Flaro Web
Die Weboberfläche für Rechner, auf denen es keine App gibt — Windows vor allem.
Aufbau
| Ordner | Was |
|---|---|
app/ |
Das Frontend (Vite, TypeScript) |
server/ |
Ein Server ohne Abhängigkeiten, der die Anfragen weiterreicht und die gebauten Dateien ausliefert |
frontend/ |
Die erste Fassung als einzelne Datei. Läuft, wird abgelöst. |
jellyfin-theme/ |
Ein Kleid für Jellyfins eigene Oberfläche — die kleine Lösung von vorher |
Warum ein eigener Server?
Er löst zwei Dinge, an denen die einzelne Datei scheitert, und zwar unabhängig davon, wie gut das Frontend geschrieben ist:
- Herkunft. Anfragen laufen über
/apiund damit über dieselbe Adresse wie die Seite. Kein CORS, auch nicht beim Streamen. - Klartext und Verschlüsselung. Läuft der Medienserver über
httpund die Seite überhttps, blockiert der Browser den Stream. Dagegen kann keine Zeile im Frontend etwas tun — ein Server davor schon.
Nebenbei bleibt der Zugangsschlüssel beim Server, statt im Browser zu liegen.
Betreiben
cd app && npm install && npm run build
cd ../server && FLARO_SERVER=http://jellyfin:8096 node index.js
Dann auf http://localhost:8080. Der Port lässt sich über PORT ändern.
Entwickeln
cd app && FLARO_SERVER=http://jellyfin:8096 npm run dev
Vite übernimmt dabei das Weiterreichen, der eigene Server wird nicht gebraucht.