feat(accessibility): Add aria-current

docs/css/pico.docs.css

@@ -155,8 +155,8 @@ main > aside a.secondary:focus {
   background-color: transparent;
   color: var(--primary-hover);
 }
-main > aside a.active,
-main > aside a.active:hover {
+main > aside a[aria-current],
+main > aside a[aria-current]:hover {
   color: var(--primary);
 }
 main > aside details {

docs/scss/layout/_aside.scss

@@ -91,8 +91,8 @@ main > aside {
     color: var(--primary-hover);
   }
 
-  a.active,
-  a.active:hover {
+  a[aria-current],
+  a[aria-current]:hover {
     color: var(--primary);
   }
 

docs/src/_sidebar.html

@@ -68,7 +68,7 @@
   <script>
     const activeLink = document.querySelector(`aside a#${props.active}`);
     const parentAccordion = activeLink.closest('details');
-    activeLink.classList.add('active');
+    activeLink.setAttribute('aria-current', 'page');
     parentAccordion.setAttribute('open', 'true');
   </script>
 </aside>