From 828df42b574bfd225480ecc0545927dda669b5aa Mon Sep 17 00:00:00 2001
From: Jonathan Hardy <Jonathan.Hardy97@gmail.com>
Date: Mon, 9 Sep 2024 12:16:49 +0100
Subject: [PATCH 1/2] resolved layout issue on create username page

---
 .../create-username/create-username.component.html       | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontend/src/app/features/activate-user-account/create-username/create-username.component.html b/frontend/src/app/features/activate-user-account/create-username/create-username.component.html
index bbbd17830d..ab48fd100b 100644
--- a/frontend/src/app/features/activate-user-account/create-username/create-username.component.html
+++ b/frontend/src/app/features/activate-user-account/create-username/create-username.component.html
@@ -16,8 +16,8 @@ <h1 class="govuk-fieldset__heading">Create your username and password</h1>
 
         <div class="govuk-form-group" [class.govuk-form-group--error]="submitted && getUsername.errors">
           <label class="govuk-label" for="username"> Username </label>
-          <span id="username-hint" class="govuk-hint"
-            >You'll use this to sign in, so it needs to be unique to you.</span
+          <div id="username-hint" class="govuk-hint"
+            >You'll use this to sign in, so it needs to be unique to you.</div
           >
           <span *ngIf="submitted && getUsername.errors" id="username-error" class="govuk-error-message">
             <span class="govuk-visually-hidden">Error:</span>
@@ -36,10 +36,10 @@ <h1 class="govuk-fieldset__heading">Create your username and password</h1>
         <div [formGroupName]="'passwordGroup'">
           <div class="govuk-form-group" [class.govuk-form-group--error]="submitted && getPassword.errors">
             <label class="govuk-label" for="createPasswordInput"> Password </label>
-            <span id="createPasswordInput-hint" class="govuk-hint">
+            <div id="createPasswordInput-hint" class="govuk-hint">
               Must be at least 8 characters long and have uppercase letters, lowercase letters, numbers and special
               characters like !, £.
-            </span>
+            </div>
             <span
               *ngIf="submitted && getPassword.errors"
               id="passwordGroup-createPasswordInput-error"
@@ -71,6 +71,7 @@ <h1 class="govuk-fieldset__heading">Create your username and password</h1>
 
           <div class="govuk-form-group" [class.govuk-form-group--error]="submitted && getConfirmPassword.errors">
             <label class="govuk-label" for="confirmPasswordInput"> Confirm password </label>
+
             <span
               *ngIf="submitted && getConfirmPassword.errors"
               id="passwordGroup-confirmPasswordInput-error"

From 8fcd41deb90529b52beba92c99b34533365a4d69 Mon Sep 17 00:00:00 2001
From: Jonathan Hardy <Jonathan.Hardy97@gmail.com>
Date: Wed, 18 Sep 2024 15:44:29 +0100
Subject: [PATCH 2/2] resolved styling issue on workplace table when error
 messages are displayed

---
 frontend/src/assets/scss/components/_summary-list.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/src/assets/scss/components/_summary-list.scss b/frontend/src/assets/scss/components/_summary-list.scss
index 702fbdd946..e8ab5b2ca1 100644
--- a/frontend/src/assets/scss/components/_summary-list.scss
+++ b/frontend/src/assets/scss/components/_summary-list.scss
@@ -45,12 +45,13 @@
   }
 }
 
-.govuk-summary-list__row--no-bottom-border {
+.govuk-summary-list__row.govuk-summary-list__row--no-bottom-border {
   .govuk-summary-list__key,
   .govuk-summary-list__value,
   .govuk-summary-list__actions {
     border-bottom: none;
   }
+  border-bottom: none;
 }
 
 .govuk-summary-list__row--no-bottom-padding {