From 7d088e4728dbfda5d0a4e809d35bda235f2573f9 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Mon, 8 Jul 2024 10:16:23 +0800
Subject: [PATCH] Use tabindex instead of button element to make pride buttons
 focusable

---
 src/index.njk | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/index.njk b/src/index.njk
index 389b201b..b1a2f32a 100644
--- a/src/index.njk
+++ b/src/index.njk
@@ -76,9 +76,7 @@ eleventyComputed:
     <div class="flag-progress-intersex-lesbian" role="img" aria-label="Custom pride flag which combines the lesbian pride flag and the progress pride flag triangle" style="height: 20rem; margin-bottom: 1em;"></div>
     {%- macro prideButton(file, alt, tooltip=alt, width=88, height=31) -%}
         <li data-tooltip>
-            <button data-tooltip-trigger title="{{ tooltip }}" style="cursor: unset; padding: 0; margin: 0; border: 0;">
-                <img src="/assets/buttons/pride/{{ file }}.png" alt="{{ alt }}" width="{{ width }}" height="{{ height }}" loading="lazy">
-            </button>
+            <img src="/assets/buttons/pride/{{ file }}.png" alt="{{ alt }}" data-tooltip-trigger title="{{ tooltip }}" width="{{ width }}" height="{{ height }}" loading="lazy" tabindex="0">
         </li>
     {%- endmacro -%}
     <ul class="web-btn-wrapper">