website: full redesign — live hero demo, bento features, new visual identity #54

Merged

richard merged 2 commits from feat/website-redesign into main

2026-08-18 01:23:45 +02:00

richard commented

2026-08-18 01:22:20 +02:00

Owner

Summary

Complete visual overhaul of the marketing site — dark mesh-gradient glass identity with self-hosted Space Grotesk, full light-theme support, and all copy running through the existing EN/NL/FR/DE i18n system.

Hero "live demo": a mock YouTube page cleans itself up in a loop — the Shorts shelf, a sponsored tile, and a keyword match get flagged, dissolve, and the grid reflows. Frame height is locked so the page never shifts; reduced-motion users get the static clean state.
Stats band: count-up counters (50+ toggles · 0 trackers · 4 languages · 100% local)
Bento feature grid: illustrative mini-UI per tile — SponsorBlock timeline with skipped segments, focus break reminder, real dashboard stats, real toggle examples
Screenshot showcase: tab pills + prev/next arrows + lightbox, replacing the scroll strip
Sync / privacy / install reskinned, scroll reveals, film-grain texture
Fonts self-hosted (22 KB woff2) — the site itself makes zero third-party requests
privacy.html and blocklists.html aligned with the new design tokens

Notes

Branched off feat/hide-playables-shelf (PR #53), so this PR includes those commits until #53 merges — merge #53 first and the diff here reduces to the website work only.

Test plan

Playwright-verified: dark, light, and 390 px mobile renders; zero console errors
Demo loop: removes → 4 s clean pause → restores → repeats; page height stable (5941 px) across all states
Showcase arrows wrap correctly and stay in sync with tab pills
Verify on the deployed nginx container

🤖 Generated with Claude Code

## Summary Complete visual overhaul of the marketing site — dark mesh-gradient glass identity with self-hosted Space Grotesk, full light-theme support, and all copy running through the existing EN/NL/FR/DE i18n system. - **Hero "live demo"**: a mock YouTube page cleans itself up in a loop — the Shorts shelf, a sponsored tile, and a keyword match get flagged, dissolve, and the grid reflows. Frame height is locked so the page never shifts; reduced-motion users get the static clean state. - **Stats band**: count-up counters (50+ toggles · 0 trackers · 4 languages · 100% local) - **Bento feature grid**: illustrative mini-UI per tile — SponsorBlock timeline with skipped segments, focus break reminder, real dashboard stats, real toggle examples - **Screenshot showcase**: tab pills + prev/next arrows + lightbox, replacing the scroll strip - Sync / privacy / install reskinned, scroll reveals, film-grain texture - Fonts self-hosted (22 KB woff2) — the site itself makes zero third-party requests - privacy.html and blocklists.html aligned with the new design tokens ## Notes Branched off `feat/hide-playables-shelf` (PR #53), so this PR includes those commits until #53 merges — merge #53 first and the diff here reduces to the website work only. ## Test plan - [x] Playwright-verified: dark, light, and 390 px mobile renders; zero console errors - [x] Demo loop: removes → 4 s clean pause → restores → repeats; page height stable (5941 px) across all states - [x] Showcase arrows wrap correctly and stay in sync with tab pills - [ ] Verify on the deployed nginx container 🤖 Generated with [Claude Code](https://claude.com/claude-code)

richard added 2 commits

2026-08-18 01:22:20 +02:00

website: point source links at the 365DevNet Forgejo instance 58754390d1

The site advertised Codeberg as the home of the source; the repository now
lives on the self-hosted Forgejo at git.365devnet.eu.

- Replaced every https://codeberg.org/365DevNet/CleanWatch link with
  https://git.365devnet.eu/365DevNet/CleanWatch: the install card's "Open
  source" button and the footer on index.html, and the header nav plus the
  contributions line on blocklists.html. Verified the new URL returns 200
  anonymously, so the public links are not pointing at a login wall.
- Renamed the platform in the visible copy accordingly ("View on Forgejo",
  "Issues and pull requests welcome on Forgejo", "Forgejo repository") in all
  four locales (EN, NL, DE, FR).

Website only. The extension's Help page and the README still name Codeberg;
those ship to users and are left for a separate change.

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

website: full redesign — live hero demo, bento features, new visual identity 0116c65d6b

Rebuilds the site around a dark mesh-gradient glass design with
self-hosted Space Grotesk and a light theme variant:

- Hero: mock YouTube page that cleans itself up in a loop (Shorts
  shelf, sponsored tile, keyword match dissolve with readable labels
  and a smooth reflow); frame height is locked so content below never
  shifts. Reduced-motion users get the clean end state.
- Stats band with count-up animation (50+ toggles, 0 trackers,
  4 languages, 100% local)
- Bento feature grid with illustrative mini-UI per tile, including a
  SponsorBlock timeline, focus break reminder, real dashboard stats,
  and real toggle examples
- Screenshot showcase with tab pills, prev/next arrows, and lightbox
- Sync/privacy/install sections reskinned; scroll reveals throughout
- All new copy translated (EN/NL/FR/DE); fonts self-hosted so the
  site makes zero third-party requests
- privacy.html and blocklists.html aligned with the new tokens

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

richard merged commit 8a40cc66a9 into main

2026-08-18 01:23:45 +02:00

richard deleted branch feat/website-redesign

2026-08-18 01:23:45 +02:00

richard referenced this pull request from a commit

2026-08-18 01:23:47 +02:00

Merge pull request 'website: full redesign — live hero demo, bento features, new visual identity' (#54) from feat/website-redesign into main