From 62763dd2914c05578baf9ca215ba349e4f4f71fb Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Mon, 16 Mar 2026 14:24:21 -0600
Subject: [PATCH] overlay overflow hidden so it stops affecting the scroll bar

---
 src/common/PulseBox.tsx | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/common/PulseBox.tsx b/src/common/PulseBox.tsx
index 90c611c..f4ae696 100644
--- a/src/common/PulseBox.tsx
+++ b/src/common/PulseBox.tsx
@@ -8,7 +8,6 @@ const useStyles = makeStyles((_theme: Theme) => ({
     position: 'relative',
     display: 'block', // Changed to block to respect Box margins
     width: 'fit-content', // Shrinks to child width
-    overflow: 'hidden', // Clip pulse animation so it doesn't affect parent layout
     '&::after': {
       content: '""',
       position: 'absolute',
@@ -16,8 +15,7 @@ const useStyles = makeStyles((_theme: Theme) => ({
       left: 0,
       width: '100%',
       height: '100%',
-      border: '2px solid var(--pulse-color)',
-      borderRadius: 'inherit', // Should inherit from Box
+      borderRadius: 'inherit',
       animation: '$pulse 1.75s infinite ease-in-out',
       pointerEvents: 'none',
       boxSizing: 'border-box',
@@ -26,13 +24,13 @@ const useStyles = makeStyles((_theme: Theme) => ({
   },
   '@keyframes pulse': {
     from: {
-      transform: "scale(1)",
-      opacity: 1
+      boxShadow: '0 0 0 2px var(--pulse-color)',
+      opacity: 1,
     },
     to: {
-      transform: "scale(1.25)",
-      opacity: 0
-    }
+      boxShadow: '0 0 0 14px var(--pulse-color)',
+      opacity: 0,
+    },
   },
 }));