From e200a0ec60897897cee9d52c8c057f1213d4ee58 Mon Sep 17 00:00:00 2001
From: Kaushik <kccreations1704@gmail.com>
Date: Tue, 29 Aug 2023 18:01:12 +0530
Subject: [PATCH] Fix: notification center width on mobile

---
 .../notification-center/NotificationCenter/index.tsx        | 1 -
 .../NotificationCenter/styles.module.css                    | 6 ++++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/notification-center/NotificationCenter/index.tsx b/src/components/notification-center/NotificationCenter/index.tsx
index c805922239..7664287965 100644
--- a/src/components/notification-center/NotificationCenter/index.tsx
+++ b/src/components/notification-center/NotificationCenter/index.tsx
@@ -8,7 +8,6 @@ import IconButton from '@mui/material/IconButton'
 import BellIcon from '@/public/images/notifications/bell.svg'
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
 import ExpandLessIcon from '@mui/icons-material/ExpandLess'
-
 import { useAppDispatch, useAppSelector } from '@/store'
 import {
   selectNotifications,
diff --git a/src/components/notification-center/NotificationCenter/styles.module.css b/src/components/notification-center/NotificationCenter/styles.module.css
index 2685f48760..4994b0d952 100644
--- a/src/components/notification-center/NotificationCenter/styles.module.css
+++ b/src/components/notification-center/NotificationCenter/styles.module.css
@@ -13,6 +13,12 @@
   border: 1px solid var(--color-border-light);
 }
 
+@media (max-width: 599.95px) {
+  .popoverContainer {
+    width: calc(100vw - 30px);
+  }
+}
+
 .popoverHeader {
   display: flex;
   align-items: center;