88 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
			
		
		
	
	
			88 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
---
 | 
						|
import PrimaryCTA from '@components/ui/buttons/PrimaryCTA.astro';
 | 
						|
import Image from '@components/ui/images/Image.astro';
 | 
						|
 | 
						|
interface Props {
 | 
						|
  title: string;
 | 
						|
  subTitle: string;
 | 
						|
  btnExists?: boolean;
 | 
						|
  btnTitle?: string;
 | 
						|
  btnURL?: string;
 | 
						|
  single?: boolean;
 | 
						|
  imgOne?: any;
 | 
						|
  imgOneAlt?: any;
 | 
						|
  imgTwo?: any;
 | 
						|
  imgTwoAlt?: any;
 | 
						|
}
 | 
						|
 | 
						|
const {
 | 
						|
  title,
 | 
						|
  subTitle,
 | 
						|
  btnExists,
 | 
						|
  btnTitle,
 | 
						|
  btnURL,
 | 
						|
  single,
 | 
						|
  imgOne,
 | 
						|
  imgOneAlt,
 | 
						|
  imgTwo,
 | 
						|
  imgTwoAlt,
 | 
						|
} = Astro.props;
 | 
						|
---
 | 
						|
 | 
						|
<section
 | 
						|
  class="mx-auto max-w-[85rem] items-center gap-16 px-4 py-10 sm:px-6 lg:grid lg:grid-cols-2 lg:px-8 lg:py-14 2xl:max-w-full"
 | 
						|
>
 | 
						|
  <div>
 | 
						|
    <h2
 | 
						|
      class="mb-4 text-4xl font-extrabold tracking-tight text-balance text-neutral-800 dark:text-neutral-200"
 | 
						|
    >
 | 
						|
      {title}
 | 
						|
    </h2>
 | 
						|
    <p
 | 
						|
      class="mb-4 max-w-prose font-light text-pretty text-neutral-600 sm:text-lg dark:text-neutral-400"
 | 
						|
    >
 | 
						|
      {subTitle}
 | 
						|
    </p>
 | 
						|
    {btnExists ? <PrimaryCTA title={btnTitle} url={btnURL} /> : null}
 | 
						|
  </div>
 | 
						|
 | 
						|
  {
 | 
						|
    single ? (
 | 
						|
      <div class="mt-8">
 | 
						|
        <Image
 | 
						|
          class="w-full rounded-lg"
 | 
						|
          src={imgOne}
 | 
						|
          alt={imgOneAlt}
 | 
						|
          format="webp"
 | 
						|
          loading="lazy"
 | 
						|
          width="850"
 | 
						|
          height="420"
 | 
						|
        />
 | 
						|
      </div>
 | 
						|
    ) : (
 | 
						|
      <div class="mt-8 grid grid-cols-2 gap-4">
 | 
						|
        <Image
 | 
						|
          class="w-full rounded-xl"
 | 
						|
          src={imgOne}
 | 
						|
          alt={imgOneAlt}
 | 
						|
          draggable="false"
 | 
						|
          format="webp"
 | 
						|
          loading="lazy"
 | 
						|
          width="400"
 | 
						|
          height="230"
 | 
						|
        />
 | 
						|
        <Image
 | 
						|
          class="mt-4 w-full rounded-xl lg:mt-10"
 | 
						|
          src={imgTwo}
 | 
						|
          alt={imgTwoAlt}
 | 
						|
          draggable="false"
 | 
						|
          format="webp"
 | 
						|
          loading="lazy"
 | 
						|
          width="400"
 | 
						|
          height="230"
 | 
						|
        />
 | 
						|
      </div>
 | 
						|
    )
 | 
						|
  }
 | 
						|
</section>
 |