fix: #3628117 Fix right-to-left behaviour of the card slider, live feed ticker, directional icons and letter-spacing

Issue: https://www.drupal.org/project/vartheme_bs5_rightup/issues/3628117

Five commits:

  • card-slider.js: Next and Previous handle the negative scrollLeft of right-to-left scrolling. On an RTL home page Next did nothing (scrollLeft stayed 0); it now moves to -439 and enables Previous, and English still moves to 440.
  • live-feed.scss: mirrored keyframes in RTL so a group always covers the strip (at mid-cycle both groups were off-screen), and the time and title take their direction from their own text (unicode-bidi: plaintext), so "12:00 PM" on an RTL page no longer reads "PM 12:00". A follow-up commit made this change: isolate alone did not.
  • vartheme-rtl.base.scss: arrow-left/right, arrow-up-right and chevron-left/right are mirrored in RTL, which fixes the slider and pager chevrons and the View Show arrow. The login page's box-arrow icons already swap by direction and are not touched.
  • Letter-spacing is normal on RTL taxonomy labels (0.8px before) and display headings. Chromium already ignores tracking on cursive scripts, so Chrome shows no visible change.

Compiled CSS is committed with the SCSS (yarn components:build, yarn theme:build); the build exits 0 even on errors, so the logs were searched for ERROR and none was found.

Verified: pixel comparison of English screenshots, 13 page types at 1440 and 390 before and after, 25 of 26 identical (the 26th is Gin's random login background). Zero axe violations on the RTL pages at both widths.

Not verified: the ticker seam was sampled mid-cycle, not watched through a full loop; tablet widths, Firefox and Safari were not checked. The audio player's play triangle is mirrored in RTL in the source; most guidelines keep media icons unmirrored, so it is left for the maintainers to decide.

Follow-up check with the four theme merge requests (#3628116, #3628117, #3628118, #3628120) merged on one site: a crawl of 152 paths in two languages at 1440 and 390 px (608 page loads) found no WCAG 2.2 AA violation other than target-size on the English Gin login page (also present before these changes), no horizontal overflow and no broken image; the Editoria11y panel, read as an administrator on 24 pages in both languages, flagged only the audio player's manual transcript check. The merge request pipeline finished green.

AI-Generated: Yes

Checkpoints:

  • File an issue
  • Addition/Change/Update/Fix
  • Testing to ensure no regression
  • Automated unit testing coverage
  • Automated functional testing coverage
  • UX/UI designer responsibilities
  • Readability
  • Accessibility
  • Performance
  • Security
  • Developer Documentation
  • User Guide Documentation
  • Reviewed by human
  • Code review by maintainers
  • Full testing and approval
  • Credit contributors
  • Review with the product owner
  • Release notes snippet
  • Release

🤖 Generated with Claude Code

Edited by Rajab Natshah

Merge request reports

Loading
Loading