Hero editor: fullscreen landing, remove two-card row, quick links into hero #28

Merged
whitlocktech merged 1 commits from feature/hero-fullscreen-landing into main 2026-07-04 02:55:52 +00:00
2 changed files with 21 additions and 55 deletions

View File

@@ -84,6 +84,25 @@ export function defaultLayout(teaser) {
],
},
},
{
id: 'default-quick-links',
type: 'buttons',
x: 50,
y: 85,
z: 3,
anchor: 'center',
props: {
align: 'center',
gap: 10,
items: [
{ label: 'News', to: '/site/news', variant: 'ghost' },
{ label: 'Screenshots', to: '/site/screenshots', variant: 'ghost' },
{ label: 'Five on Friday', to: '/site/five-on-friday', variant: 'ghost' },
{ label: 'Monthly Newsletter', to: '/site/newsletter', variant: 'ghost' },
{ label: 'About', to: '/site/about', variant: 'ghost' },
],
},
},
],
}
}

View File

@@ -1,34 +1,10 @@
import { useEffect, useMemo, useState } from 'react'
import { Link } from 'react-router-dom'
import PublicLayout from '../../components/PublicLayout.jsx'
import HeroElement from '../../components/HeroElement.jsx'
import { useSite } from '../../contexts/SiteContext.jsx'
import { api } from '../../api/client.js'
import { defaultLayout, parseLayout, heroBackground } from '../../lib/heroLayout.js'
const QUICK = [
{ label: 'News', to: '/site/news' },
{ label: 'Screenshots', to: '/site/screenshots' },
{ label: 'Five on Friday', to: '/site/five-on-friday' },
{ label: 'Monthly Newsletter', to: '/site/newsletter' },
{ label: 'About', to: '/site/about' },
]
const DESTINATIONS = [
{
kicker: 'Public portal',
title: 'Mysticmoon Website',
body: 'Updates, screenshots, newsletters, and weekly community posts from the shard.',
to: '/site',
},
{
kicker: 'Knowledge base',
title: 'Mysticmoon Wiki',
body: 'Guides, maps, systems, items, monsters, crafting, lore, and rules.',
to: '/wiki',
},
]
// Admin "Preview" opens the portal with ?preview=1 to render the unpublished draft.
const PREVIEW = typeof window !== 'undefined' && new URLSearchParams(window.location.search).get('preview') === '1'
@@ -77,8 +53,8 @@ export default function Portal() {
<section
style={{
position: 'relative',
minHeight: 'clamp(600px,72vh,860px)',
overflow: 'hidden',
flex: 1,
minHeight: '100vh',
...bgStyle,
}}
>
@@ -88,35 +64,6 @@ export default function Portal() {
))}
</div>
</section>
<div className="shell" style={{ padding: '56px 0 12px' }}>
<nav className="grid-2" aria-label="Main destinations">
{DESTINATIONS.map((d) => (
<Link key={d.to} to={d.to} className="card" style={{ padding: 30 }}>
<span className="card-kicker" style={{ letterSpacing: '0.16em', marginBottom: 14 }}>
{d.kicker}
</span>
<strong
className="display"
style={{ fontSize: '1.7rem', color: 'var(--head)', marginBottom: 10, fontWeight: 600 }}
>
{d.title}
</strong>
<span className="muted">{d.body}</span>
</Link>
))}
</nav>
</div>
<div className="shell" style={{ padding: '24px 0 64px' }}>
<nav style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'center', gap: 10 }} aria-label="Quick links">
{QUICK.map((q) => (
<Link key={q.to} to={q.to} className="pill">
{q.label}
</Link>
))}
</nav>
</div>
</main>
</PublicLayout>
)