diff --git a/Client/src/Components/Alert/index.css b/Client/src/Components/Alert/index.css
index c65bfa38c..4a1a11c67 100644
--- a/Client/src/Components/Alert/index.css
+++ b/Client/src/Components/Alert/index.css
@@ -2,6 +2,8 @@
margin: 0;
width: fit-content;
}
-.alert, .alert button{
+.alert,
+.alert button,
+.alert .MuiTypography-root {
font-size: var(--env-var-font-size-medium);
-}
\ No newline at end of file
+}
diff --git a/Client/src/Components/Alert/index.jsx b/Client/src/Components/Alert/index.jsx
index 3fa0d82ab..61c3b6bc3 100644
--- a/Client/src/Components/Alert/index.jsx
+++ b/Client/src/Components/Alert/index.jsx
@@ -1,6 +1,6 @@
import PropTypes from "prop-types";
import { useTheme } from "@emotion/react";
-import { Box, IconButton, Stack } from "@mui/material";
+import { Box, IconButton, Stack, Typography } from "@mui/material";
import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
import ErrorOutlineOutlinedIcon from "@mui/icons-material/ErrorOutlineOutlined";
import WarningAmberOutlinedIcon from "@mui/icons-material/WarningAmberOutlined";
@@ -50,9 +50,17 @@ const Alert = ({ variant, title, body, isToast, hasIcon = true, onClick }) => {
}}
>
{hasIcon && {icon}}
-
- {title && {title}}
- {body && {body}}
+
+ {title && (
+
+ {title}
+
+ )}
+ {body && (
+
+ {body}
+
+ )}
{hasIcon && isToast && (