92 lines
2.2 KiB
Plaintext
92 lines
2.2 KiB
Plaintext
---
|
|
import ContactForm from '../ContactForm.astro';
|
|
import FormAPreview from '../FormAPreview.astro';
|
|
import JotformIframe from '../JotformIframe.astro';
|
|
import OpenStreetMap from '../OpenStreetMap.astro';
|
|
import { formAPreviewEnabled, formModeForRuntime, resolveFormAIframe, resolveFormMode } from '../../utils/form-integration';
|
|
|
|
interface Props {
|
|
title: string;
|
|
lang: string;
|
|
}
|
|
|
|
const { title, lang } = Astro.props;
|
|
const formConfig = resolveFormMode(import.meta.env.PUBLIC_AIA_FORMS_MODE);
|
|
const formPreview = formAPreviewEnabled(import.meta.env.PUBLIC_AIA_FORM_A_PREVIEW, import.meta.env.PUBLIC_ALLOW_INDEXING, formModeForRuntime(formConfig));
|
|
const route = lang === 'es' ? '/es/contact' : '/contact';
|
|
const formAIframe = resolveFormAIframe({
|
|
rawMode: import.meta.env.PUBLIC_AIA_FORMS_MODE,
|
|
route,
|
|
locale: lang,
|
|
});
|
|
---
|
|
|
|
<section class="contact-page">
|
|
<div class="container contact-page__grid">
|
|
<div class="contact-page__copy">
|
|
<slot />
|
|
</div>
|
|
{formAIframe.enabled
|
|
? <JotformIframe config={formAIframe} heading={title} />
|
|
: formPreview
|
|
? <FormAPreview lang={lang as 'en' | 'es'} variant="full" submitText={lang === 'es' ? 'Enviar' : 'Submit'} />
|
|
: <ContactForm title={title} lang={lang} />}
|
|
</div>
|
|
</section>
|
|
|
|
<OpenStreetMap lang={lang} />
|
|
|
|
<style>
|
|
.contact-page {
|
|
background: white;
|
|
padding-block: 100px;
|
|
}
|
|
|
|
.contact-page__grid {
|
|
align-items: start;
|
|
display: grid;
|
|
gap: clamp(2rem, 5vw, 4rem);
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
|
|
.contact-page__copy {
|
|
color: var(--color-primary);
|
|
text-align: left;
|
|
}
|
|
|
|
.contact-page__copy :global(h2) {
|
|
margin: 0 0 25px;
|
|
}
|
|
|
|
.contact-page__copy :global(p) {
|
|
margin: 0 0 25px;
|
|
}
|
|
|
|
.contact-page__copy :global(a:not(.content-button)) {
|
|
color: var(--color-primary);
|
|
text-decoration: underline;
|
|
text-underline-offset: .15em;
|
|
}
|
|
|
|
.contact-page__copy :global(.content-button) {
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
@media (max-width: 992px) {
|
|
.contact-page {
|
|
padding-block: 50px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.contact-page__grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.contact-page__copy :global(.content-button) {
|
|
display: table;
|
|
margin-inline: auto;
|
|
}
|
|
}
|
|
</style>
|