From c5c8b55e19bda7f816729a235b47d1387283163d Mon Sep 17 00:00:00 2001
From: Liam Johnston <liam.johnston@springload.co.nz>
Date: Tue, 10 Sep 2024 10:48:50 +1200
Subject: [PATCH] Various a11y fixes

---
 .../components/MainNavDesktop/MainNavDesktopItem.tsx       | 1 +
 .../components/MainNavMobile/MainNavMobileItem.tsx         | 6 +++++-
 cdhweb/static_src/global/components/main-nav-desktop.scss  | 2 +-
 cdhweb/static_src/global/mixins/three-dee-box.scss         | 2 +-
 templates/includes/header.html                             | 7 +++++--
 templates/includes/pagination.html                         | 3 ++-
 6 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/cdhweb/static_src/components/MainNavDesktop/MainNavDesktopItem.tsx b/cdhweb/static_src/components/MainNavDesktop/MainNavDesktopItem.tsx
index 22d8e48c..6cfcbb08 100644
--- a/cdhweb/static_src/components/MainNavDesktop/MainNavDesktopItem.tsx
+++ b/cdhweb/static_src/components/MainNavDesktop/MainNavDesktopItem.tsx
@@ -158,6 +158,7 @@ const DesktopMenuItem = ({
           className={cx('main-nav-desktop__item', {
             'main-nav-desktop__item--current-section': item.is_current,
           })}
+          aria-current={item.is_current ? 'page' : undefined}
         >
           <span>{item.title}</span>
         </a>
diff --git a/cdhweb/static_src/components/MainNavMobile/MainNavMobileItem.tsx b/cdhweb/static_src/components/MainNavMobile/MainNavMobileItem.tsx
index a82da9ca..382cdf7e 100644
--- a/cdhweb/static_src/components/MainNavMobile/MainNavMobileItem.tsx
+++ b/cdhweb/static_src/components/MainNavMobile/MainNavMobileItem.tsx
@@ -35,7 +35,11 @@ const MobileMenuItem = ({
           />
         </button>
       ) : (
-        <a href={item.link_url} className="mobile-menu__nav-btn">
+        <a
+          href={item.link_url}
+          className="mobile-menu__nav-btn"
+          aria-current={item.is_current ? 'page' : undefined}
+        >
           <span>{item.title}</span>
           <Svg
             sprite="two-tone"
diff --git a/cdhweb/static_src/global/components/main-nav-desktop.scss b/cdhweb/static_src/global/components/main-nav-desktop.scss
index 888839dc..d09bbfc4 100644
--- a/cdhweb/static_src/global/components/main-nav-desktop.scss
+++ b/cdhweb/static_src/global/components/main-nav-desktop.scss
@@ -134,7 +134,7 @@
 }
 
 .main-nav-desktop__item--current-section {
-  border-color: var(--color-brand-40);
+  border-color: var(--color-brand-100);
 }
 
 .main-nav-desktop__dropdown-icon {
diff --git a/cdhweb/static_src/global/mixins/three-dee-box.scss b/cdhweb/static_src/global/mixins/three-dee-box.scss
index d5f1b072..bbd5bee8 100644
--- a/cdhweb/static_src/global/mixins/three-dee-box.scss
+++ b/cdhweb/static_src/global/mixins/three-dee-box.scss
@@ -64,7 +64,7 @@
   }
 
   & > * {
+    // Make content appear in front of 3d box's solid background
     isolation: isolate;
-    z-index: 1;
   }
 }
diff --git a/templates/includes/header.html b/templates/includes/header.html
index 1f768f29..205337e9 100644
--- a/templates/includes/header.html
+++ b/templates/includes/header.html
@@ -42,8 +42,11 @@
                                 class="main-nav-desktop__item 
                                     {% if request.path|starts_with:item.link_url %}
                                         main-nav-desktop__item--current-section
-                                    {% endif %}
-                            ">  
+                                    {% endif %}"
+                                {% if request.path|starts_with:item.link_url and not item.l2_items.all %}
+                                    aria-current="page"
+                                {% endif %}
+                                >  
                                 <span>{{ item.title }}</span>
                                 {# Reserve space for dropdown icon, to stop jank when the React version replaces this version. #}
                                 {% if item.l2_items.all %}
diff --git a/templates/includes/pagination.html b/templates/includes/pagination.html
index 5cc52860..0c4687ac 100644
--- a/templates/includes/pagination.html
+++ b/templates/includes/pagination.html
@@ -12,7 +12,8 @@
   {% for number in page_obj.paginator.page_range %}
     <a href="?{% url_replace 'page' number %}" 
       class="pagination__item {% if number == page_obj.number %}pagination__item--current{% endif %}"
-      >
+      {% if number == page_obj.number %}aria-current="page"{% endif %}
+    >
       {{ number }}
     </a>
   {% endfor %}