Almost done

2026-03-05 17:35:27 +01:00
parent 278471e53b
commit e44fceaf32
30 changed files with 1077 additions and 572 deletions
@@ -0,0 +1,38 @@
+// app/components/Modals/Modal.tsx
+
+import { ModalProps } from "@/app/types";
+import React from "react";
+
+
+interface BaseModalProps extends ModalProps {
+    onClose: () => void;
+    children: React.ReactNode;
+}
+
+export default function Modal({ onClose, children }: BaseModalProps) {
+    return (
+        <div
+            className="fixed inset-0 z-50 bg-black/60 flex justify-center items-center overflow-auto"
+            onClick={onClose}
+        >
+            <div
+                className="bg-white p-5 w-[80vw] max-w-max min-w-75 rounded-[15px] relative flex flex-col items-center text-center font-semibold text-[#406185]"
+                onClick={(e) => e.stopPropagation()}
+            >
+                <button
+                    className="absolute right-3 top-3 p-2 rounded-full transition-all duration-300 ease-in-out hover:bg-gray-100 hover:rotate-90 active:scale-90 group cursor-pointer"
+                    onClick={onClose}
+                    aria-label="Stäng"
+                >
+                    <svg
+                        viewBox="0 0 413.348 413.348"
+                        className="w-4 h-4 fill-black transition-colors duration-300 group-hover:fill-[#406185]"
+                    >
+                        <path d="m413.348 24.354-24.354-24.354-182.32 182.32-182.32-182.32-24.354 24.354 182.32 182.32-182.32 182.32 24.354 24.354 182.32-182.32 182.32 182.32 24.354-24.354-182.32-182.32z" />
+                    </svg>
+                </button>
+                {children}
+            </div>
+        </div>
+    );
+}