|
|
@@ -29,16 +29,16 @@
|
|
|
{$t('contactCprHeading')}
|
|
|
</h2>
|
|
|
</div>
|
|
|
- <div class="mx-auto grid max-w-7xl items-start gap-8 px-4 md:grid-cols-2 md:gap-12">
|
|
|
- <div use:reveal={{ transition: 'slide', x: -50, duration: 800 }}>
|
|
|
- <div class="rounded-xl border border-border1_contact/20 bg-border2_contact/5 backdrop-blur-sm p-8 shadow-md transition hover:shadow-lg">
|
|
|
+ <div class="mx-auto grid max-w-7xl items-stretch gap-8 px-4 md:grid-cols-2 md:gap-12">
|
|
|
+ <div class="h-full" use:reveal={{ transition: 'slide', x: -50, duration: 800 }}>
|
|
|
+ <div class="h-full flex flex-col space-y-4 rounded-xl border border-border1_contact/20 bg-border2_contact/5 backdrop-blur-sm p-8 shadow-md transition hover:shadow-lg">
|
|
|
<p class="mb-6 text-2xl font-bold">{$t('contactWatTitle')}</p>
|
|
|
<a
|
|
|
href="https://wa.me/50762036138"
|
|
|
target="_blank"
|
|
|
rel="noopener noreferrer"
|
|
|
aria-label={$t('contacButtontWat')}
|
|
|
- class="hover:scale-104 inline-flex w-full justify-center items-center gap-2 overflow-hidden rounded-md bg-bg_contact_what px-6 py-3 font-bold text-tx_contact_form transition duration-300 ease-out hover:bg-bg_hover_contact_what hover:shadow-[0_5px_10px_var(--tw-shadow-color)] hover:shadow-shadow_button_what focus:outline-none focus-visible:ring-2 focus-visible:ring-bg_contact_what/50"
|
|
|
+ class="hover:scale-104 inline-flex h-12 w-full justify-center items-center gap-2 overflow-hidden rounded-md bg-bg_contact_what px-6 font-bold text-tx_contact_form transition duration-300 ease-out hover:bg-bg_hover_contact_what hover:shadow-[0_5px_10px_var(--tw-shadow-color)] hover:shadow-shadow_button_what focus:outline-none focus-visible:ring-2 focus-visible:ring-bg_contact_what/50"
|
|
|
>
|
|
|
<img class="mt-0.5 h-5 w-8" src={whaticon} alt="Logo Whastapp" />
|
|
|
{$t('contacButtontWat')}
|
|
|
@@ -47,15 +47,15 @@
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
- class="space-y-4"
|
|
|
+ class="h-full"
|
|
|
use:reveal={{ transition: 'slide', y: -50, duration: 1000 }}
|
|
|
>
|
|
|
- <div class="space-y-6 rounded-xl border border-border1_contact/20 bg-border2_contact/5 p-8 backdrop-blur-sm shadow-md transition hover:shadow-lg">
|
|
|
+ <div class="h-full flex flex-col space-y-4 rounded-xl border border-border1_contact/20 bg-border2_contact/5 backdrop-blur-sm p-8 shadow-md transition hover:shadow-lg">
|
|
|
<p class="text-lg leading-relaxed">{$t('contactCprText')}</p>
|
|
|
<a
|
|
|
href="/formcpr"
|
|
|
aria-label={$t('contactCprLinkLabel')}
|
|
|
- class="group hover:scale-104 inline-flex w-full items-center justify-center gap-2 rounded-md border-2 border-border1_contact bg-gradient-to-r from-bg1_button_contact to-bg2_button_contact px-6 py-3 font-bold text-tx_contact_form transition duration-300 ease-out hover:shadow-lg focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-400/60"
|
|
|
+ class="group hover:scale-104 inline-flex h-12 w-full items-center justify-center gap-2 rounded-md border-2 border-border1_contact bg-gradient-to-r from-bg1_button_contact to-bg2_button_contact px-6 font-bold text-tx_contact_form transition duration-300 ease-out hover:shadow-lg focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-400/60"
|
|
|
>
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="h-5 w-5 transition-transform duration-300 group-hover:translate-x-0.5">
|
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 6h18M3 12h18M3 18h9" />
|
gdias