Atridad Lahiji
174afb6a10
Some checks failed
Docker Deploy / build-and-push (push) Failing after 1m49s
93 lines
3.4 KiB
Plaintext
93 lines
3.4 KiB
Plaintext
---
|
|
import { siteConfig } from "../../config/site";
|
|
import Icon from "../Icon.astro";
|
|
import Section from "../Section.astro";
|
|
import RotatingText from "../RotatingText.vue";
|
|
import StatusIndicator from "../StatusIndicator.vue";
|
|
|
|
const rotatingText = (siteConfig.hero as any).rotatingText as
|
|
| { text: string; className: string }[]
|
|
| undefined;
|
|
---
|
|
|
|
<Section
|
|
fullWidth={true}
|
|
background="bg-neutral"
|
|
class="relative overflow-hidden"
|
|
>
|
|
<div
|
|
class="absolute inset-0 bg-[linear-gradient(to_right,#ffffff20_1px,transparent_1px),linear-gradient(to_bottom,#ffffff20_1px,transparent_1px)] bg-size-[2rem_2rem] mask-[radial-gradient(ellipse_at_center,black_20%,transparent_70%)]"
|
|
>
|
|
</div>
|
|
|
|
<div class="relative max-w-7xl mx-auto px-6">
|
|
<div class="text-center max-w-4xl mx-auto">
|
|
<StatusIndicator client:idle />
|
|
|
|
<h1
|
|
class="text-4xl sm:text-5xl lg:text-6xl xl:text-7xl font-extrabold text-white leading-tight tracking-tight mb-6"
|
|
>
|
|
{
|
|
rotatingText ? (
|
|
<>
|
|
<RotatingText items={rotatingText} client:idle />
|
|
<span class="block">
|
|
{siteConfig.hero.mainTitle
|
|
.replace("{rotating}", "")
|
|
.trim()}
|
|
</span>
|
|
</>
|
|
) : (
|
|
siteConfig.hero.mainTitle
|
|
)
|
|
}
|
|
</h1>
|
|
|
|
<p
|
|
class="text-lg sm:text-xl text-white max-w-2xl mx-auto mb-10 leading-relaxed"
|
|
>
|
|
{siteConfig.description}.
|
|
</p>
|
|
|
|
<div
|
|
class="flex flex-col sm:flex-row gap-4 justify-center items-center"
|
|
>
|
|
<a
|
|
href="#contact"
|
|
class="btn btn-accent btn-lg shadow-lg shadow-accent/25 hover:shadow-xl hover:shadow-accent/30"
|
|
>
|
|
<Icon name="bolt" class="w-5 h-5" />
|
|
{siteConfig.hero.cta}
|
|
</a>
|
|
<a
|
|
href="#services"
|
|
class="btn btn-outline btn-lg border-white text-white hover:bg-white hover:text-neutral hover:border-white transition-all duration-300"
|
|
>
|
|
<Icon name="chevron-down" class="w-5 h-5" />
|
|
{siteConfig.hero.secondaryCta}
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mt-16 pt-10">
|
|
<p
|
|
class="text-white text-sm mb-6 uppercase tracking-wider font-medium"
|
|
>
|
|
{siteConfig.hero.trustedText}
|
|
</p>
|
|
<div
|
|
class="flex flex-wrap justify-center items-center gap-8 lg:gap-12"
|
|
>
|
|
{
|
|
siteConfig.hero.features.map((feature) => (
|
|
<div class="flex items-center gap-2.5 text-white/80">
|
|
<Icon name={feature.icon} class="w-5 h-5" />
|
|
<span class="font-medium">{feature.text}</span>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Section>
|