Update label margins to match fieldsets and align with GOV.UK

nhsuk · May 13, 2024 · 30b7b24 · 30b7b24
1 parent c4a459e
commit 30b7b24
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 23 deletions.
diff --git a/packages/components/fieldset/_fieldset.scss b/packages/components/fieldset/_fieldset.scss
@@ -51,7 +51,6 @@
 
 .nhsuk-fieldset__legend--s {
   @include nhsuk-font($size: 19, $weight: bold);
-  margin-bottom: nhsuk-spacing(3);
 }
 
 .nhsuk-fieldset__heading {

diff --git a/packages/components/label/_label.scss b/packages/components/label/_label.scss
@@ -10,45 +10,31 @@
 }
 
 /* Modifiers that make labels look more like their equivalent headings */
-
-.nhsuk-label--xl {
-  @include nhsuk-typography-responsive(48);
-
-  display: block;
+.nhsuk-label--xl,
+.nhsuk-label--l,
+.nhsuk-label--m {
   font-weight: $nhsuk-font-bold;
   margin-top: 0;
+  margin-bottom: nhsuk-spacing(3);
+}
 
-  @include nhsuk-responsive-margin(7, "bottom");
+.nhsuk-label--xl {
+  @include nhsuk-typography-responsive(48);
 }
 
 .nhsuk-label--l {
   @include nhsuk-typography-responsive(32);
-
-  display: block;
-  font-weight: $nhsuk-font-bold;
-  margin-top: 0;
-
-  @include nhsuk-responsive-margin(4, "bottom");
 }
 
 .nhsuk-label--m {
   @include nhsuk-typography-responsive(24);
-
-  display: block;
-  font-weight: $nhsuk-font-bold;
-  margin-top: 0;
-
-  @include nhsuk-responsive-margin(4, "bottom");
 }
 
 .nhsuk-label--s {
   @include nhsuk-typography-responsive(19);
-
-  display: block;
   font-weight: $nhsuk-font-bold;
   margin-top: 0;
-
-  @include nhsuk-responsive-margin(4, "bottom");
+  margin-bottom: nhsuk-spacing(2);
 }
 
 // When the label is nested inside a heading, override the heading so that it