From 44a830dd2c5ac2036878a55ef9cc759776ec8f5e Mon Sep 17 00:00:00 2001
From: Tobias Merkle <tobias@branchmessenger.com>
Date: Tue, 16 Sep 2025 14:04:02 -0400
Subject: [PATCH 1/3] bay-width

---
 .../packages/app-store/ui/src/components/NotificationBay.tsx  | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
index 6295c712c..cc90553da 100644
--- a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
+++ b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
@@ -55,7 +55,8 @@ const NotificationBay: React.FC = () => {
                 </button>
 
                 {isExpanded && (
-                    <div className="absolute top-full right-0 w-md max-w-screen-sm max-h-md min-h-0 overflow-y-auto bg-white dark:bg-black rounded-md shadow-md z-50 p-2 flex flex-col gap-2 items-stretch">
+                    <div className="absolute top-full right-0 w-md max-w-screen z-50 flex flex-col items-stretch">
+                    <div className="max-h-md min-h-0 overflow-y-auto bg-white dark:bg-black rounded-md shadow-md px-4 py-2 flex flex-col gap-2 items-stretch">
                         {notifications.length === 0 ? (
                             <p>All clear, no notifications!</p>
                         ) : (
@@ -69,6 +70,7 @@ const NotificationBay: React.FC = () => {
                             ))
                         )}
                     </div>
+                    </div>
                 )}
             </div>
 

From c4634090dec46300c43ef956a0bcbd3fe457affd Mon Sep 17 00:00:00 2001
From: Tobias Merkle <tobias@branchmessenger.com>
Date: Mon, 29 Sep 2025 11:06:02 -0400
Subject: [PATCH 2/3] maximillian-width

---
 .../ui/src/components/NotificationBay.tsx          | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
index cc90553da..a82db0d9d 100644
--- a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
+++ b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
@@ -41,7 +41,7 @@ const NotificationBay: React.FC = () => {
 
     return (
         <>
-            <div className={classNames("relative rounded-md p-2 z-50")}>
+            <div className={classNames("relative rounded-md max-w-[90vw] p-2")}>
                 <button
                     onClick={() => setIsExpanded(!isExpanded)}
                     className={`clear thin notification-button ${hasErrors ? 'has-errors' : ''}`}
@@ -54,9 +54,12 @@ const NotificationBay: React.FC = () => {
                     )}
                 </button>
 
-                {isExpanded && (
-                    <div className="absolute top-full right-0 w-md max-w-screen z-50 flex flex-col items-stretch">
-                    <div className="max-h-md min-h-0 overflow-y-auto bg-white dark:bg-black rounded-md shadow-md px-4 py-2 flex flex-col gap-2 items-stretch">
+                {isExpanded && <div
+                    className="absolute top-full right-0 max-w-[80vw] z-10 flex flex-col items-stretch"
+                >
+                    <div
+                        className="max-h-md min-h-0 overflow-y-auto bg-white dark:bg-black rounded-md shadow-md px-4 py-2 flex flex-col gap-2 items-stretch"
+                    >
                         {notifications.length === 0 ? (
                             <p>All clear, no notifications!</p>
                         ) : (
@@ -70,8 +73,7 @@ const NotificationBay: React.FC = () => {
                             ))
                         )}
                     </div>
-                    </div>
-                )}
+                </div>}
             </div>
 
             {modalContent && (

From a9f90d2e9bf2c6b555f1350555e89309577ad584 Mon Sep 17 00:00:00 2001
From: Tobias Merkle <tobias@branchmessenger.com>
Date: Mon, 29 Sep 2025 12:11:53 -0400
Subject: [PATCH 3/3] styling

---
 .../packages/app-store/ui/src/components/NotificationBay.tsx  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
index a82db0d9d..82b3e5263 100644
--- a/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
+++ b/hyperdrive/packages/app-store/ui/src/components/NotificationBay.tsx
@@ -41,7 +41,7 @@ const NotificationBay: React.FC = () => {
 
     return (
         <>
-            <div className={classNames("relative rounded-md max-w-[90vw] p-2")}>
+            <div className={classNames("relative rounded-md p-2")}>
                 <button
                     onClick={() => setIsExpanded(!isExpanded)}
                     className={`clear thin notification-button ${hasErrors ? 'has-errors' : ''}`}
@@ -55,7 +55,7 @@ const NotificationBay: React.FC = () => {
                 </button>
 
                 {isExpanded && <div
-                    className="absolute top-full right-0 max-w-[80vw] z-10 flex flex-col items-stretch"
+                    className="absolute top-full right-0 w-md max-w-[90vw] z-10 flex flex-col items-stretch"
                 >
                     <div
                         className="max-h-md min-h-0 overflow-y-auto bg-white dark:bg-black rounded-md shadow-md px-4 py-2 flex flex-col gap-2 items-stretch"