From 4d63b8a06917306afab2e08233fccbcd2754cf62 Mon Sep 17 00:00:00 2001
From: louay24 <zlouay452003@gmail.com>
Date: Thu, 1 May 2025 16:40:14 +0100
Subject: [PATCH] fix bad animation for dialog

---
 src/components/Dialog/Dialog.tsx | 2 +-
 src/globals.css                  | 7 ++++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/Dialog/Dialog.tsx b/src/components/Dialog/Dialog.tsx
index 56c3089..dd4d2fc 100644
--- a/src/components/Dialog/Dialog.tsx
+++ b/src/components/Dialog/Dialog.tsx
@@ -59,7 +59,7 @@ const DialogContent = React.forwardRef<
           ref={forwardedRef}
           className={cx(
             // base
-            "fixed left-1/2 top-1/2 z-50 w-[95vw] max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-md border p-6 shadow-lg",
+            "fixed top-1/2 left-1/2 z-50 w-[95vw] max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-md border p-6 shadow-lg",
             // border color
             "border-gray-200 dark:border-gray-900",
             // background color
diff --git a/src/globals.css b/src/globals.css
index c918246..7423e3f 100644
--- a/src/globals.css
+++ b/src/globals.css
@@ -1,4 +1,4 @@
-@import 'tailwindcss';
+@import "tailwindcss";
 
 @theme {
   --animate-hide: hide 150ms cubic-bezier(0.16, 1, 0.3, 1);
@@ -92,14 +92,15 @@
       opacity: 1;
     }
   }
+
   @keyframes dialogContentShow {
     from {
       opacity: 0;
-      transform: translate(-50%, -45%) scale(0.95);
+      transform: scale(0.95);
     }
     to {
       opacity: 1;
-      transform: translate(-50%, -50%) scale(1);
+      transform: scale(1);
     }
   }
   @keyframes drawerSlideLeftAndFade {