55 lines
1.5 KiB
Plaintext
55 lines
1.5 KiB
Plaintext
---
|
|
import dotsBackgroundUrl from "~/assets/dots-background.svg"
|
|
import AppFooter from "~/components/app-footer.astro"
|
|
import AppLogo from "~/components/app-logo.astro"
|
|
import { LandingAnimation } from "~/components/landing-animation"
|
|
import Layout from "~/components/layout.astro"
|
|
import MainNavigation from "~/components/main-navigation.astro"
|
|
---
|
|
|
|
<Layout>
|
|
<div
|
|
class="fixed inset-0 rotate-6 scale-125 opacity-20"
|
|
style={{ backgroundImage: `url(${dotsBackgroundUrl})` }}
|
|
>
|
|
</div>
|
|
<div class="relative flex min-h-screen min-w-0 flex-col gap-4 pb-4">
|
|
<header class="container">
|
|
<MainNavigation />
|
|
</header>
|
|
<div class="my-auto flex flex-col gap-4 px-4">
|
|
<AppLogo class="mx-auto w-full max-w-lg" />
|
|
|
|
<div class="isolate mx-auto h-44 w-full max-w-md">
|
|
<LandingAnimation client:only />
|
|
</div>
|
|
|
|
<p class="-mb-1 text-center text-lg font-light">
|
|
Create interactive Discord messages with React.
|
|
</p>
|
|
|
|
<div class="flex gap-4 self-center">
|
|
<a href="/guides/getting-started" class="button button-solid">
|
|
Get Started
|
|
</a>
|
|
|
|
<!-- <UncontrolledModal
|
|
button={(button) => (
|
|
<button {...button} class={buttonClass({ variant: "semiblack" })}>
|
|
Show Code
|
|
</button>
|
|
)}
|
|
>
|
|
<div class="text-sm sm:text-base">
|
|
<LandingCode />
|
|
</div>
|
|
</UncontrolledModal> -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container text-center">
|
|
<AppFooter />
|
|
</div>
|
|
</div>
|
|
</Layout>
|