doc: add "Skip to content" button

PR-URL: nodejs#56750 Reviewed-By: James M Snell <[email protected]> Reviewed-By: Ulises Gascón <[email protected]> Reviewed-By: Claudio Wunder <[email protected]>
Ceres6 · Jan 26, 2025 · f1196ee · f1196ee
1 parent a6c5ce2
commit f1196ee
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/doc/api_assets/style.css b/doc/api_assets/style.css
@@ -122,6 +122,19 @@ a.type {
   font-size: .9em;
 }
 
+.skip-to-content {
+  position: fixed;
+  top: -300%;
+}
+.skip-to-content:focus {
+  display: block;
+  top: 0;
+  left: 0;
+  background-color: var(--green1);
+  padding: 1rem;
+  z-index: 999999;
+}
+
 #content {
   position: relative;
 }

diff --git a/doc/template.html b/doc/template.html
@@ -26,6 +26,7 @@
   __JS_FLAVORED_DYNAMIC_CSS__
 </head>
 <body class="alt apidoc" id="api-section-__FILENAME__">
+  <a href="#apicontent" class="skip-to-content">Skip to content</a>
   <div id="content" class="clearfix">
     <div role="navigation" id="column2" class="interior">
       <div id="intro" class="interior">