ISTWCMS-7158: don't make emergency notifications require an additional class...

ISTWCMS-7158: don't make emergency notifications require an additional class to make them look like emergencies

src/patterns/03-layouts/emergency-notification/_emergency-notification.scss

@@ -17,82 +17,59 @@
       @include uw-contained-width(var(--layout-max-width));
     }
 
-    .block-uw-cbl-emergency-notification {
-      background: #f0f0f0;
-      border: 2px solid #96172e;
-      margin: var(--size-2) 0;
-      padding: var(--size-2);
-
-      // Prevent excess space at top from elements that have a margin-top.
-      > *:first-child {
-        margin-top: 0;
-      }
-
-      // Prevent excess space at bottom from elements that have a margin-bottom.
-      > *:last-child {
-        margin-bottom: 0;
-      }
-
-      p:last-of-type {
-        margin-bottom: 0;
-      }
-      
-    }
   }
 
-  &.emergency-notification {
-    background: var(--uw-alert);
-    max-width: 100%;
+  background: var(--uw-alert);
+  max-width: 100%;
+
+  .uw-emergency-notification__content {
+    display: grid;
+    gap: var(--size-2);
+    grid-template-columns: 100%;
+    margin: var(--size-4) auto;
+    max-width: 80%;
+    padding: 0;
+    text-align: center;
 
-    .uw-emergency-notification__content {
-      display: grid;
-      gap: var(--size-2);
-      grid-template-columns: 100%;
-      margin: var(--size-4) auto;
-      max-width: 80%;
-      padding: 0;
-      text-align: center;
+    .uw-icon {
+      align-self: center;
+      height: var(--size-8);
+      margin-left: auto;
+      margin-right: auto;
+      width: var(--size-8);
 
-      .uw-icon {
-        align-self: center;
+      svg {
+        fill: var(--uw-white);
         height: var(--size-8);
-        margin-left: auto;
-        margin-right: auto;
         width: var(--size-8);
-
-        svg {
-          fill: var(--uw-white);
-          height: var(--size-8);
-          width: var(--size-8);
-        }
       }
+    }
 
-      @media(min-width: $screen-md) {
-        @include uw-contained-width(var(--layout-max-width));
-        grid-template-columns: var(--size-10) auto;
-        margin: var(--size-2) auto;
-        padding: 0 var(--size-2);
-        text-align: left;
+    @media(min-width: $screen-md) {
+      @include uw-contained-width(var(--layout-max-width));
+      grid-template-columns: var(--size-10) auto;
+      margin: var(--size-2) auto;
+      padding: 0 var(--size-2);
+      text-align: left;
+    }
+
+    .block-uw-cbl-emergency-notification {
+      border: 0 solid transparent;
+      background-color: var(--uw-alert);
+      padding: var(--size-1);
+      margin: 0;
+      * {
+        color: var(--uw-white);
       }
 
-      .block-uw-cbl-emergency-notification {
-        border: 0 solid transparent;
-        background-color: var(--uw-alert);
-        padding: var(--size-1);
-        margin: 0;
+      .emergency-notification__content {
         * {
-          color: var(--uw-white);
+          font-family: var(--font-systemmedium);
+          font-size: var(--font-size-1);
         }
-
-        .emergency-notification__content {
-          * {
-            font-family: var(--font-systemmedium);
-            font-size: var(--font-size-1);
-          }
-          p {
-            &:last-of-type {
-              margin-bottom: 0;
-            }
+        p {
+          &:last-of-type {
+            margin-bottom: 0;
           }
         }
       }

src/patterns/03-layouts/emergency-notification/emergency-notification.twig

-<div class="uw-emergency-notification emergency-notification">
+<div class="uw-emergency-notification">
   <div role="complementary" class="uw-emergency-notification__content">
     {% include '@components/icon/icon.twig' with {
       'name': 'special-alert',