57 lines
1.7 KiB
Plaintext
57 lines
1.7 KiB
Plaintext
---
|
|
import GoLinkPrimaryButton from '@components/buttons/GoLinkPrimaryButton.astro';
|
|
import GoLinkSecondaryButton from '@components/buttons/GoLinkSecondaryButton.astro';
|
|
import Image from '@components/ui/images/Image.astro';
|
|
|
|
interface Props {
|
|
title: string;
|
|
subTitle?: string;
|
|
primaryBtn?: string;
|
|
primaryBtnURL?: string;
|
|
secondaryBtn?: string;
|
|
secondaryBtnURL?: string;
|
|
src?: any;
|
|
alt?: string;
|
|
rounded?: boolean;
|
|
}
|
|
|
|
const { title, subTitle, primaryBtn, primaryBtnURL, secondaryBtn, secondaryBtnURL, src, alt } = Astro.props;
|
|
|
|
const roundedClasses = Astro.props.rounded ? "rounded-2xl" : null;
|
|
---
|
|
|
|
<section class="mx-auto grid max-w-340 gap-4 px-4 py-14 sm:px-6 md:grid-cols-2 md:items-center md:gap-8 lg:px-8 2xl:max-w-full">
|
|
<div>
|
|
<h1 class="smooth-reveal card-text-header block lg:text-7xl">
|
|
<Fragment set:html={title} />
|
|
</h1>
|
|
{subTitle && (
|
|
<p class="smooth-reveal card-text-header-description lg:w-4/5 mt-6">
|
|
{subTitle}
|
|
</p>
|
|
)}
|
|
<div class="smooth-reveal grid sm:inline-flex mt-7 w-full gap-3">
|
|
{primaryBtn && <GoLinkPrimaryButton title={primaryBtn} url={primaryBtnURL} />}
|
|
{secondaryBtn && <GoLinkSecondaryButton title={secondaryBtn} url={secondaryBtnURL} />}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="smooth-reveal-fade md:block w-full hidden">
|
|
<div class="flex justify-center w-full top-12 md:ml-4 overflow-hidden">
|
|
{src && alt && (
|
|
<Image
|
|
src={src}
|
|
alt={alt}
|
|
class={`h-full w-105 scale-100 object-cover object-center ${roundedClasses}`}
|
|
draggable="false"
|
|
loading="eager"
|
|
format="webp"
|
|
quality="low"
|
|
widths={[840]}
|
|
disableBlur={true}
|
|
/>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</section>
|