122 lines
3.3 KiB
TypeScript
122 lines
3.3 KiB
TypeScript
import { type Metadata } from "next"
|
|
import Image from "next/image"
|
|
import Link from "next/link"
|
|
|
|
import { siteConfig } from "@/lib/config"
|
|
import { Announcement } from "@/components/announcement"
|
|
import {
|
|
PageActions,
|
|
PageHeader,
|
|
PageHeaderDescription,
|
|
PageHeaderHeading,
|
|
} from "@/components/page-header"
|
|
import { Button } from "@/styles/radix-luma/ui/button"
|
|
|
|
import { CardsDemo } from "./cards"
|
|
|
|
const title = "The Foundation for your Design System"
|
|
const metadataTitle = `${siteConfig.name} - ${title}`
|
|
const description = siteConfig.description
|
|
|
|
const websiteJsonLd = {
|
|
"@context": "https://schema.org",
|
|
"@type": "WebSite",
|
|
"@id": `${siteConfig.url}/#website`,
|
|
url: siteConfig.url,
|
|
name: siteConfig.name,
|
|
alternateName: ["shadcn", "ui.shadcn.com"],
|
|
description: siteConfig.description,
|
|
inLanguage: "en-US",
|
|
sameAs: [siteConfig.links.github, siteConfig.links.twitter],
|
|
}
|
|
|
|
export const dynamic = "force-static"
|
|
export const revalidate = false
|
|
|
|
export const metadata: Metadata = {
|
|
title: {
|
|
absolute: metadataTitle,
|
|
},
|
|
description,
|
|
alternates: {
|
|
canonical: "/",
|
|
},
|
|
openGraph: {
|
|
type: "website",
|
|
url: siteConfig.url,
|
|
title: metadataTitle,
|
|
description,
|
|
siteName: siteConfig.name,
|
|
images: [
|
|
{
|
|
url: `/og?title=${encodeURIComponent(
|
|
title
|
|
)}&description=${encodeURIComponent(description)}`,
|
|
},
|
|
],
|
|
},
|
|
twitter: {
|
|
card: "summary_large_image",
|
|
title: metadataTitle,
|
|
description,
|
|
images: [
|
|
{
|
|
url: `/og?title=${encodeURIComponent(
|
|
title
|
|
)}&description=${encodeURIComponent(description)}`,
|
|
},
|
|
],
|
|
},
|
|
}
|
|
|
|
export default function IndexPage() {
|
|
return (
|
|
<div className="flex flex-1 flex-col">
|
|
<script
|
|
type="application/ld+json"
|
|
dangerouslySetInnerHTML={{
|
|
__html: JSON.stringify(websiteJsonLd).replace(/</g, "\\u003c"),
|
|
}}
|
|
/>
|
|
<PageHeader className="md:**:[.container]:pb-8 lg:**:[.container]:pb-12">
|
|
<Announcement />
|
|
<PageHeaderHeading className="max-w-4xl">{title}</PageHeaderHeading>
|
|
<PageHeaderDescription>{description}</PageHeaderDescription>
|
|
<PageActions>
|
|
<Button asChild className="h-[35px]">
|
|
<Link href="/docs/installation">Get Started</Link>
|
|
</Button>
|
|
<Button asChild variant="secondary">
|
|
<Link href="/docs/components">View Components</Link>
|
|
</Button>
|
|
</PageActions>
|
|
</PageHeader>
|
|
<div className="container-wrapper flex-1 p-0">
|
|
<div className="container overflow-hidden md:px-0 lg:max-w-none">
|
|
<section className="-mx-4 w-[140vw] overflow-hidden md:hidden">
|
|
<Image
|
|
src="/images/full-light.png"
|
|
width={2560}
|
|
height={2764}
|
|
alt="Dashboard"
|
|
className="block h-auto w-full dark:hidden"
|
|
priority
|
|
/>
|
|
<Image
|
|
src="/images/full-dark.png"
|
|
width={2560}
|
|
height={2764}
|
|
alt="Dashboard"
|
|
className="hidden h-auto w-full dark:block"
|
|
priority
|
|
/>
|
|
</section>
|
|
<section className="hidden md:block">
|
|
<CardsDemo />
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|