HIGH PRIORITY — Icon-only buttons with no accessible name:
- _toggle_view.html.erb: aria-label on Templates/Submissions view buttons
- _template.html.erb: aria-label on move, restore, edit, clone, archive/delete
(also fixes bug: was aria_label: t('restore') for all, now dynamic)
- _title.html.erb: aria-label on move-folder pencil link
- submissions/show.html.erb: aria-label on download options dropdown toggle,
audit log link, event log link, edit submitter pencil in parties view
- submit_form/show.html.erb: aria-label on scroll decline button (mobile icon-only)
- contenteditable.vue: span→role=button + aria-label + keyboard handlers (Enter/Space)
on edit pencil; aria-hidden on decorative icon
- signature_step.vue: aria-label + aria-hidden on minimize link
MEDIUM PRIORITY — Form inputs with missing labels:
- text_step.vue: conditional aria-label fallback on input/textarea when no
visible label rendered (showFieldNames=false or field has no name)
- area.vue: aria-label on multiple-select checkbox (matches radio pattern)
MEDIUM PRIORITY — Images with generic hardcoded alt text:
- area.vue: replace 'Image'/'Stamp'/'Knowledge-based authentication' with
t('image')/t('stamp')/t('kba') for i18n consistency
MEDIUM PRIORITY — Dropdown/menu ARIA:
- _navbar.html.erb: aria-controls="user-menu-list" on user menu trigger;
id="user-menu-list" on menu <ul>
MEDIUM PRIORITY — Form grouping:
- storage_settings/index.html.erb: wrap radio buttons in <fieldset><legend>
LOW PRIORITY — Required field indicator:
- mobile_fields.vue: replace tooltip span with <abbr title="required"> pattern
LOW PRIORITY — Keyboard accessibility:
- templates_folders/edit.html.erb: tabindex="0" on folder toggle label
i18n: add download_options key
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
All DaisyUI dropdown content elements had tabindex="0" which put the
entire menu container in the keyboard tab order, causing our :focus-visible
rule to outline the whole dropdown box rather than individual menu items.
Changed to tabindex="-1" in 14 files (3 ERB + 11 Vue):
- submissions_filters/_filter_button.html.erb
- shared/_templates_order_select.html.erb
- submissions/show.html.erb
- template_builder/{payment_settings,field_type,field,builder,
custom_field,upload,google_drive_document_settings,area,
font_modal(x2),field_submitter(x2),mobile_fields}.vue
tabindex="-1" keeps mouse-click focus working (DaisyUI :focus-within
CSS still fires) while removing the container from the Tab order.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Point skip links in form and plain layouts to #tab-pdf (the first
tab button, naturally focusable as a <button>)
- Add tabindex="-1" fallback <div id="tab-pdf"> when has_full_text is
false (scanned PDFs with no extractable text) so the skip link
always has a valid target
- Remove now-unused tabindex="-1" from #scrollbox and #main-content
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Add tabindex="-1" to #scrollbox in submit_form/show so focus lands
there after skip link activation (not just scroll position)
- Add skip link to plain layout (used by submissions/show)
- Add id="main-content" tabindex="-1" to submissions/show outer div
as the skip link target
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- M1: submissions/show.html.erb — aria-hidden on decorative color dot; sr-only text on
colored field overlays (field name + submitter) for screen reader users (WCAG 1.4.1)
- M2: field_submitter.vue — aria-hidden on all decorative color dots; aria-label on
compact mode label (selectedSubmitter name); changed inner button to span (WCAG 1.4.1)
- M8: profile/index.html.erb — inline validation error messages (role="alert") with
aria-describedby + aria-invalid on all profile and password form fields (WCAG 3.3.1)
- M10: Add aria-label to icon-only buttons/links across 7 files:
- field.vue: draw, formula, condition, settings, remove, draw-option buttons
- preview.vue: document condition and reorder buttons
- signature_step.vue: QR toggle (with aria-pressed) and close QR buttons
- text_step.vue: toggle multiline text button
- import_list.vue: preview column data info button
- Add i18n keys: show_qr_code, close_qr_code (submission_form); preview_column_data (template_builder)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
primary color (#e4e0e1) is near-white against the base-100 background
(#faf7f5), giving ~1.1:1 contrast - essentially invisible. Replace with
text-base-content + border-neutral (#291334, ~15.9:1 against base-100).
Active state distinction is now conveyed by border-neutral underline +
font-semibold (not by color alone, satisfying WCAG 1.4.1 Use of Color).
Inactive tabs retain font-medium + border-transparent.
Also remove hover:text-primary from inactive tabs - primary is near-white
so that hover would have made inactive tab text invisible on hover.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
text-base-content/60 (~4.1:1 against base-100) fails the 4.5:1 AA minimum
for normal-weight text. Change inactive tab to text-base-content (full
opacity, ~14:1) so contrast is unambiguously compliant. Visual distinction
between active/inactive now relies on the colored border underline + primary
text color, not opacity dimming. Hover updated to hover:text-primary to
preview the tab's active color before clicking.
Affects: submissions/show, submit_form/show, document_tabs.js, document.vue.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Create PdfTextToHtml heuristic parser (ALL_CAPS→h2, numbered→h3, bullets→ul, body→p)
- Create document-tabs custom element (ARIA APG tab pattern, roving tabindex, localStorage persistence)
- Register document-tabs element in application.js
- Add tab switcher to submissions/show and submit_form/show when all pages have extracted text
- Add text panel with per-page sections to both views
- Fix role="region" bug on sr-only page text divs (excess ARIA landmarks)
- Add 5 new i18n keys: pdf_view, text_view, document_view_options, text_view_disclaimer, signing_fields_below
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Extracts PDF text during upload via Pdfium and stores it in attachment
metadata (pdf.pages_text), then surfaces it in visually-hidden sr-only
regions in both the signing form and submission preview views. Also adds
alt text to template builder page images and ARIA role/label to the
page-container custom element.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Marcelo Paiva
Pete Matsyburka
Alex Turchyn
Pete Matsyburka
Pete Matsyburka
Oleksandr Turchyn
Alex Turchyn