From 755cd022d71bde18ff878f209c5cf025587b5af5 Mon Sep 17 00:00:00 2001
From: tastytea <tastytea@tastytea.de>
Date: Mon, 22 Mar 2021 18:22:55 +0100
Subject: [PATCH] Add custom ARIA labels.

---
 README.adoc                  | 16 ++++++++++++++++
 layouts/partials/footer.html |  2 +-
 layouts/partials/header.html |  2 +-
 3 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/README.adoc b/README.adoc
index b4bf216..f302824 100644
--- a/README.adoc
+++ b/README.adoc
@@ -10,6 +10,7 @@
 :uri-twittercards: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards.html
 :uri-hugo-doc-toc: https://gohugo.io/content-management/toc
 :uri-pygments: https://pygments.org/
+:uri-mozilla-aria-nav: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role
 
 *nocolor* is a link:{uri-hugo}[Hugo] theme with no predefined colors and minimal
 styling. It is based on link:{uri-slick}[Slick].
@@ -50,6 +51,21 @@ template `extra_head.html` or above the footer by overwriting
 `layouts/partials/extra_head.html` or `layouts/partials/extra_foot.html`,
 respectively.
 
+=== Custom ARIA labels
+
+Some elements can't be labeled by default because we don't know what's going to
+be in it. Custom link:{uri-mozilla-aria-nav}[ARIA labels] are supported for the
+top menu and the bottom menu.
+
+.`config.toml`
+[source,toml]
+--------------------------------------------------------------------------------
+[params]
+    [params.aria]
+        menu_top = "Main"
+        menu_bottom = "Contact"
+--------------------------------------------------------------------------------
+
 === Syntax highlighting with Asciidoctor
 
 If you want source code highlighting with AsciiDoc, you'll need pygmentize from
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index ff118a9..db8b9a2 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,6 +1,6 @@
 <hr>
 <footer class="footer">
-  <nav class="nav nav-bottom">
+  <nav class="nav nav-bottom"{{- with .Site.Params.aria.menu_top }} aria-label="{{ . }}"{{- end }}>
     <ul>
       {{- range .Site.Menus.footer }}
       <li>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index ecd1201..e06c215 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -4,7 +4,7 @@
   <span class="description">{{ . }}</span>
   {{- end }}
 </header>
-<nav class="nav nav-top">
+<nav class="nav nav-top"{{- with .Site.Params.aria.menu_top }} aria-label="{{ . }}"{{- end }}>
   <ul>
     {{- $curr := . }}
     {{- range .Site.Menus.main }}