home: fit the hero value prop above the fold (0.96.0)
on common laptops (1366x768, 1280x720, 1440x900) the tavern canvas reserved only 210px for the topbar + caption, so the tagline + CTAs landed at the very bottom edge and the live stats sat ~40px BELOW the fold — a visitor had to scroll to see the value prop and the action buttons. - reserve 290px instead of 210, so the canvas is sized to leave room for the full caption; the tavern is still the large, vivid centrepiece (478px tall at 768, down from 558) - desktop-only: the canvas is width-capped (94vw) on phones, so mobile is untouched - verified across all three laptop sizes: CTA ~80px clearance, stats ~40px clearance (was 40px below the fold) - added the matching changelog entry (0.96) alongside the bump
This commit is contained in:
parent
22c7e4209f
commit
0775b79a1b
@ -17,7 +17,7 @@
|
||||
@media (prefers-reduced-motion: reduce) { .app-loading-gem { animation: none; transform: rotate(45deg); } }
|
||||
</style>
|
||||
<meta name="description" content="amerc is the agent mercenary tavern — hire, run, publish, and remotely deliver AI agents across software boundaries. No infrastructure, just skills." />
|
||||
<meta name="version" content="0.95.0-changelog" />
|
||||
<meta name="version" content="0.96.0-herofit" />
|
||||
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
|
||||
<link rel="icon" href="/app-192.png" type="image/png" sizes="192x192" />
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "amerc-site",
|
||||
"version": "0.95.0-changelog",
|
||||
"version": "0.96.0-herofit",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
||||
@ -10,7 +10,7 @@ import { api } from './api.js';
|
||||
const Menu = ({ size = 20 }) => (<svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden="true"><line x1="3" y1="6" x2="21" y2="6" /><line x1="3" y1="12" x2="21" y2="12" /><line x1="3" y1="18" x2="21" y2="18" /></svg>);
|
||||
const X = ({ size = 20 }) => (<svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18" /><line x1="6" y1="6" x2="18" y2="18" /></svg>);
|
||||
|
||||
const RELEASE = '0.95.0-changelog';
|
||||
const RELEASE = '0.96.0-herofit';
|
||||
|
||||
const NAV = [
|
||||
{ id: 'home', label: 'Tavern' },
|
||||
@ -465,6 +465,7 @@ function StatusPage() {
|
||||
}
|
||||
|
||||
const CHANGELOG = [
|
||||
{ v: '0.96', date: 'Jun 2026', title: 'Hero fits the fold', notes: ['The tagline, calls-to-action and live stats now sit above the fold on laptop screens'] },
|
||||
{ v: '0.95', date: 'Jun 2026', title: 'Docs that flow', notes: ['Fixed dead Quickstart links and cross-linked the guides so you can click straight through'] },
|
||||
{ v: '0.94', date: 'Jun 2026', title: 'Instant first call', notes: ['Minting an agent key now shows a ready-to-run curl with your key inlined'] },
|
||||
{ v: '0.93', date: 'Jun 2026', title: 'Search the docs', notes: ['Full-text search across all documentation, with highlighted context snippets'] },
|
||||
|
||||
@ -1041,7 +1041,7 @@ button {
|
||||
/* 0.24 — 2D RPG game tavern (Kenney Tiny Dungeon CC0 tiles) */
|
||||
/* ===================================================================== */
|
||||
.gm-home { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 12px; background: radial-gradient(circle at 50% 30%, #16100e, #070506); overflow: hidden; }
|
||||
.gm-stage { position: relative; aspect-ratio: 512 / 352; width: min(94vw, calc((100vh - 210px) * 1.4545)); box-shadow: 0 14px 44px rgba(0,0,0,0.75), 0 0 0 3px #2a1a10, 0 0 0 7px #120a06, 0 0 0 9px #000; }
|
||||
.gm-stage { position: relative; aspect-ratio: 512 / 352; width: min(94vw, calc((100vh - 290px) * 1.4545)); box-shadow: 0 14px 44px rgba(0,0,0,0.75), 0 0 0 3px #2a1a10, 0 0 0 7px #120a06, 0 0 0 9px #000; }
|
||||
.gm-room { position: absolute; inset: 0; }
|
||||
.gm-canvas { width: 100%; height: 100%; display: block; image-rendering: pixelated; image-rendering: crisp-edges; }
|
||||
.gm-overlay { position: absolute; inset: 0; }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user