Moheeb Zara
7e15dd1e63
Ports the existing hackerspace.sh Vue site (sibling repo) into this
codebase as a route group `app/(resources)/` so a single domain serves
both the public research / games subsite and the authenticated
management app.
Routes added (all public, all prerendered):
/resources landing page (the original HomePage.vue)
/zine iframe to the printable hackerspace zine
/governance iframe to Governance in a Box
/space-after-dark iframe to the isometric exploration game
/proposal-duel iframe to the proposal-debate game
/atlas iframe to the bundled atlas.html (2.2 MB)
The individual resource paths match the originals exactly so existing
deep links and bookmarks survive the domain switch-over.
Ports six Vue components to React: Wordmark, SpaceIcon, TraceIcon,
CubeIcon, KeyIcon, GridIcon, PromptIcon, AtlasLogo, ProjectCard,
IframeWrapper. CSS scoped under `.resources-root` so the dark IBM Plex
Mono / Libre Baskerville theme cannot bleed into the management app's
shadcn design system. Fonts loaded via next/font/google. The 2.2 MB
atlas.html lives in /public.
proxy.ts adds the six routes plus /atlas.html to PUBLIC_ROUTES so
anonymous visitors can reach them without redirecting to /login.
The management landing page links to /resources twice: a "Resources"
nav link, and a callout under the CTA buttons ("Not running a space?
Read the hackerspace research and games").
25 lines
886 B
TypeScript
25 lines
886 B
TypeScript
import Link from 'next/link'
|
|
import { Wordmark } from './icons'
|
|
|
|
/**
|
|
* Renders an iframe at full-viewport size with a thin top bar that links
|
|
* back to /resources and labels the embedded content. Used by /zine,
|
|
* /governance, /space-after-dark, /proposal-duel, and /atlas.
|
|
*/
|
|
export function IframeWrapper({ url, title }: { url: string; title: string }) {
|
|
return (
|
|
<div className="resources-iframe-wrapper">
|
|
<div className="resources-iframe-topbar">
|
|
<Link href="/resources" className="resources-iframe-back">
|
|
<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth={1.5}>
|
|
<path d="M10 4L6 8l4 4" />
|
|
</svg>
|
|
<Wordmark />
|
|
</Link>
|
|
<span className="resources-iframe-title">{title}</span>
|
|
</div>
|
|
<iframe src={url} className="resources-iframe-frame" title={title} />
|
|
</div>
|
|
)
|
|
}
|