fix: progress bar transtion on firefox (#446)

ArdentHQ · Jul 19, 2024 · 79052b4 · 79052b4
1 parent bdeb896
commit 79052b4
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/shared/components/progress/ProgressBar.tsx b/src/shared/components/progress/ProgressBar.tsx
@@ -26,8 +26,8 @@ export const ProgressBar = ({
                     className={cn(
                         'h-full rounded-3xl bg-theme-primary-700 dark:bg-theme-primary-650',
                         {
-                            'w-full': isFilled,
-                            'w-0': !isFilled,
+                            'w-full': (isFilled && shouldAnimate) || index < activeIndex,
+                            'w-0': !isFilled || (isFilled && !shouldAnimate),
                             'animate-fillProgress': shouldAnimate,
                         },
                     )}

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -83,7 +83,7 @@ export default {
                     'fadeInAndTransform 0.8s ease-in-out forwards, scale 0.4s ease-in-out 1s forwards',
                 translateUp: 'translateUp 0.5s ease-in-out 2s forwards',
                 decreaseHeight: 'decreaseHeight 0.5s ease-in-out 2s forwards',
-                fillProgress: 'fillProgressBar 5s ease-in-out',
+                fillProgress: 'fillProgressBar 5s ease-in-out forwards',
             },
             zIndex: {
                 1: '1',