fix: #3625659 Screen-reader context for generic links, new-tab warnings, and the footer and header per the design

Rajab Natshahrequested to merge
issue/vartheme_bs5_horizonaid-3625659:3625659-a11y-footer-header into 1.0.x

Issue: https://www.drupal.org/project/vartheme_bs5_horizonaid/issues/3625659

  • Learn More links read the card title to screen readers, through a new optional label_context button prop. The visible text is unchanged.
  • External links open in a new tab with rel="noopener noreferrer" and a hidden "(opens in a new tab)".
  • Footer: social icons in design order (Facebook, Instagram, LinkedIn, X), one Quicklinks list, underline only under the label, visible focus. Header matches the design.
  • User profile: "Member for" is an h3 styled as h4, and the avatar link has a name.

Tested on 87 pages across fresh Drupal CMS and Varbase installs: 0 Editoria11y findings, axe WCAG 2.2 AA serious 0.

Remaining tasks

  • Merge before the Horizon Aid recipe MR (#3625661), which uses label_context.

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

AI-Generated: Yes

🤖 Generated with Claude Code

Edited by Rajab Natshah

Merge request reports