35 lines
1.3 KiB
Plaintext
35 lines
1.3 KiB
Plaintext
≈---
|
|
const { props } = Astro.props;
|
|
import { Icon } from "astro-icon/components";
|
|
import Button from "./ui/Button.astro";
|
|
|
|
const background = props.bgImage || props.bgColor;
|
|
|
|
---
|
|
<div style={{ background: props.bgImage ? `url('${props.bgImage}') center no-repeat; background-size:680px;` : props.bgColor }} class={`aspect-auto xl:aspect-square py-8 px-8 xl:px-16 flex flex-col justify-evenly`}>
|
|
|
|
<div class="flex flex-col gap-6">
|
|
{props.hasIcon && (
|
|
<div class="flex justify-start">
|
|
<Icon name="ph:minus" class={`w-12 h-12 ${props.titleColor}`} />
|
|
</div>
|
|
)}
|
|
<h2 class={`${props.titleColor} font-bold ${props.sizeTitle} `}>{props.title}</h2>
|
|
<p class={`${props.textColor} ${props.sizeText}`}>{props.copy}</p>
|
|
</div>
|
|
|
|
|
|
{props.hasButton && (
|
|
<div class=" flex self-start">
|
|
<Button class="px-6 py-3 uppercase" url="#" variant="primary" title={props.buttonLabel} />
|
|
</div>
|
|
)}
|
|
|
|
{props.hasInput && (
|
|
<div class="flex border gap-2 w-full">
|
|
<input type="email" placeholder="Correo" class="flex-1 p-2 min-w-0 outline-none"/>
|
|
<Button class="px-6 py-3 uppercase" variant="secondary" title={props.buttonLabel} />
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div> |