Slow fade first image

Adjusted HeritageSection to animate the first (bakery) image with a longer, slower fade-in using a 6000ms duration and applied enter/exit transitions on visibility. X-Lovable-Edit-ID: edt-860a71a6-93fe-49b5-9471-997b796df3da
2026-01-27 20:47:43 +00:00
parent e05ded2371 4975497a43
commit b8c18e0ad4
1 changed files with 7 additions and 1 deletions
@@ -68,7 +68,13 @@ const HeritageSection = () => {
          }`}
        >
          {/* Image */}
-          <div className="relative rounded-sm overflow-hidden mb-12 shadow-xl">
+          <div 
+            className={`relative rounded-sm overflow-hidden mb-12 shadow-xl transition-all duration-[6000ms] ease-out ${
+              heroVisible
+                ? "opacity-100 translate-y-0 scale-100"
+                : "opacity-0 translate-y-20 scale-95"
+            }`}
+          >
            <img
              src={bakeryHeritageImage}
              alt="Traditionellt svenskt konditori"