* feat(website): rebuild the hero, features, download and support sections
Third landing redesign PR: the home page now speaks the app's own
language instead of a template's.
- Hero: left-aligned headline, a primary button that follows the
visitor's OS (server-rendered fallback goes to /download/), an "All
platforms" button and a text link for self-hosting. Project numbers
(stars, downloads, languages, license) are set in the page's own
typography from the GitHub API at build time (`lib/github-stats.ts`);
anything the build cannot resolve is left out rather than faked. A
small "Now playing" card with fictional demo content replaces the
mascot, badges and social chips; the screenshot is lit by a blurred
copy of itself, like the player's ambient mode.
- Features: a bento of interface fragments (EPG rows with progress,
posters with a resume bar, a download queue with a REC dot, a remote
D-pad) instead of numbered cards with icon watermarks and a marquee.
The marquee CSS is gone.
- Download: one row per platform with the release's file names and a
"Detected" badge for the visitor's OS (`lib/detect-platform.ts`),
package-manager commands in the same panel.
- Support becomes a single row; the disclaimer moves into the footer,
which also gets the mascot and a link list.
- Home sections drop the decorative eyebrows and the divider rules; the
unused broadcast-wave, support-signal and watermark illustrations are
removed.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
* test(website): cover the rebuilt home sections and the OS-aware download CTA
`website-home-sections.test.mjs` (in the website test target) reads the
built home page — generic hero CTA to /download/, project facts, no
badge images or dashed borders, every feature page linked from the
bento, one download row per platform with release file names and the
Detected badge hidden, the disclaimer and mascot in the footer — and
then drives it in Chromium under Windows, macOS, Linux and Android user
agents: the primary button and the Detected row follow the platform,
the phone keeps the generic markup, and the copy button writes the
command to the clipboard.
`detectPlatform()` now consults the user-agent string before the
client-hints platform and the deprecated `navigator.platform`, so the
source a visitor's tools actually change decides first; silent sources
fall through instead of vetoing.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
* fix(website): keep iPads on the generic download path
iPadOS asks for desktop sites with a Macintosh user agent and a
`MacIntel` platform, so the OS guess sent iPad visitors to the macOS
installers. A "mac" verdict is now trusted only on a device without
touch points: no Mac has a touch screen, every iPad reports several.
The browser test adds an iPad-in-desktop-mode row to the generic-device
matrix next to the Android phone.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---------
Co-authored-by: Claude Fable 5.1 <noreply@anthropic.com>
* style(website): solid hairlines, Bricolage Grotesque display face, drop TV effects
First of three landing redesign PRs. This one only touches tokens and
surface treatment so every page (home, blog, /features, /compare,
/download) benefits without any structural change:
- Replace every dashed border with a solid hairline; `.card-dotted`
becomes `.card-panel` (bg step + hairline, lighter hairline on hover)
and the section divider is solid `surface-800`.
- Swap the display face from Playfair Display to Bricolage Grotesque
(DM Sans body and IBM Plex Mono unchanged). The italic accent word
that every heading repeated is gone; only page-level h1s keep the
accent, and as colour rather than italic.
- Remove the CRT/TV effects: the `.btn-tv` block and its nine keyframes,
the scanline overlay on the hero screenshot, the CRT hover overlay and
teal glow shadows on feature cards, the pulsing mascot, and the unused
scan/tv-* Tailwind animations.
- The hero download button and the header Download link are now solid
accent buttons; the self-host link is a plain text link.
- Blog tag chips use neutral surface borders so teal stays reserved for
actions.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
* style(website): finish the dashed sweep in prose and package rows
The blanket `border-dashed ` removal ate the utility but not the
variant prefix in the blog prose classes, leaving
`prose-pre:prose-pre:...` and `prose-hr:prose-hr:...`; and the
Linux package rows still used `divide-dashed`.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---------
Co-authored-by: Claude Fable 5.1 <noreply@anthropic.com>
- Introduced a new SVG illustration for supporting open-source software.
- Added a footer watermark image to enhance the visual design of the footer.
- Created a new SupportSection component to encourage user contributions with links to GitHub Stars, GitHub Sponsors, and Ko-fi.
- Updated the Hero component to include a mascot image and social links for GitHub, Telegram, and Ko-fi.
- Enhanced the FeatureGrid and Footer components with improved styling and layout adjustments.
- Updated blog post metadata for better formatting and added a disclaimer in the SupportSection.
- Improved global CSS styles for buttons and animations to create a more engaging user experience.
Entire-Checkpoint: b7a1c2f08179
