Merge pull request #999 from numerique-gouv/rdum/update-skiplink

fix(a11y): add "formulaire de connexion" to skiplinks & create dedicated component
numerique-gouv · Feb 26, 2025 · aa0894d · aa0894d
2 parents c46dac3 + a3f67da
commit aa0894d
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 15 deletions.
diff --git a/src/views/_layout.ejs b/src/views/_layout.ejs
@@ -2,28 +2,15 @@
 <html lang="fr">
 <%- include('partials/head.ejs'); %>
 <body>
-    <div class="fr-skiplinks">
-        <nav class="fr-container" role="navigation" aria-label="Accès rapide">
-            <ul class="fr-skiplinks__list">
-                <% if (locals.use_dashboard_layout) { %>
-                    <li>
-                        <a class="fr-link" href="#main">Contenu</a>
-                    </li>
-                <% } %>
-                <li>
-                    <a class="fr-link" href="#footer">Pied de page</a>
-                </li>
-            </ul>
-        </nav>
-    </div>
+    <%- include('partials/skiplinks.ejs'); %>
     <div id="loader-bar"></div>
     <%- include('partials/header.ejs'); %>
     <% if (locals.use_dashboard_layout) { %>
         <main role="main" id="main" tabindex="-1">
             <%- body; %>
         </main>
     <% } else { %>
-        <main role="main" class="onboarding-container">
+        <main role="main" id="main" class="onboarding-container">
             <%- body; %>
             <div class="centered-container">
                 <img src="/dist/<%= locals.illustration ? locals.illustration : 'illu-account.svg' ;%>" alt="" />

diff --git a/src/views/partials/skiplinks.ejs b/src/views/partials/skiplinks.ejs
@@ -0,0 +1,12 @@
+<div class="fr-skiplinks">
+    <nav class="fr-container" role="navigation" aria-label="Accès rapide">
+        <ul class="fr-skiplinks__list">
+            <li>
+                <a class="fr-link" href="#main">Contenu</a>
+            </li>
+            <li>
+                <a class="fr-link" href="#footer">Pied de page</a>
+            </li>
+        </ul>
+    </nav>
+</div>