Let Banner react on container size instead of screen size

Author: HDinger

.changeset/ripe-bananas-cut.md

@@ -0,0 +1,5 @@
+---
+'@openproject/primer-view-components': patch
+---
+
+Let Banner component react on container size instead of screen size

app/components/primer/alpha/banner.pcss

@@ -1,4 +1,8 @@
 /* Banner alert */
+x-banner {
+  container-type: inline-size;
+  display: block;
+}
 
 .Banner {
   position: relative;
@@ -14,7 +18,7 @@
   grid-template-rows: min-content;
 
   /* `sm` breakpoint variation */
-  @media (max-width: 543.98px) {
+  @container (max-width: 543.98px) {
     grid-template-areas:
       'visual message close'
       '. actions actions';