fix: Add h3 heading inside fieldset to improve accessibility

ORCID · Dec 6, 2023 · 6a280ba · 6a280ba
1 parent 97ff2ec
commit 6a280ba
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 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
@@ -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
@@ -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 {