Refactored project view into modal

Elevated toast message priority
This commit is contained in:
2026-10-22 09:41:41 +02:00
parent ccc49df720
commit 0261a6093e
6 changed files with 1454 additions and 441 deletions
@@ -10,8 +10,9 @@ export interface ModalProps {
subtitle?: string;
helpText?: ReactNode;
children: ReactNode;
maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';
size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full' | string;
maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full-screen' | 'full';
size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full-screen' | 'full' | string;
zIndex?: string;
}
export const Modal: React.FC<ModalProps> = ({
@@ -23,6 +24,7 @@ export const Modal: React.FC<ModalProps> = ({
children,
maxWidth = 'lg',
size,
zIndex = 'z-[9999]',
}) => {
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
@@ -57,13 +59,15 @@ export const Modal: React.FC<ModalProps> = ({
'4xl': 'max-w-4xl',
'5xl': 'max-w-5xl',
'6xl': 'max-w-6xl',
'7xl': 'max-w-7xl',
'full-screen': 'max-w-[96vw]',
full: 'max-w-full',
};
const maxWidthClass = maxWidthClassMap[effectiveSize] || 'max-w-lg';
const modalContent = (
<div
className="fixed inset-0 z-[9999] flex items-center justify-center p-4 bg-black/80 backdrop-blur-md animate-in fade-in duration-150 overflow-y-auto"
className={`fixed inset-0 ${zIndex} flex items-center justify-center p-4 bg-black/80 backdrop-blur-md animate-in fade-in duration-150 overflow-y-auto`}
onClick={onClose}
role="dialog"
aria-modal="true"