08122023

src/layout/MainLayout/Header/HeaderContent/Notification.js

@@ -53,7 +53,7 @@ const Notification = () => {
   const matchesXs = useMediaQuery(theme.breakpoints.down('md'));
 
   const anchorRef = useRef(null);
-  const [read, setRead] = useState(2);
+  const [read, setRead] = useState(0);
   const [open, setOpen] = useState(false);
   const handleToggle = () => {
     setOpen((prevOpen) => !prevOpen);
@@ -72,16 +72,34 @@ const Notification = () => {
   return (
     <Box sx={{ flexShrink: 0, ml: 0.75 }}>
       <IconButton
-        color="secondary"
-        variant="light"
-        sx={{ color: 'text.primary', bgcolor: open ? iconBackColorOpen : iconBackColor }}
+        // color="secondary"
+        // variant="light"
+        // sx={{ color: 'text.primary', bgcolor: open ? iconBackColorOpen : iconBackColor }}
+        sx={{ color: '#fff',
+        fontSize:'20px',
+        //  bgcolor: open ? iconBackColorOpen : iconBackColor 
+        ':hover':{
+        bgcolor:'transparent',
+        color: '#fff',
+        },
+        // bgcolor:'transparent'
+        }}
+       
         aria-label="open profile"
         ref={anchorRef}
         aria-controls={open ? 'profile-grow' : undefined}
         aria-haspopup="true"
-        onClick={handleToggle}
+        // onClick={handleToggle}
       >
-        <Badge badgeContent={read} color="primary">
+        <Badge badgeContent={read} 
+        // color="primary"
+        sx={{
+          "& .MuiBadge-badge": {
+            color: "#662582",
+            backgroundColor: "white"
+          }
+        }}
+        >
           <BellOutlined />
         </Badge>
       </IconButton>