Nuxt/docs/components/molecules/HeroSection.vue

34 lines
1.1 KiB
Vue

<template>
<div class="overflow-hidden relative mx-auto max-w-8xl">
<HeroParallax />
<div class="flex flex-wrap justify-center py-0 section">
<section class="flex flex-col justify-start w-full px-4 pt-36 pb-52 md:pt-40 lg:pb-56 lg:pt-48 text-center">
<div>
<span class="nuxt-text-highlight">Currently in public beta</span>
</div>
<h1 class="font-normal font-serif text-display-5 xs:text-display-4 md:text-display-3 2xl:text-display-2 my-8">
<Markdown use="title" unwrap="p" />
</h1>
<h2
class="
font-normal
text-body-base
xs:text-body-lg
md:text-body-xl
2xl:text-body-2xl
px-8
sm:px-0
text-secondary-dark
dark:text-cloud-lighter
"
>
<Markdown use="description" unwrap="p" />
</h2>
<p class="text-center mt-2 text-secondary-dark dark:text-cloud-lighter">
<Markdown use="body" unwrap="p" />
</p>
</section>
</div>
</div>
</template>