CCM-5093: fix wave alerts for potentional headings

NHSDigital · Jun 17, 2024 · 49df362 · 49df362
1 parent 05c3e26
commit 49df362
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 21 deletions.
diff --git a/docs/_includes/components/styled-list.html b/docs/_includes/components/styled-list.html
@@ -5,7 +5,7 @@
     <div class="nhsuk-grid-column-one-half">
         <h3 class="nhsnotify-list__item-header">
           <div class="nhsnotify-list__item-header-number">
-            <p class="nhsuk-heading-m">{{ i }}</p>
+            {{ i }}
           </div>
           <div class="nhsnotify-list__item-header-title">
               {{ item.heading }}

diff --git a/docs/_sass/_nhsnotify.scss b/docs/_sass/_nhsnotify.scss
@@ -36,34 +36,24 @@
 }
 
 .nhsnotify-list__item-header-number {
-  width: 15%;
+  width: 2em;
+  height: 2em;
+  line-height: 2em;
+  border-radius: 50%;
 
-  & > p {
-    margin: 0;
-
-    @media screen and (min-width: 990px) {
-      width: 2em;
-      height: 2em;
-      line-height: 2em;
-      border-radius: 50%;
-
-      background-color: $blue-000;
-      color: white;
-      font-weight: bold;
-      text-align: center;
-    }
-  }
+  background-color: $blue-000;
+  color: white;
+  font-weight: bold;
+  text-align: center;
 }
 
 .nhsnotify-list__item-header-title {
   width: 85%;
-  padding-top: 0.3em;
+  padding: 0.3em 0 0 1.5em;
 }
 
 .nhsnotify-list__item-description {
-    @media screen and (min-width: 990px) {
-      padding-left: 4.5em;
-    }
+  padding-left: 5.5em;
 }
 
 .nhsuk-card__description {