From 4e8afb4eeaa4c2466922ffd2e2ae76b9472bc603 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Carl-Gerhard=20Lindesva=CC=88rd?= <lindesvard@gmail.com>
Date: Wed, 13 Nov 2024 23:55:45 +0100
Subject: [PATCH] fix(public): improve mobile experiance #3

---
 apps/public/components/hero-carousel.tsx | 26 ++++++++----------------
 1 file changed, 8 insertions(+), 18 deletions(-)

diff --git a/apps/public/components/hero-carousel.tsx b/apps/public/components/hero-carousel.tsx
index cc7f0828..5df4aeff 100644
--- a/apps/public/components/hero-carousel.tsx
+++ b/apps/public/components/hero-carousel.tsx
@@ -134,26 +134,16 @@ export function HeroCarousel() {
           <div
             className={cn(
               'relative w-full h-[750px]',
-              activeFrame.id !== 'overview' && 'h-auto aspect-[4/3]',
+              activeFrame.id !== 'overview' && 'h-auto aspect-[5/3]',
             )}
           >
-            <AnimatePresence mode="popLayout" initial={false}>
-              {activeFrames.slice(-2).map((frame) => (
-                <motion.div
-                  key={frame.key}
-                  layout
-                  className="absolute inset-0 w-full h-full"
-                  initial={{ opacity: 0 }}
-                  animate={{ opacity: 1 }}
-                  exit={{ opacity: 0 }}
-                  transition={{ duration: 0.5, ease: 'easeIn' }}
-                >
-                  <div className="bg-background rounded-xl h-full w-full">
-                    <frame.Component />
-                  </div>
-                </motion.div>
-              ))}
-            </AnimatePresence>
+            {activeFrames.slice(-1).map((frame) => (
+              <div key={frame.key} className="absolute inset-0 w-full h-full">
+                <div className="bg-background rounded-xl h-full w-full">
+                  <frame.Component />
+                </div>
+              </div>
+            ))}
           </div>
         </div>
       </div>