fix

apps/frontend/components/ui/dialog.tsx

@@ -7,11 +7,41 @@ import { cn } from '@/lib/utils';
 export const Dialog = DialogPrimitive.Root;
 export const DialogTrigger = DialogPrimitive.Trigger;
 
-export function DialogContent({ className, children, ...props }: React.ComponentProps<typeof DialogPrimitive.Content>) {
+export function DialogContent({
+  className,
+  placement = 'center',
+  children,
+  style,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Content> & {
+  placement?: 'center' | 'upper';
+}) {
+  const placementStyle: React.CSSProperties =
+    placement === 'upper'
+      ? {
+          top: 'max(1.5rem, 10vh)',
+          left: '50%',
+          transform: 'translateX(-50%)',
+          margin: 0
+        }
+      : {
+          top: '50%',
+          left: '50%',
+          transform: 'translate(-50%, -50%)',
+          margin: 0
+        };
+
+  const overlayZ = placement === 'upper' ? 'z-[300]' : 'z-[200]';
+  const contentZ = placement === 'upper' ? 'z-[301]' : 'z-[201]';
+
   return (
     <DialogPrimitive.Portal>
-      <DialogPrimitive.Overlay className="fixed inset-0 z-[200] bg-black/50 backdrop-blur-[1px]" />
-      <DialogPrimitive.Content className={cn('fixed left-1/2 top-1/2 z-[201] w-[min(92vw,520px)] -translate-x-1/2 -translate-y-1/2 rounded-[28px] bg-white p-6 shadow-2xl', className)} {...props}>
+      <DialogPrimitive.Overlay className={cn('fixed inset-0 bg-black/50 backdrop-blur-[1px]', overlayZ)} />
+      <DialogPrimitive.Content
+        className={cn('fixed w-[min(92vw,520px)] rounded-[28px] bg-white p-6 shadow-2xl', contentZ, className)}
+        style={{ ...placementStyle, ...style }}
+        {...props}
+      >
         {children}
         <DialogPrimitive.Close className="absolute right-5 top-5 rounded-full p-1 hover:bg-[#f4f5f8]" aria-label="Закрыть">
           <X className="h-4 w-4" />