a11y NPM Resource Changed PR-6.2-dev Pending

User tests: Successful: Unsuccessful:

avatar Nikhil-sinhaa
Nikhil-sinhaa
27 Oct 2026

Pull Request resolves #48407.

  • I read the Generative AI policy and my contribution is either not created with the help of AI or is compatible with the policy and GNU/GPL 2 or later.

Summary of Changes

Unchecked checkbox borders were too faint against their surroundings (about 1.7:1), below the 3:1 non-text contrast required by WCAG 1.4.11. Joomla's "High Contrast" user setting did not change them either.

This PR gives checkboxes a border colour of at least 3:1, with separate values for light and dark:

  • Atum, light: --form-check-input-border now uses --template-bg-dark-60 (about 6.3:1 on white). It stays above 3:1 even for a yellow admin hue.
  • Atum, dark: the border is now rgba(255, 255, 255, .5) (about 5.2:1 on the dark card), up from .2.
  • Atum, high contrast: body.a11y_contrast now sets a 2px border in the body text colour, so the setting improves the checkbox.
  • Cassiopeia: $form-check-input-border is now $gray-600 (about 4.7:1 on white), up from the default $gray-400. This fixes the frontend Remember Me checkbox.

The checked state, keyboard focus ring and disabled state are not changed. Disabled controls are exempt from 1.4.11.

Note: this changes every checkbox that uses these variables, for example the row and check-all boxes in list views such as Articles and Users. That overlaps with #48405.

Testing Instructions

  1. Apply the patch and rebuild the CSS (npm run build), then hard-refresh the browser.
  2. Backend, light: go to System → Update → Joomla → Upload & Update. Look at the "I'm aware that a backup before any update is highly recommended" checkbox.
  3. Backend, dark: switch Atum to the dark colour scheme and look at the same checkbox.
  4. High contrast: go to User Menu → Accessibility Settings and enable "High Contrast". Check the checkbox again in light and dark.
  5. Frontend: on a Cassiopeia site with the login module and the Remember Me plugin enabled, look at the "Remember Me" checkbox.
  6. Optional: tick the checkbox and tab to it to confirm the checked state and focus ring still look right. Look at the list views (Articles, Users).

Do not upload an update package or log in.

Actual result BEFORE applying this Pull Request

before before before

Expected result AFTER applying this Pull Request

after after after

Link to documentations

Please select:

  • Documentation link for guide.joomla.org:

  • No documentation changes for guide.joomla.org needed

  • Pull Request link for manual.joomla.org:

  • No documentation changes for manual.joomla.org needed

avatar Nikhil-sinhaa Nikhil-sinhaa - open - 27 Oct 2026
avatar Nikhil-sinhaa Nikhil-sinhaa - change - 27 Oct 2026
Status New ⇒ Pending
avatar joomla-cms-bot joomla-cms-bot - change - 27 Oct 2026
Category ⇒ NPM Change
avatar exlemor exlemor - test_item - 28 Oct 2026 - Tested successfully
avatar exlemor
exlemor - comment - 28 Oct 2026

I have tested this item ✅ successfully on c2d53c9

I have successfully tested this! @Nikhil-sinhaa Thank you for the fixes.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/48711.

avatar exlemor
exlemor - comment - 28 Oct 2026

I have tested this item ✅ successfully on c2d53c9

I have successfully tested this! @Nikhil-sinhaa Thank you for the fixes.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/48711.

avatar Nikhil-sinhaa Nikhil-sinhaa - change - 28 Oct 2026
Labels Added: a11y NPM Resource Changed PR-6.2-dev
avatar Nikhil-sinhaa
Nikhil-sinhaa - comment - 28 Oct 2026

The lint:js job failed with sh: 1: eslint: not found (exit code 127), which looks like a CI cache/environment issue rather than a code problem. lint:js and lint:css both pass locally. The edge/MySQL system test failure also looks unrelated, since this PR only changes SCSS. Could a maintainer please re-run the failed jobs?

avatar mbeganyi-a11y mbeganyi-a11y - test_item - 30 Oct 2026 - Tested successfully
avatar mbeganyi-a11y
mbeganyi-a11y - comment - 30 Oct 2026

I have tested this item ✅ successfully on 5076f0b

Very nice, @Nikhil-sinhaa; thank you for your contribution! This is significantly better.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/48711.

avatar mbeganyi-a11y
mbeganyi-a11y - comment - 30 Oct 2026

I have tested this item ✅ successfully on 5076f0b

Very nice, @Nikhil-sinhaa; thank you for your contribution! This is significantly better.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/48711.

avatar Nikhil-sinhaa
Nikhil-sinhaa - comment - 30 Oct 2026

@mbeganyi-a11y @exlemor Thank you for Testing

Add a Comment

Login with GitHub to post a comment