From 81c62ec5fa12999f2ceb839c79c28901850d2682 Mon Sep 17 00:00:00 2001
From: Dave House <david.house@digital.cabinet-office.gov.uk>
Date: Fri, 3 Aug 2018 10:43:12 +0100
Subject: [PATCH] Change spacing relationship on default and small legends and
 hints to align with labels

---
 src/components/fieldset/_fieldset.scss |  5 ++++-
 src/components/hint/_hint.scss         | 31 +++++++++++++++++++++-----
 2 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/src/components/fieldset/_fieldset.scss b/src/components/fieldset/_fieldset.scss
index cc4117175d..a507892eb8 100644
--- a/src/components/fieldset/_fieldset.scss
+++ b/src/components/fieldset/_fieldset.scss
@@ -20,7 +20,7 @@
     box-sizing: border-box; // 1
     display: table;         // 2
     max-width: 100%;        // 1
-    margin-bottom: govuk-spacing(3);
+    margin-bottom: govuk-spacing(2);
     padding: 0;
     // Hack to let legends or elements within legends have margins in webkit browsers
     overflow: hidden;
@@ -32,14 +32,17 @@
 
   .govuk-fieldset__legend--xl {
     @include govuk-font($size: 48, $weight: bold);
+    margin-bottom: govuk-spacing(3);
   }
 
   .govuk-fieldset__legend--l {
     @include govuk-font($size: 36, $weight: bold);
+    margin-bottom: govuk-spacing(3);
   }
 
   .govuk-fieldset__legend--m {
     @include govuk-font($size: 24, $weight: bold);
+    margin-bottom: govuk-spacing(3);
   }
 
   .govuk-fieldset__legend--s {
diff --git a/src/components/hint/_hint.scss b/src/components/hint/_hint.scss
index 2ae2cda736..7dab10c46a 100644
--- a/src/components/hint/_hint.scss
+++ b/src/components/hint/_hint.scss
@@ -16,14 +16,35 @@
   // Reduces margin-bottom of hint when used after the default label (no class)
   // or govuk-label--s for better vertical alignment.
 
-  // This adjustment will not work when the label is inside the <h1>, however
-  // it is unlikely that the default or govuk-label--s class would be used in
-  // this case.
+  // This adjustment will not work when the label is inside the <h1>, however it
+  // is unlikely that the default or govuk-label--s class would be used in this
+  // case.
 
-  // This adjustment will not work in browsers that do not support :not()
-  // Users with these browsers will see the default size margin (5px larger)
+  // This adjustment will not work in browsers that do not support :not(). 
+  // Users with these browsers will see the default size margin (5px larger).
 
   .govuk-label:not(.govuk-label--m):not(.govuk-label--l):not(.govuk-label--xl) + .govuk-hint {
     margin-bottom: govuk-spacing(2);
   }
+
+  // Reduces margin-bottom of hint when used after the default legend (no class)
+  // or govuk-fieldset__legend--s for better vertical alignment.
+
+  // This adjustment will not work when the legend is outside the <h1>, however
+  // it is unlikely that the default or govuk-fieldset__legend--s class would be
+  // used in this case.
+
+  // This adjustment will not work in browsers that do not support :not(). 
+  // Users with these browsers will see the default size margin (5px larger).
+
+  .govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not(.govuk-fieldset__legend--xl) + .govuk-hint {
+    margin-bottom: govuk-spacing(2);
+  }
+
+  // Reduces visual spacing of legend when there is a hint
+
+  .govuk-fieldset__legend + .govuk-hint,
+  .govuk-fieldset__legend + .govuk-hint {
+    margin-top: -(govuk-spacing(1));
+  }
 }