Add descriptive aria-labels to Export and Add Recipients buttons

- Export: "Export - <template name> submissions"
- Add Recipients: "Add Recipients - <template name>" (uses plain text
  translation key, avoiding the HTML-with-hidden-spans version)

Inner content wrapped in aria-hidden span to prevent double-announcement.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
pull/599/head
Marcelo Paiva 3 weeks ago
parent e505e1993f
commit 908a296a45

@ -13,14 +13,18 @@
<% if params[:q].present? || params[:status].present? || filter_params.present? || @pagy.pages > 1 %> <% if params[:q].present? || params[:status].present? || filter_params.present? || @pagy.pages > 1 %>
<%= render 'shared/search_input', title_selector: 'h2' %> <%= render 'shared/search_input', title_selector: 'h2' %>
<% end %> <% end %>
<%= link_to new_template_submissions_export_path(@template, params.permit(:q, *Submissions::Filter::ALLOWED_PARAMS)), class: 'hidden md:flex btn btn-ghost text-base', data: { turbo_frame: 'modal' } do %> <%= link_to new_template_submissions_export_path(@template, params.permit(:q, *Submissions::Filter::ALLOWED_PARAMS)), class: 'hidden md:flex btn btn-ghost text-base', aria: { label: "#{t('export')} - #{@template.name} #{t('submissions')}" }, data: { turbo_frame: 'modal' } do %>
<%= svg_icon('download', class: 'w-6 h-6 stroke-2') %> <span class="flex items-center gap-2" aria-hidden="true">
<span><%= t('export') %></span> <%= svg_icon('download', class: 'w-6 h-6 stroke-2') %>
<span><%= t('export') %></span>
</span>
<% end %> <% end %>
<% if !@template.archived_at? && can?(:create, Submission) %> <% if !@template.archived_at? && can?(:create, Submission) %>
<%= link_to new_template_submission_path(@template), id: 'add_recipients_button', class: 'white-button !border', data: { turbo_frame: 'modal' } do %> <%= link_to new_template_submission_path(@template), id: 'add_recipients_button', class: 'white-button !border', aria: { label: "#{t('add_recipients')} - #{@template.name}" }, data: { turbo_frame: 'modal' } do %>
<%= svg_icon('plus', class: 'w-6 h-6 stroke-2') %> <span class="flex items-center gap-2" aria-hidden="true">
<%= t('add_recipients_html') %> <%= svg_icon('plus', class: 'w-6 h-6 stroke-2') %>
<%= t('add_recipients_html') %>
</span>
<% end %> <% end %>
<% end %> <% end %>
</div> </div>

Loading…
Cancel
Save