fix dialog

src/dialog.tsx

@@ -1,12 +1,9 @@
 "use client";
 
-import { XIcon } from "lucide-react";
-import { motion } from "motion/react";
 import { Dialog as DialogPrimitive } from "radix-ui";
 import type * as React from "react";
 import { Button } from "@/button";
 import { cn } from "@/lib/utils";
-import { cardVariants } from "./card";
 
 function Dialog({
 	...props
@@ -41,7 +38,7 @@ function DialogOverlay({
 			data-slot="dialog-overlay"
 			className={cn(
 				"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-				"fixed inset-0 z-100 bg-black/50 backdrop-blur-lg",
+				"fixed inset-0 z-50 bg-black/50 backdrop-blur-lg",
 				className,
 			)}
 			{...props}
@@ -60,7 +57,10 @@ function DialogContent({
 	return (
 		<DialogPrimitive.Content
 			data-slot="dialog-content"
-			className={cn(className)}
+			className={cn(
+				"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+				className,
+			)}
 			{...props}
 		>
 			{children}
@@ -68,8 +68,6 @@ function DialogContent({
 	);
 }
 
-const AnimatedDialogContent = motion.create(DialogContent);
-
 function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
 	return (
 		<div
@@ -137,7 +135,6 @@ export {
 	Dialog,
 	DialogClose,
 	DialogContent,
-	AnimatedDialogContent,
 	DialogDescription,
 	DialogFooter,
 	DialogHeader,