From 68407d7dad55ea41e69e8ee8ea1e6bc83cb8cbf0 Mon Sep 17 00:00:00 2001
From: Pas <74743263+Pasithea0@users.noreply.github.com>
Date: Sun, 3 Aug 2025 13:33:50 -0600
Subject: [PATCH] fix scrolling

---
 .../notificationsModal/components/ListView.tsx    |  2 +-
 .../components/NotificationModal.tsx              | 15 ++++++++++++++-
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/components/overlays/notificationsModal/components/ListView.tsx b/src/components/overlays/notificationsModal/components/ListView.tsx
index bd417b74..e2cdc4f7 100644
--- a/src/components/overlays/notificationsModal/components/ListView.tsx
+++ b/src/components/overlays/notificationsModal/components/ListView.tsx
@@ -111,7 +111,7 @@ export function ListView({
               return (
                 <div
                   key={notification.guid}
-                  className={`p-4 rounded-lg border transition-all cursor-pointer hover:bg-background-main/50 mr-2 ${
+                  className={`p-4 rounded-lg border transition-all cursor-pointer hover:bg-background-main/50 md:mr-2 ${
                     isRead
                       ? "bg-background-main border-utils-divider opacity-75"
                       : "bg-background-main border-type-link/70 shadow-sm"
diff --git a/src/components/overlays/notificationsModal/components/NotificationModal.tsx b/src/components/overlays/notificationsModal/components/NotificationModal.tsx
index 31ab5b4f..635635f4 100644
--- a/src/components/overlays/notificationsModal/components/NotificationModal.tsx
+++ b/src/components/overlays/notificationsModal/components/NotificationModal.tsx
@@ -310,7 +310,20 @@ export function NotificationModal({ id }: NotificationModalProps) {
           lastReadIndex
         ] as HTMLElement;
         if (element) {
-          element.scrollIntoView({ behavior: "smooth", block: "center" });
+          // Use scrollTop instead of scrollIntoView to avoid scrolling the modal container
+          const container = containerRef.current;
+          const elementTop = element.offsetTop;
+          const containerHeight = container.clientHeight;
+          const elementHeight = element.clientHeight;
+
+          // Calculate the scroll position to center the element
+          const scrollTop =
+            elementTop - containerHeight / 2 + elementHeight / 2;
+
+          container.scrollTo({
+            top: Math.max(0, scrollTop),
+            behavior: "smooth",
+          });
         }
       }
     }