mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

animations

Browse Source
This commit is contained in:
Marc Mintel
2026-01-17 13:17:10 +01:00
parent 021d23ab93
commit 29168a9778
19 changed files with 1353 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
components/home/Experience.tsx
View File

@@ -34,18 +34,15 @@ export default function Experience() {
</p>
</div>
<div className="mt-16 grid grid-cols-2 md:grid-cols-4 gap-8">
{[
{ label: 'Years Experience', value: '25+' },
{ label: 'Projects Completed', value: '1.2k' },
{ label: 'Global Partners', value: '85' },
{ label: 'Cable Types', value: '450+' },
].map((stat, i) => (
<div key={i} className="animate-fade-in" style={{ animationDelay: `${i * 100}ms` }}>
<div className="text-4xl font-extrabold text-accent mb-2">{stat.value}</div>
<div className="text-sm font-bold uppercase tracking-widest text-white/60">{stat.label}</div>
</div>
))}
<div className="mt-16 grid grid-cols-1 md:grid-cols-2 gap-12">
<div className="animate-fade-in">
<div className="text-4xl font-extrabold text-accent mb-4">Certified Quality</div>
<div className="text-lg font-bold uppercase tracking-widest text-white/60">VDE Approved & Trusted by Major Energy Suppliers</div>
</div>
<div className="animate-fade-in" style={{ animationDelay: '100ms' }}>
<div className="text-4xl font-extrabold text-accent mb-4">Full Spectrum</div>
<div className="text-lg font-bold uppercase tracking-widest text-white/60">From 1kV to 220kV Solutions</div>
</div>
</div>
</div>
</Container>