88 lines
2.6 KiB
Plaintext
88 lines
2.6 KiB
Plaintext
---
|
|
import { Icon } from "astro-icon/components";
|
|
import { Image } from "astro:assets";
|
|
import jbp from "../../assets/DRJBP-1.webp";
|
|
import FormContact from "./FormContact.vue";
|
|
|
|
import { createTranslator, t } from "../../i18n";
|
|
const tl = createTranslator(Astro.currentLocale);
|
|
|
|
const isHebrew = Astro.currentLocale === "he";
|
|
const { hideContact } = Astro.props;
|
|
---
|
|
|
|
<div id="contact" class="bg-[#22523F]">
|
|
<div class="container mx-auto py-20 relative text-[#EBE5D0]">
|
|
<div class="absolute bottom-0 right-0 w-80 hidden lg:block">
|
|
<Image src={jbp} alt="Centro del Reino de Paz y Justicia" />
|
|
</div>
|
|
|
|
<h4
|
|
class="text-lg text-center font-bold uppercase"
|
|
set:html={tl("footer.title")}
|
|
>
|
|
</h4>
|
|
<h2
|
|
class="text-2xl lg:text-5xl text-center font-bold font-secondary my-8"
|
|
set:html={tl("footer.subtitle")}
|
|
>
|
|
</h2>
|
|
|
|
<div class="px-12 lg:px-4 lg:w-2/5 mx-auto">
|
|
<p class="text-lg font-light mb-10" set:html={tl("footer.text")}></p>
|
|
<p class="text-lg font-regular">
|
|
{tl("footer.email")}
|
|
<!--email_off-->
|
|
<a
|
|
class="font-light hover:text-[#D4C7A1] transition-all hover:underline hover:underline-offset-4 hidden lg:block"
|
|
href="mailto:joseperez@centrodelreinodepazyjusticia.com"
|
|
>joseperez@centrodelreinodepazyjusticia.com</a
|
|
>
|
|
<!--/email_off-->
|
|
</p>
|
|
<!--email_off-->
|
|
<a
|
|
class="font-light hover:text-[#D4C7A1] transition-all hover:underline hover:underline-offset-4 block lg:hidden overflow-hidden overflow-ellipsis"
|
|
href="mailto:joseperez@centrodelreinodepazyjusticia.com"
|
|
>joseperez@centrodelreinodepazyjusticia.com</a
|
|
>
|
|
<!--/email_off-->
|
|
<p
|
|
class="text-lg font-light mb-10 break-words"
|
|
set:html={tl("footer.text2")}
|
|
>
|
|
</p>
|
|
|
|
{!hideContact && <FormContact client:load locale={Astro.currentLocale} />}
|
|
</div>
|
|
|
|
<div
|
|
class="flex lg:justify-between mt-10 lg:mt-0 align-center justify-center"
|
|
>
|
|
{
|
|
!isHebrew && (
|
|
<p class="px-4 order-1 text-sm font-normal text-white lg:self-end text-center lg:text-left">
|
|
{tl("footer.reserved")}
|
|
</p>
|
|
)
|
|
}
|
|
|
|
<div class="flex items-center gap-3 lg:order-1 z-10 pl-6">
|
|
<img
|
|
class="w-24 object-contain"
|
|
src="/img/logo-metalico.webp"
|
|
alt="Logo Metalico"
|
|
/>
|
|
|
|
{
|
|
isHebrew && (
|
|
<p class="text-sm font-normal text-white text-center lg:text-left">
|
|
{tl("footer.reserved")}
|
|
</p>
|
|
)
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|