From 334ca06ac67ae680b497fbe4e186c6e8fa2ec5b9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B8rn=20Erik=20Pedersen?=
 <bjorn.erik.pedersen@gmail.com>
Date: Thu, 13 Feb 2025 18:01:47 +0100
Subject: [PATCH] theme: Fix some dark mode accessibility as reported by Axe
 core

Tested with the Chrome extension.
---
 assets/css/components/content.css             |  4 ++--
 layouts/partials/layouts/breadcrumbs.html     |  2 +-
 layouts/partials/layouts/home/opensource.html | 12 ++++++------
 layouts/partials/layouts/in-this-section.html |  8 +++++---
 layouts/partials/layouts/related.html         |  2 +-
 layouts/partials/layouts/search/button.html   |  2 +-
 layouts/partials/layouts/toc.html             |  2 +-
 7 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/assets/css/components/content.css b/assets/css/components/content.css
index c52949625..607548dbd 100644
--- a/assets/css/components/content.css
+++ b/assets/css/components/content.css
@@ -22,8 +22,8 @@
   /* lead */
   @apply prose-lead:text-slate-500 prose-lead:text-xl prose-lead:mt-2 sm:prose-lead:mt-4 prose-lead:leading-relaxed dark:prose-lead:text-slate-400;
   /* links */
-  @apply prose-a:text-primary prose-a:hover:text-primary/70 prose-a:underline;
-  @apply prose-a:prose-code:underline prose-a:prose-code:hover:text-primary/70 prose-a:prose-code:hover:underline;
+  @apply prose-a:text-primary dark:prose-a:text-blue-500 prose-a:hover:text-blue-500 dark:prose-a:hover:text-blue-400 prose-a:underline;
+  @apply prose-a:prose-code:underline prose-a:prose-code:hover:text-blue-500 prose-a:prose-code:hover:underline;
   /* pre */
   @apply prose-pre:text-gray-800 prose-pre:border-1 prose-pre:border-gray-100 prose-pre:bg-light dark:prose-pre:bg-dark dark:prose-pre:ring-1 dark:prose-pre:ring-slate-300/10;
   /* code */
diff --git a/layouts/partials/layouts/breadcrumbs.html b/layouts/partials/layouts/breadcrumbs.html
index d0628c7ee..69bcf7bd5 100644
--- a/layouts/partials/layouts/breadcrumbs.html
+++ b/layouts/partials/layouts/breadcrumbs.html
@@ -15,7 +15,7 @@
         {{ $isLast := eq $i (sub (len $ancestors) 1) }}
         <a
           href="{{ $p.RelPermalink }}"
-          class="truncate text-blue-600 hover:text-blue-500 {{ if $isCurrentSection }}
+          class="truncate text-blue-600 hover:text-blue-500 dark:text-blue-500 dark:hover:text-blue-400 {{ if $isCurrentSection }}
             current-section
           {{ end }}"
           >{{ $p.LinkTitle }}</a
diff --git a/layouts/partials/layouts/home/opensource.html b/layouts/partials/layouts/home/opensource.html
index b64bdd22b..9c6bfc7aa 100644
--- a/layouts/partials/layouts/home/opensource.html
+++ b/layouts/partials/layouts/home/opensource.html
@@ -17,7 +17,7 @@
           <div class="relative pl-9">
             <dt class="inline font-bold text-gray-900 dark:text-gray-300">
               <svg
-                class="absolute top-1 left-1 size-5 text-blue-600"
+                class="absolute top-1 left-1 size-5 text-blue-500"
                 xmlns="http://www.w3.org/2000/svg"
                 fill="none"
                 viewBox="0 0 24 24"
@@ -36,7 +36,7 @@
               {{ $githubInfo.stargazers_count }}
               stars on GitHub. Join the crowd and hit the
               <a
-                class="text-blue-600 hover:text-blue-700 font-semibold"
+                class="text-blue-500 hover:text-blue-500 font-semibold"
                 href="https://github.com/gohugoio/hugo"
                 >Star button</a
               >.
@@ -45,7 +45,7 @@
           <div class="relative pl-9">
             <dt class="inline font-bold text-gray-900 dark:text-gray-300">
               <svg
-                class="absolute top-1 left-1 size-5 text-blue-600"
+                class="absolute top-1 left-1 size-5 text-blue-500"
                 xmlns="http://www.w3.org/2000/svg"
                 fill="none"
                 viewBox="0 0 24 24"
@@ -63,7 +63,7 @@
               Hugo has a large and active community. If you have questions or
               need help, you can ask in the
               <a
-                class="text-blue-600 hover:text-blue-700 font-semibold"
+                class="text-blue-500 hover:text-blue-500 font-semibold"
                 href="https://discourse.gohugo.io"
                 >Hugo forums</a
               >.
@@ -72,7 +72,7 @@
           <div class="relative pl-9">
             <dt class="inline font-bold text-gray-900 dark:text-gray-300">
               <svg
-                class="absolute top-1 left-1 size-5 text-blue-600"
+                class="absolute top-1 left-1 size-5 text-blue-500"
                 xmlns="http://www.w3.org/2000/svg"
                 fill="none"
                 viewBox="0 0 24 24"
@@ -89,7 +89,7 @@
             <dd class="inline ml-1">
               Hugo has a fast
               <a
-                class="text-blue-600 hover:text-blue-700 font-semibold"
+                class="text-blue-500 hover:text-blue-500 font-semibold"
                 href="https://github.com/gohugoio/hugo/releases"
                 >release</a
               >
diff --git a/layouts/partials/layouts/in-this-section.html b/layouts/partials/layouts/in-this-section.html
index 8be8cff8b..28e5ed7eb 100644
--- a/layouts/partials/layouts/in-this-section.html
+++ b/layouts/partials/layouts/in-this-section.html
@@ -17,10 +17,12 @@
         <li>
           <a
             class="text-sm {{ if eq . $ }}
-              font-bold text-blue-600 focus:font-bold dark:text-blue-200
-              hover:text-blue-600 scroll-active
+              font-bold text-blue-600 hover:text-blue-600
+              dark:hover:text-blue-200 dark:text-blue-200 focus:font-bold
+              scroll-active
             {{ else }}
-              text-blue-600 hover:text-blue-500
+              text-blue-600 hover:text-blue-500 dark:text-blue-500
+              dark:hover:text-blue-400
             {{ end }}"
             href="{{ .RelPermalink }}"
             >{{ .LinkTitle }}</a
diff --git a/layouts/partials/layouts/related.html b/layouts/partials/layouts/related.html
index 16a04dce1..dc0de6870 100644
--- a/layouts/partials/layouts/related.html
+++ b/layouts/partials/layouts/related.html
@@ -27,7 +27,7 @@
     {{- range . }}
       <li>
         <a
-          class="text-sm text-blue-600 hover:text-blue-500"
+          class="text-sm text-blue-600 hover:text-blue-500 dark:text-blue-500 dark:hover:text-blue-400"
           href="{{ .RelPermalink }}"
           >{{ .LinkTitle }}</a
         >
diff --git a/layouts/partials/layouts/search/button.html b/layouts/partials/layouts/search/button.html
index 3dcb1eb9d..228f48ad9 100644
--- a/layouts/partials/layouts/search/button.html
+++ b/layouts/partials/layouts/search/button.html
@@ -3,7 +3,7 @@
     x-data @click="$dispatch('search-toggle')"
   {{ end }}
   type="button"
-  class="grid cursor-pointer w-full text-gray-500 lg:w-56 grid-cols-[auto_1fr_auto] items-center rounded-md px-2 sm:px-4 py-2 text-left text-xs/6 lg:text-sm/6 outline-0 sm:outline-1 -outline-offset-1 outline-gray-600">
+  class="grid cursor-pointer w-full text-gray-300 lg:w-56 grid-cols-[auto_1fr_auto] items-center rounded-md px-2 sm:px-4 py-2 text-left text-xs/6 lg:text-sm/6 outline-0 sm:outline-1 -outline-offset-1 outline-gray-600">
   <svg
     class="pointer-events-none -ml-0.5 mr-2 size-5 sm:size-4 fill-slate-400 dark:fill-slate-500">
     <use href="#icon--search"></use>
diff --git a/layouts/partials/layouts/toc.html b/layouts/partials/layouts/toc.html
index 06946d885..1a08156c1 100644
--- a/layouts/partials/layouts/toc.html
+++ b/layouts/partials/layouts/toc.html
@@ -23,7 +23,7 @@
           href="#{{ .ID }}"
           x-ref="{{ .ID }}"
           @click.stop="setActive('{{ .ID }}')"
-          class="block pb-1 text-blue-600 hover:text-blue-500{{ if gt .Level 2 }}
+          class="block pb-1 text-blue-600 hover:text-blue-500 dark:text-blue-500 dark:hover:text-blue-400{{ if gt .Level 2 }}
             ml-2 lg:ml-3 text-sm
           {{ else }}
             text-sm