Redesign landing page to remove AI-slop tells - #4
Merged
Conversation
Re-design the landing page so it stops reading as AI-generated, following the anti-pattern catalogue at https://impeccable.style/slop/, while keeping the TorchIO purple brand. - Anchor every purple to the exact logo color (#812CE5); derive shades/tints via color-mix. Dark mode now lightens the logo hue instead of an arbitrary purple, and the CTA band is the exact logo purple in both themes. - Remove gradient text, purple gradients, blurred hero orbs, glassmorphism (backdrop-filter blur), colored glow shadows, fake mac window chrome, and uppercase tracked eyebrow kickers. - Replace Inter-everywhere with a real type pairing: Bricolage Grotesque (display) + Hanken Grotesk (body), plus JetBrains Mono for code, all self-hosted from assets/fonts/ as variable woff2 (SIL OFL). Drop the Google Fonts links; add preloads. - Fix a heading-level skip in the footer (h4 -> h3).
There was a problem hiding this comment.
Pull request overview
Updates the TorchIO static landing page to use a more “intentional” visual design and self-hosted typography, removing several modern UI effects called out in the PR description while keeping the brand purple as the palette anchor.
Changes:
- Replaces Google Fonts (Inter) with self-hosted variable fonts (Bricolage Grotesque, Hanken Grotesk, JetBrains Mono) and adds OFL license files.
- Flattens several gradient/blur/glass effects into solid/opaque surfaces; pins CTA styling to the logo purple.
- Improves footer heading semantics by adjusting column headers to avoid heading-level skips.
Reviewed changes
Copilot reviewed 7 out of 10 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| README.md | Documents the brand palette derivation and the new self-hosted font stack/licenses. |
| index.html | Removes Google Fonts usage, preloads self-hosted fonts, and tweaks hero code card + footer headings. |
| 404.html | Removes Google Fonts usage, preloads self-hosted fonts, and replaces gradient “404” styling with solid brand color. |
| assets/css/styles.css | Adds @font-face declarations, introduces color-mix()-derived brand tokens, and removes/adjusts various visual effects. |
| assets/fonts/OFL-jetbrains-mono.txt | Adds font license text for JetBrains Mono (SIL OFL). |
| assets/fonts/OFL-hanken-grotesk.txt | Adds font license text for Hanken Grotesk (SIL OFL). |
| assets/fonts/OFL-bricolage-grotesque.txt | Adds font license text for Bricolage Grotesque (SIL OFL). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
🌐 Site PreviewPreview of the landing page for this PR: 🔗 https://smokeshow.helpmanual.io/354i1n1p6w0f482k2u2w/ Built from 14296e0 |
- 404.html: use root-relative /assets/ paths so the not-found page stays styled when GitHub Pages serves it at an arbitrary missing URL depth. - styles.css: add static hex/rgba fallbacks before the color-mix() brand tokens (light and dark) for browsers without color-mix() support. - styles.css: drop italic on code comments (.tok-c) to avoid synthetic italics, since no italic JetBrains Mono face is shipped.
- index.html: preload the self-hosted JetBrains Mono woff2 alongside the other critical fonts; it is used above the fold (install snippet + hero code card), so preloading avoids a font swap/layout shift. - README.md: "no third-party request" -> "no third-party requests".
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
[Generated by a coding agent]
Re-designs the landing page so it stops reading as AI-generated, following the anti-pattern catalogue at https://impeccable.style/slop/, while keeping the TorchIO purple brand.
Color (logo purple)
--brandis the exact logo purple#812CE5(sampled fromassets/img/torchio-logo.png); every other purple derives from it viacolor-mix.#a06bf0.Removed slop tells
filter: blur(90px)) → removed.backdrop-filter: blur) on header, pipeline steps, slider tags/handle → opaque surfaces.--shadow-brand) → neutral elevation / none.quickstart.pyfilename label.Typography
assets/fonts/as variablewoff2(SIL OFL, licenses included). Google Fonts links removed; preloads added.Accessibility
h4→h3(fixes anh2→h4heading-level skip).Validation
mise run checkpasses.npx impeccable detect index.html: 9 → 7 findings, with every signature AI-aesthetic tell eliminated. The remaining 7 are legitimate structural choices (clip-path reveal, border-radius clipping, numbered pipeline steps) or pre-existing font-size density.