feat: content-aware HDDBore and TrenchLaying animations with drillbit transition

Former-commit-id: 1a541fc31c5b24aa083c3441a9ab642c7d49da59
This commit is contained in:
2026-05-11 21:49:57 +02:00
parent e33dcdddac
commit 2e1e34a617
12 changed files with 236 additions and 214 deletions

View File

@@ -3,8 +3,8 @@ import Image from 'next/image';
import Reveal from '@/components/Reveal';
import { Badge, Container, Heading } from '@/components/ui';
import { Button } from '@/components/ui/Button';
import { AbstractBore } from '@/components/ui/decorations/AbstractBore';
import { AbstractTrench } from '@/components/ui/decorations/AbstractTrench';
import { HDDBoreAnimation } from '@/components/ui/decorations/HDDBoreAnimation';
import { TrenchLayingAnimation } from '@/components/ui/decorations/TrenchLayingAnimation';
export interface HeroSectionProps {
title: string;
@@ -72,10 +72,10 @@ export const HeroSection: React.FC<HeroSectionProps> = (props) => {
)}
</div>
</Container>
{/* Minimalist Abstract Drilling (HDD) */}
<AbstractBore className="top-1/3 -translate-y-1/2 opacity-60" />
{/* Minimalist Abstract Trenching */}
<AbstractTrench className="bottom-0 opacity-60" />
{/* Content-Aware Animation: HDD Drilling & Pipe Pullback */}
<HDDBoreAnimation className="top-1/3 -translate-y-1/2 opacity-60" />
{/* Content-Aware Animation: Trench Cutting & Pipe Laying */}
<TrenchLayingAnimation className="bottom-0 opacity-60" />
</section>
</Reveal>
);