From 72842138e17b0cd2083aab7ac1d676f8a88de594 Mon Sep 17 00:00:00 2001
From: Marcelo Paiva <mpaiva@gmail.com>
Date: Thu, 26 Feb 2026 08:00:42 -0500
Subject: [PATCH] Fix focus ring on decline label and download btn

- Add tabindex="0" to both decline <label> buttons so they enter the
  tab order and :focus-visible applies (labels are not natively focusable)
- Add .btn:focus-visible alongside :focus-visible in SCSS to override
  DaisyUI's higher-specificity .btn:focus-visible rule, ensuring the
  global 8px blue ring applies to all DaisyUI buttons

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/javascript/application.scss     | 3 ++-
 app/javascript/form.scss            | 3 ++-
 app/views/submit_form/show.html.erb | 4 ++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/app/javascript/application.scss b/app/javascript/application.scss
index 1243633a..d9ddd399 100644
--- a/app/javascript/application.scss
+++ b/app/javascript/application.scss
@@ -4,7 +4,8 @@
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";
 
-:focus-visible {
+:focus-visible,
+.btn:focus-visible {
   outline-color: rgb(14, 99, 200);
   outline-style: solid;
   outline-width: 8px;
diff --git a/app/javascript/form.scss b/app/javascript/form.scss
index c6f01593..d171688f 100644
--- a/app/javascript/form.scss
+++ b/app/javascript/form.scss
@@ -4,7 +4,8 @@
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";
 
-:focus-visible {
+:focus-visible,
+.btn:focus-visible {
   outline-color: rgb(14, 99, 200);
   outline-style: solid;
   outline-width: 8px;
diff --git a/app/views/submit_form/show.html.erb b/app/views/submit_form/show.html.erb
index 930844b1..4c303cb8 100644
--- a/app/views/submit_form/show.html.erb
+++ b/app/views/submit_form/show.html.erb
@@ -21,7 +21,7 @@
           </h1>
           <div class="flex items-center space-x-2" style="margin-left: 20px; flex-shrink: 0">
             <% if @form_configs[:with_decline] %>
-              <label id="decline_button_header" for="<%= decline_modal_checkbox_uuid = SecureRandom.uuid %>" class="btn btn-sm !px-5"><%= t(:decline) %></label>
+              <label id="decline_button_header" for="<%= decline_modal_checkbox_uuid = SecureRandom.uuid %>" class="btn btn-sm !px-5" tabindex="0"><%= t(:decline) %></label>
             <% end %>
             <% if @form_configs[:with_partial_download] %>
               <download-button data-src="<%= submit_form_download_index_path(@submitter.slug) %>" class="btn btn-neutral text-white btn-sm !px-4">
@@ -39,7 +39,7 @@
         </div>
         <scroll-buttons class="fixed right-5 top-2 hidden md:flex gap-1 z-50 ease-in-out opacity-0 -translate-y-10">
           <% if @form_configs[:with_decline] %>
-            <label id="decline_button_scroll" for="<%= decline_modal_checkbox_uuid %>" class="btn btn-sm px-0">
+            <label id="decline_button_scroll" for="<%= decline_modal_checkbox_uuid %>" class="btn btn-sm px-0" tabindex="0">
               <span class="min-[1366px]:inline hidden px-3">
                 <%= t(:decline) %>
               </span>