ScarriffleandClaude Opus 5
78e347c58d
Gemessen am Bildschirmfoto: zwischen den Zeilen lagen 71 Pixel bei 18 Pixel Texthöhe — fast das Vierfache dessen, was `line-height: 1.25` ergibt. Und die zweite Zeile war mitten im Buchstaben abgeschnitten. Beides derselbe Grund. Der bisherige Weg ging über die Norm: `lineAlign = "end"` macht `line: 90` zur **Unter**kante, und dann steht auch ein zweizeiliger Untertitel vollständig über dem Rand. Chrome und Firefox halten sich daran — nachgestellt und abgelichtet. WebKit nicht: dort ist es die Oberkante, der Kasten wächst nach unten aus dem Bild, und `line-height` aus `::cue` bleibt ebenfalls wirkungslos. Jetzt wird dort gar nichts mehr an den Einblendungen verstellt. Stattdessen rückt der Kasten ab, in den der Browser sie setzt — ein Element, das WebKit selbst erfunden hat und das es dort also gibt. Eine Verschiebung des ganzen Kastens kann nichts abschneiden, egal wie viele Zeilen eine Einblendung hat. Wer den Kasten nicht kennt — Firefox —, bekommt weiter den Weg über die Norm. Erkannt wird das daran, ob die Regel im Stilblatt stehen bleibt, nicht an der Browserkennung. 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.