chore: cleanup

src/_includes/partials/nav/menu.liquid

@@ -5,7 +5,6 @@
 <div class="flex-centered">
   <input id="menu-toggle" type="checkbox" aria-hidden="true" />
   <label class="menu-button-container" for="menu-toggle" aria-expanded="false" tabindex="0">
-    <span id="menu-label-text" class="screen-readers-only">Toggle mobile menu</span>
     <div class="menu-closed" aria-hidden="true">{% tablericon "menu" "Menu closed" %}</div>
     <div class="menu-open" aria-hidden="true">{% tablericon "x" "Menu open" %}</div>
   </label>

src/_includes/partials/nav/theme-toggle.liquid

@@ -1,7 +1,7 @@
 <script type="module" src="/assets/scripts/components/theme-toggle.js" crossorigin="anonymous"></script>
 <span class="client-side">
   <theme-toggle>
-    <button class="theme-toggle" aria-label="Toggle site theme" tabindex="0">
+    <button class="theme-toggle" tabindex="0">
       <span class="light">
         {% tablericon "sun" "Toggle light theme" %}
       </span>

src/assets/scripts/menu.js

@@ -1,27 +1,12 @@
 window.addEventListener('load', () => {
   const menuInput = document.getElementById('menu-toggle')
-  const menuLabelText = document.getElementById('menu-label-text')
   const menuButtonContainer = document.querySelector('.menu-button-container')
   const menuItems = document.querySelectorAll('.menu-primary li')
-  const isMobile = () => window.innerWidth <= 768
-
-  const udpateMenuState = () => {
-    const isExpanded = menuInput.checked
-    menuButtonContainer.setAttribute('aria-expanded', isExpanded)
-
-    if(isExpanded) menuLabelText.textContent = 'Close mobile menu'
-    if (!isExpanded) menuLabelText.textContent = 'Open mobile menu'
-  }
-
-  udpateMenuState()
-
-  menuInput.addEventListener('change', udpateMenuState)
 
   menuButtonContainer.addEventListener('keydown', e => {
     if (e.key === 'Enter' || e.key === ' ') {
       e.preventDefault()
       menuInput.checked = !menuInput.checked
-      udpateMenuState()
     }
   })
 
@@ -35,9 +20,6 @@ window.addEventListener('load', () => {
   })
 
   document.addEventListener('keydown', e => {
-    if (e.key === 'Escape' && isMobile() && menuInput.checked) {
-      menuInput.checked = false
-      udpateMenuState()
-    }
+    if (e.key === 'Escape' && menuInput.checked) menuInput.checked = false
   })
 })

src/assets/styles/base/index.css

@@ -561,37 +561,6 @@ li {
   display: none !important;
 }
 
-.hidden-visually {
-  border: 0;
-  clip: rect(0 0 0 0);
-  height: 1px;
-  margin: -1px;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-
-  &:focus {
-    clip: auto;
-    height: auto;
-    margin: 0;
-    overflow: visible;
-    position: static;
-    width: auto;
-  }
-}
-
-.screen-readers-only:not(:focus):not(:active) {
-  clip: rect(0 0 0 0);
-  clip-path: inset(50%);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-}
-
 .text-centered {
   text-align: center !important;
 }