- programmer-graphic.tsx: programmierer-vector.svg statt PNG (336 KB statt 1,6 MB) - hero.tsx: hidden lg:block entfernt, Grafik jetzt auch auf Mobile sichtbar - Mobile-Größe: max-w-xs/sm, Desktop: max-w-md Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
24 lines
673 B
TypeScript
24 lines
673 B
TypeScript
'use client'
|
||
|
||
import { motion } from 'framer-motion'
|
||
import Image from 'next/image'
|
||
import programmiererSvg from '../public/programmierer-vector.svg'
|
||
|
||
export function ProgrammerGraphic() {
|
||
return (
|
||
<motion.div
|
||
initial={{ opacity: 0, scale: 0.95 }}
|
||
animate={{ opacity: 1, scale: 1 }}
|
||
transition={{ duration: 0.8 }}
|
||
className="relative w-full max-w-xs mx-auto aspect-[3/5] sm:max-w-sm lg:max-w-md lg:aspect-square"
|
||
>
|
||
<Image
|
||
src={programmiererSvg}
|
||
alt="Programmierung: Von 1976 bis heute – 50 Jahre Code"
|
||
fill
|
||
className="object-contain drop-shadow-lg"
|
||
priority
|
||
/>
|
||
</motion.div>
|
||
)
|
||
}
|