feat : add modal details

src/components/alert/Alert.tsx

@@ -57,7 +57,7 @@ const Alert = ({ children, type = "info", message }: AlertProps) => {
 
   return (
     <div
-      className={`flex items-center p-4 mb-4 text-sm ${text} rounded-lg ${bg} ${darkText} ${darkBg}`}
+      className={`w-full h-full flex items-center p-4 mb-4 text-xs md:text-sm ${text} rounded-lg ${bg} ${darkText} ${darkBg}`}
       role="alert"
     >
       <svg
@@ -71,7 +71,7 @@ const Alert = ({ children, type = "info", message }: AlertProps) => {
       </svg>
       <span className="sr-only">{children}</span>
       <div>
-        <span className="font-medium">{children}</span> {message}
+        <span className="font-medium">{children}</span> {message && message}
       </div>
     </div>
   );