fix: keep stretch regions always on top of other regions (#9895)

jouni · web-flow · commit a68873528f2b · 2025-08-05T11:01:14.000+03:00
diff --git a/packages/notification/src/styles/vaadin-notification-container-base-styles.js b/packages/notification/src/styles/vaadin-notification-container-base-styles.js
@@ -51,11 +51,13 @@ export const notificationContainerStyles = css`
 
   [region='top-stretch'] {
     grid-row: 1;
+    z-index: 2;
     --vaadin-notification-width: 100%;
   }
 
   [region='bottom-stretch'] {
     grid-row: 3;
+    z-index: 2;
     --vaadin-notification-width: 100%;
   }
 

Original file line number	Diff line number	Diff line change
@@ -51,11 +51,13 @@ export const notificationContainerStyles = css`
`51`	`51`
`52`	`52`	`[region='top-stretch'] {`
`53`	`53`	`grid-row: 1;`
	`54`	`+ z-index: 2;`
`54`	`55`	`--vaadin-notification-width: 100%;`
`55`	`56`	`}`
`56`	`57`
`57`	`58`	`[region='bottom-stretch'] {`
`58`	`59`	`grid-row: 3;`
	`60`	`+ z-index: 2;`
`59`	`61`	`--vaadin-notification-width: 100%;`
`60`	`62`	`}`
`61`	`63`