Enhance Dialog component to accept contentClassName prop for customizable styling. Update ToolLibraryPage to utilize new prop for improved modal layout. Refactor text in ToolLibrary for clarity.
This commit is contained in:
@@ -209,15 +209,16 @@ interface DialogProps {
|
||||
title: string;
|
||||
children: React.ReactNode;
|
||||
footer?: React.ReactNode;
|
||||
contentClassName?: string;
|
||||
}
|
||||
|
||||
export const Dialog: React.FC<DialogProps> = ({ isOpen, onClose, title, children, footer }) => {
|
||||
export const Dialog: React.FC<DialogProps> = ({ isOpen, onClose, title, children, footer, contentClassName }) => {
|
||||
if (!isOpen) return null;
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-4">
|
||||
<div className="fixed inset-0 bg-black/80 backdrop-blur-sm transition-opacity animate-in fade-in" onClick={onClose} />
|
||||
<div className="relative z-50 w-full max-w-lg rounded-xl border border-white/10 bg-card p-6 shadow-2xl animate-in zoom-in-95 duration-200">
|
||||
<div className={`relative z-50 w-full max-w-lg rounded-xl border border-white/10 bg-card p-6 shadow-2xl animate-in zoom-in-95 duration-200 ${contentClassName || ''}`}>
|
||||
<div className="flex flex-col space-y-1.5 text-center sm:text-left mb-4">
|
||||
<h2 className="text-lg font-semibold leading-none tracking-tight">{title}</h2>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user