62 lines
1.9 KiB
Text
62 lines
1.9 KiB
Text
|
---
|
||
|
|
import ContactForm from './ContactForm.astro';
|
||
|
|
import ContactHeader from './ContactHeader.astro';
|
||
|
|
import ContactInfo from './ContactInfo.astro';
|
||
|
|
import ContactMap from './ContactMap.astro';
|
||
|
|
|
||
|
|
|
||
|
|
interface SiteSettings {
|
||
|
|
address: string;
|
||
|
|
contact_email?: string;
|
||
|
|
contact_phone?: string;
|
||
|
|
[key: string]: any;
|
||
|
|
}
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
siteSettings: SiteSettings;
|
||
|
|
page: any;
|
||
|
|
}
|
||
|
|
|
||
|
|
const { siteSettings, page } = Astro.props;
|
||
|
|
|
||
|
|
const locals = Astro.locals as any;
|
||
|
|
const isAuthenticated = locals.user ? true : false;
|
||
|
|
---
|
||
|
|
|
||
|
|
<section class="relative bg-gray-50 py-12 sm:py-16 overflow-hidden">
|
||
|
|
<!-- Декоративные фоновые элементы -->
|
||
|
|
<div class="absolute top-0 left-0 -translate-x-1/2 -translate-y-1/2">
|
||
|
|
<div class="w-[40rem] h-[40rem] bg-amber-400/10 rounded-full blur-3xl" />
|
||
|
|
</div>
|
||
|
|
<div class="absolute bottom-0 right-0 translate-x-1/2 translate-y-1/2">
|
||
|
|
<div class="w-[40rem] h-[40rem] bg-amber-400/15 rounded-full blur-3xl" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="max-w-7xl mx-auto px-6 lg:px-8 relative z-10">
|
||
|
|
<ContactHeader page={page} />
|
||
|
|
|
||
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-x-16 gap-y-12 mt-16 opacity-0 animate-fadeInUp delay-200">
|
||
|
|
<div class="flex flex-col justify-center">
|
||
|
|
<ContactInfo siteSettings={siteSettings} />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<ContactForm isAuthenticated={isAuthenticated} />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="mt-20 lg:mt-24 opacity-0 animate-fadeInUp delay-400">
|
||
|
|
<ContactMap siteSettings={siteSettings} />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
@keyframes fadeInUp {
|
||
|
|
from { opacity: 0; transform: translateY(20px); }
|
||
|
|
to { opacity: 1; transform: translateY(0); }
|
||
|
|
}
|
||
|
|
.animate-fadeInUp { animation: fadeInUp 0.7s ease-out forwards; }
|
||
|
|
.delay-200 { animation-delay: 0.2s; }
|
||
|
|
.delay-400 { animation-delay: 0.4s; }
|
||
|
|
</style>
|