forked from Mike/freno-dev
74 lines
2.5 KiB
TypeScript
74 lines
2.5 KiB
TypeScript
/**
|
|
* Life and Lineage — lineage subdomain landing page.
|
|
*
|
|
* This intentionally preserves the original marketing-page structure: a single
|
|
* full-viewport `SimpleParallax` Cave background with the app icon, title,
|
|
* tagline, and store badges centered on screen. No sidebars, no scrollable
|
|
* feature sections, and no extra content — the parallax effect depends on the
|
|
* page being exactly one viewport tall. The persistent `SubdomainHeader`
|
|
* sits sticky above the parallax backdrop so navigation is reachable on every
|
|
* subdomain page.
|
|
*/
|
|
import { A } from "@solidjs/router";
|
|
import { PageHead } from "~/components/PageHead";
|
|
import { EdgeCacheHeaders } from "~/components/EdgeCacheHeaders";
|
|
import SubdomainHeader from "~/components/SubdomainHeader";
|
|
import SimpleParallax from "~/components/SimpleParallax";
|
|
import DownloadOnAppStoreDark from "~/components/icons/DownloadOnAppStoreDark";
|
|
import {
|
|
APP_STORE_URL,
|
|
DOWNLOADS_HREF,
|
|
APP_ICON_SRC,
|
|
GOOGLE_PLAY_BADGE_SRC,
|
|
PAGE_META
|
|
} from "~/routes/lineage/landing-content";
|
|
|
|
export default function LineageLandingPage() {
|
|
return (
|
|
<>
|
|
<EdgeCacheHeaders maxAge={300} />
|
|
<PageHead title={PAGE_META.title} description={PAGE_META.description} />
|
|
<SubdomainHeader />
|
|
<SimpleParallax>
|
|
<div class="flex h-full flex-col items-center justify-center px-4 text-white">
|
|
<div>
|
|
<img
|
|
src={APP_ICON_SRC}
|
|
alt="Life and Lineage App Icon"
|
|
height={128}
|
|
width={128}
|
|
class="object-cover object-center"
|
|
/>
|
|
</div>
|
|
<h1 class="mt-4 mb-4 text-center text-5xl font-bold">
|
|
Life and Lineage
|
|
</h1>
|
|
<p class="text-xl">A dark fantasy adventure</p>
|
|
|
|
<div class="mt-8 flex flex-wrap items-center justify-center gap-4">
|
|
<a
|
|
class="my-auto transition-all duration-200 ease-out active:scale-95"
|
|
href={APP_STORE_URL}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<DownloadOnAppStoreDark size={50} />
|
|
</a>
|
|
<A
|
|
href={DOWNLOADS_HREF}
|
|
class="transition-all duration-200 ease-out active:scale-95"
|
|
>
|
|
<img
|
|
src={GOOGLE_PLAY_BADGE_SRC}
|
|
alt="Get it on Google Play"
|
|
width={180}
|
|
height={60}
|
|
/>
|
|
</A>
|
|
</div>
|
|
</div>
|
|
</SimpleParallax>
|
|
</>
|
|
);
|
|
}
|