From 84159b2e90ec045bc4c681ce153bd8d6e918d350 Mon Sep 17 00:00:00 2001
From: Daniel Palafox <dp852@hotmail.com>
Date: Wed, 6 Dec 2023 16:37:05 -0500
Subject: [PATCH] fix: Add h3 heading inside fieldset to improve accessibility

---
 .../form-visibility/form-visibility.component.html    | 11 +++++------
 src/app/register2/components/register2.style.scss     |  6 +++++-
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/app/register2/components/form-visibility/form-visibility.component.html b/src/app/register2/components/form-visibility/form-visibility.component.html
index be7e99270f..61249ed6e5 100644
--- a/src/app/register2/components/form-visibility/form-visibility.component.html
+++ b/src/app/register2/components/form-visibility/form-visibility.component.html
@@ -6,13 +6,12 @@
       name, and more. You control this content and who can see it.
     </ng-container>
   </p>
-  <h3
-    class="orc-font-body mat-subheading-2"
-    i18n="@@register.visibilityLegend"
-  >
-    Visibility settings
-  </h3>
   <fieldset>
+    <legend >
+      <h3 class="orc-font-body mat-subheading-2" i18n="@@register.visibilityLegend">
+        Visibility settings
+      </h3>
+    </legend>
     <p i18n="@@register.visibilityDescription3">
       By default, what visibility should be given to new items added to your
       ORCID Record?
diff --git a/src/app/register2/components/register2.style.scss b/src/app/register2/components/register2.style.scss
index 179297dc04..caddfee8f5 100644
--- a/src/app/register2/components/register2.style.scss
+++ b/src/app/register2/components/register2.style.scss
@@ -18,11 +18,15 @@ h3.margin-top-12,
   margin-top: 12px;
 }
 
-h3,
 legend {
   margin-top: 32px;
   margin-bottom: 14px;
   font-weight: bold;
+  h3 {
+    margin-block-start: 0;
+    margin-block-end: 0;
+    font-weight: bold;
+  }
 }
 
 fieldset {