Ludovic Marie
c49a91a22c
The page now reads the design tokens generated from crates/horizon-theme (src/tokens.css, put before style.css by build.mjs), and follows the system's light or dark appearance, with a toggle that remembers the choice. The full-screen sunset hero is replaced by type: a headline, one paragraph, the download, and an index list of what the page holds. Every section is a mono label, a display heading and its content as numbered rows with one-pixel rules: the facts, the fourteen subsystems, the launcher's features, the community links. Rows fade a soft plate in under the pointer; content arrives with a short fade, rise and unblur. The footer ends on the giant faint wordmark. The 404 page and the social preview (og.html) follow. Instrument Serif, the hero images, the parallax, the statement fill and the magnetic buttons are gone; the icons come from Horizon's new mark (xtask icons). Touch targets are 44 px high. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
31 lines
1.7 KiB
HTML
31 lines
1.7 KiB
HTML
<!doctype html>
|
|
<!-- The social preview, rendered to og.png by scripts/shots.mjs, in the design of
|
|
docs/design-system.md (docs/media/brand/social/card.html is the GitHub one). -->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="robots" content="noindex">
|
|
<style>
|
|
@font-face { font-family: "Geist"; src: url("/fonts/Geist-Regular.woff2"); font-weight: 400; }
|
|
@font-face { font-family: "Geist"; src: url("/fonts/Geist-Medium.woff2"); font-weight: 500; }
|
|
@font-face { font-family: "Geist Mono"; src: url("/fonts/GeistMono-Regular.woff2"); }
|
|
html, body { margin: 0; width: 1200px; height: 630px; overflow: hidden; background: #0d0e13; color: #ecedf3; font-family: "Geist"; }
|
|
main { position: relative; height: 100%; padding: 64px; box-sizing: border-box; }
|
|
.top { display: flex; align-items: center; gap: 12px; font-size: 20px; font-weight: 500; }
|
|
.top img { width: 32px; }
|
|
.top span { margin-left: auto; font: 16px "Geist Mono"; color: #8b8f9c; letter-spacing: .04em; }
|
|
h1 { margin: 64px 0 0; font-weight: 500; font-size: 64px; line-height: 1.05; letter-spacing: -.025em; max-width: 15ch; }
|
|
p { margin: 28px 0 0; color: #8b8f9c; font-size: 24px; line-height: 1.5; max-width: 40ch; }
|
|
.word { position: absolute; left: 58px; bottom: -64px; font-weight: 500; font-size: 330px; letter-spacing: -.04em; line-height: .8; color: #181a22; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<div class="word" aria-hidden="true">horizon</div>
|
|
<div class="top"><img src="/favicon.svg" alt="">Horizon<span>PLAYHORIZON.DEV</span></div>
|
|
<h1>The game you know, rebuilt in Rust.</h1>
|
|
<p>Minecraft: Java Edition 26.3, checked against vanilla by differential harnesses. Unofficial; not associated with Mojang or Microsoft.</p>
|
|
</main>
|
|
</body>
|
|
</html>
|