hyperhive / we are the wired between two shaded gradients that pulse in a wave, still under reduced motion. It sits under 2em from the bottom edge, clear of the setup assistant.
24 lines
888 B
TypeScript
24 lines
888 B
TypeScript
// <StartPage> — `/`, the swarm's landing page: the swarm's name over the
|
|
// digital-rain backdrop, plus the setup assistant while the swarm has no
|
|
// `ruth`, and the slug at the foot. The header's swarm name links here. The hive roster is a card on the agents page.
|
|
import { MatrixRain } from "../shell/MatrixRain.js";
|
|
import { Slug } from "../ui/slug/Slug.js";
|
|
import { useSwarmName } from "../shell/useSwarmName.js";
|
|
import { SetupAssistant } from "./SetupAssistant.js";
|
|
import "./StartPage.css";
|
|
|
|
// Same fallback as the header and the page title, so an unnamed swarm shows
|
|
// one label everywhere.
|
|
const DEFAULT_NAME = "hyperhive swarm";
|
|
|
|
export function StartPage() {
|
|
const name = useSwarmName() ?? DEFAULT_NAME;
|
|
return (
|
|
<div class="start-page">
|
|
<MatrixRain />
|
|
<h1 class="start-page-name">{name}</h1>
|
|
<SetupAssistant />
|
|
<Slug />
|
|
</div>
|
|
);
|
|
}
|