Merge branch 'sarahg/a11y-fixes-algolia' into 'main'

Accessibility improvements

See merge request https://gitlab.com/gitlab-org/gitlab-docs/-/merge_requests/3577

Merged-by: David O'Regan <doregan@gitlab.com>
Approved-by: David O'Regan <doregan@gitlab.com>
Co-authored-by: Sarah German <sgerman@gitlab.com>

5 files changed, 12 insertions, 12 deletions

diff --git a/content/assets/stylesheets/help.scss b/content/assets/stylesheets/help.scss
index 1262e45b..7bc7caa3 100644
--- a/content/assets/stylesheets/help.scss
+++ b/content/assets/stylesheets/help.scss
@@ -21,15 +21,15 @@
     }
   }
 
-  h4,
-  h5 {
+  h2,
+  h3 {
     border-bottom: 0;
     margin-bottom: 0;
     margin-top: 0;
     padding-bottom: 0;
   }
 
-  h4[id]::before {
+  h2[id]::before {
     display: none;
   }
 
diff --git a/layouts/feedback.html b/layouts/feedback.html
index 0446e63f..47cf91e7 100644
--- a/layouts/feedback.html
+++ b/layouts/feedback.html
@@ -7,16 +7,16 @@
     aria-expanded="false"
     aria-controls="help-feedback-content"
   >
-    <h4 class="help-and-feedback-title" id="help-and-feedback">
+    <h2 class="help-and-feedback-title" id="help-and-feedback">
       <%= icon('question', nil, 'help-icon') %> Help & feedback <%= icon('chevron-lg-up', nil,
       'toggle-icon') %>
-    </h4>
+    </h2>
   </a>
   <div class="collapse show" id="help-feedback-content">
     <div class="row mt-3">
       <div class="col-md-8">
         <div>
-          <h5 class="help-and-feedback-heading">Docs</h5>
+          <h3 class="help-and-feedback-heading">Docs</h3>
           <a
             class="help-and-feedback-link"
             href="<%= edit_on_gitlab(@item) %>"
@@ -44,7 +44,7 @@
         </div>
 
         <div class="mt-3">
-          <h5 class="help-and-feedback-heading">Product</h5>
+          <h3 class="help-and-feedback-heading">Product</h3>
           <a
             class="help-and-feedback-link"
             href="https://gitlab.com/gitlab-org/gitlab/-/issues/new?issue[description]=Describe%20what%20you%20would%20like%20to%20see%20improved.%0A%0A%3C!--%20Don%27t%20edit%20below%20this%20line%20--%3E%0A%0A%2Flabel%20~%22docs%5C-comments%22%20&issue[title]=Docs%20-%20product%20feedback:%20Write%20your%20title"
@@ -69,7 +69,7 @@
         </div>
 
         <div class="mt-3">
-          <h5 class="help-and-feedback-heading">Feature availability and product trials</h5>
+          <h3 class="help-and-feedback-heading">Feature availability and product trials</h3>
           <a class="help-and-feedback-link" href="https://about.gitlab.com/pricing/" target="_blank"
             >View pricing</a
           >
@@ -86,7 +86,7 @@
 
       <div class="col-md-4 right-col">
         <div class="help-subsection">
-          <h5 class="help-and-feedback-heading">Get Help</h5>
+          <h3 class="help-and-feedback-heading">Get Help</h3>
           <p>
             If you didn't find what you were looking for,
             <a class="help-and-feedback-link" href="/search/" target="_blank">search the docs</a
diff --git a/layouts/footer.html b/layouts/footer.html
index 9e7ebcd3..fac3d52b 100644
--- a/layouts/footer.html
+++ b/layouts/footer.html
@@ -1,7 +1,7 @@
 <footer class="px-3 border-top footer">
   <div class="row py-2">
     <div class="col-9">
-      <a href="https://gitlab.com/dashboard" target="_blank"> <img src="/assets/images/gitlab-logo.svg" alt="Sign in to GitLab.com" aria-hidden="true" role="img"> </a>
+      <a href="https://gitlab.com/dashboard" target="_blank"><img src="/assets/images/gitlab-logo.svg" alt="Sign in to GitLab.com" aria-hidden="true" role="img"><span class="gl-sr-only">Sign in to GitLab.com</span></a>
     </div>
     <div class="col-3 p-0 m-0">
       <div class="d-none d-md-flex justify-content-end">
diff --git a/layouts/head.html b/layouts/head.html
index 9b2c1696..619a2942 100644
--- a/layouts/head.html
+++ b/layouts/head.html
@@ -11,7 +11,7 @@
 <% else %>
   <meta name="description" property="og:description" content="Documentation for GitLab Community Edition, GitLab Enterprise Edition, Omnibus GitLab, and GitLab Runner.">
 <% end %>
-<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <% if @item[:noindex] or !production_and_default_branch? %>
   <meta name="robots" content="noindex, nofollow">
 <% end %>
diff --git a/layouts/redirect.html b/layouts/redirect.html
index c9187fc3..62c3771c 100644
--- a/layouts/redirect.html
+++ b/layouts/redirect.html
@@ -10,7 +10,7 @@
     <link rel="stylesheet" href="<%= @items['/assets/stylesheets/stylesheet.*'].path %>">
     <link rel="stylesheet" href="<%= @items['/assets/stylesheets/footer.*'].path %>">
     <script async src="<%= @items['/assets/javascripts/docs.*'].path %>"></script>
-    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
   </head>
   <body>
     <%= render '/header.*' %>