hero center
All checks were successful
Build & Deploy KLZ Cables / build-and-deploy (push) Successful in 3m39s
All checks were successful
Build & Deploy KLZ Cables / build-and-deploy (push) Successful in 3m39s
This commit is contained in:
@@ -12,9 +12,9 @@ export default function Hero() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Section className="relative min-h-[85vh] md:h-[90vh] flex flex-col items-center justify-center overflow-hidden bg-primary py-12 md:py-0 lg:py-0">
|
<Section className="relative min-h-[85vh] md:h-[90vh] flex flex-col items-center justify-center overflow-hidden bg-primary py-12 md:py-0 lg:py-0">
|
||||||
<Container className="relative z-10 text-left text-white w-full order-1">
|
<Container className="relative z-10 text-center md:text-left text-white w-full order-2 md:order-none">
|
||||||
<motion.div
|
<motion.div
|
||||||
className="max-w-5xl"
|
className="max-w-5xl mx-auto md:mx-0"
|
||||||
initial="hidden"
|
initial="hidden"
|
||||||
animate="visible"
|
animate="visible"
|
||||||
variants={containerVariants}
|
variants={containerVariants}
|
||||||
@@ -47,7 +47,7 @@ export default function Hero() {
|
|||||||
</p>
|
</p>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
<motion.div
|
<motion.div
|
||||||
className="flex flex-col sm:flex-row gap-4 md:gap-6"
|
className="flex flex-col sm:flex-row justify-center md:justify-start gap-4 md:gap-6"
|
||||||
variants={buttonContainerVariants}
|
variants={buttonContainerVariants}
|
||||||
>
|
>
|
||||||
<motion.div variants={buttonVariants}>
|
<motion.div variants={buttonVariants}>
|
||||||
@@ -66,7 +66,7 @@ export default function Hero() {
|
|||||||
</Container>
|
</Container>
|
||||||
|
|
||||||
<motion.div
|
<motion.div
|
||||||
className="relative md:absolute inset-0 z-0 w-full h-[40vh] md:h-full order-2 mt-8 md:mt-0"
|
className="relative md:absolute inset-0 z-0 w-full h-[40vh] md:h-full order-1 md:order-none mb-8 md:mb-0"
|
||||||
initial={{ opacity: 0, scale: 0.95, filter: 'blur(20px)' }}
|
initial={{ opacity: 0, scale: 0.95, filter: 'blur(20px)' }}
|
||||||
animate={{ opacity: 1, scale: 1, filter: 'blur(0px)' }}
|
animate={{ opacity: 1, scale: 1, filter: 'blur(0px)' }}
|
||||||
transition={{ duration: 2.2, ease: 'easeOut', delay: 0.05 }}
|
transition={{ duration: 2.2, ease: 'easeOut', delay: 0.05 }}
|
||||||
|
|||||||
@@ -166,7 +166,7 @@ export default function HeroIllustration() {
|
|||||||
<div className="absolute md:inset-0 z-0 overflow-hidden bg-primary w-full h-full">
|
<div className="absolute md:inset-0 z-0 overflow-hidden bg-primary w-full h-full">
|
||||||
<svg
|
<svg
|
||||||
viewBox="-400 -200 1800 1100"
|
viewBox="-400 -200 1800 1100"
|
||||||
className="w-full h-full opacity-60 md:opacity-100 scale-[1.5] md:scale-100 translate-x-0"
|
className="w-full h-full opacity-60 md:opacity-100 scale-[1.2] md:scale-100 translate-x-0"
|
||||||
preserveAspectRatio="xMidYMid slice"
|
preserveAspectRatio="xMidYMid slice"
|
||||||
fill="none"
|
fill="none"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
|||||||
Reference in New Issue
Block a user