Commit Graph

4 Commits

Author SHA1 Message Date
Claude Code
1ec00ea6dc redesign: dark premium retro + cover-image card listings
Replaces the earlier light editorial pass with a darker premium retro
aesthetic for hype404 specifically:

- Warm near-black bg (#0d0c0a) with subtle radial-gradient phosphor
  tint, cream ink (#ebe2cd)
- Phosphor lime accent (#b8e25a) for brand mark, drop cap, code, tag
  hover (CRT/terminal nod, restrained — not the harsh #00ff66)
- Hot magenta secondary (#f43f8c) for "Top story" flag, blockquote
  rule, drop cap (Y2K Wired-magazine vibe)
- Cyan-leaning links (#7cd1ff)
- Same Fraunces serif headlines + Inter body + JetBrains Mono code
- No scanlines, no glitch, no marquee, no [LOG] tags

Listing pages now use a magazine-style hero card (top story, 1.1:1
image+text grid, 36px headline) + image-row cards for the rest.
Each row has a 220px cover thumb on the left, body on the right.
Posts without images render text-only (CSS :has() fallback). Cover
extracted via raw-markdown regex (no full render needed).

Subtle scroll-reveal animation: cards fade+lift into view via
IntersectionObserver, gracefully skips when unsupported.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-01 16:57:38 +08:00
Claude Code
3f7ee2481d redesign: premium editorial light theme
Replaces the 90s CRT/terminal aesthetic (green-on-black, scanlines,
marquee, VT323/Press Start 2P, glitch animation, [LOG] tags) with a
clean editorial magazine layout:

- Warm off-white background (#fbfaf6) with rich near-black ink
- Fraunces serif for display/headlines + Inter for body + JetBrains Mono
  for code (variable-axis Fraunces with optical-size adjustments)
- Terracotta accent (#e85d3c) — single brand color, used for the "404"
  in the wordmark, drop caps, hover states, blockquote rule
- Generous whitespace, 720px reading column, 1100px container
- Card-style post listing with subtle hover lift
- Drop cap on the first paragraph of each article
- Pill-shaped tags + pagination buttons
- Class names preserved (.post, .post-title, .post-content, .tag, etc.)
  so PostList and post pages cascade through unchanged

The "hype404" wordmark still leads the brand identity but is now bold
serif rather than pixel-art ASCII. Existing posts' AI-generated CRT
cover images remain — the magazine layout treats them as deliberate
cover-art rather than chrome, which still reads coherently.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-01 16:35:59 +08:00
071da45a43 design: 90s terminal/AI retro layout (VT323 + Press Start 2P + scanlines + glitch) 2026-04-20 05:07:00 +00:00
8dc5b450a8 initial: Astro port of Hype404 with favicon + SEO redirects 2026-04-20 04:52:49 +00:00