mirror of
https://github.com/narrrl/pl8list-rewind.git
synced 2026-11-03 16:41:26 +01:00
nvrl
b4470850bf
The front end moves to web/ (Vite, TypeScript, no framework) and is built into web/dist, which the server embeds. hls.js is bundled from npm and loaded on demand instead of vendored. The feed is a custom pager instead of CSS scroll snapping: drag and flick with a spring that keeps the finger's speed, a rubber band at the ends, one page per wheel or trackpad gesture, and only three cards in the DOM. Playback uses two decks. The next track is buffered shortly after the current one starts and tracks crossfade through a Web Audio graph; on iOS, where that would break lock-screen playback, they switch with a cut. An analyser drives a bass pulse of the artwork and its glow, and each card takes its accent colour from the artist image. Styles start from design tokens and respect reduced motion. Docker gets a Node build stage; legal pages use their own small stylesheet.
16 lines
566 B
CSS
16 lines
566 B
CSS
/* Impressum and privacy pages. Plain CSS outside the app bundle, so the server's
|
|
templates can link it by a fixed name. */
|
|
:root { color-scheme: dark; --fg: #f2f2f2; --muted: #9a9a9a; --accent: #ff4d6d; }
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
margin: 0;
|
|
background: #050507;
|
|
color: var(--fg);
|
|
font: 15px/1.6 system-ui, -apple-system, "Segoe UI", sans-serif;
|
|
}
|
|
main { max-width: 42rem; margin: 0 auto; padding: 2rem 1.2rem 4rem; }
|
|
h1 { font-size: 1.8rem; }
|
|
h2 { font-size: 1.1rem; margin-top: 2rem; }
|
|
a { color: var(--accent); }
|
|
code { font-size: 0.9em; }
|