fix: #3625302 Apply the Share alignment on the flex root so the prop takes effect

The Share component's alignment prop (start | end, default end) has never had any effect. .webshare--horizontal is the flex row, nothing sets justify-content on it, and the alignment rules target the inner .webshare__list, which is sized to its own content and so has nothing to distribute.

This puts the alignment on the root instead, using Bootstrap 5.3's justify-content-{start|end} utility and only for the horizontal orientation (the vertical layout is a column, where justify-content would move items along the block axis). The utilities are writing-mode aware, so RTL needs no second rule.

One file, components/molecules/share/share.twig, +11 lines.

Issue: https://www.drupal.org/project/vartheme_bs5_educare/issues/3625302

Verification

Measured on a fresh Drupal CMS + Educare install at 1440px:

  • Before: the root computed justify-content: normal, last icon right edge 1172 in a column ending at 1388.
  • After: flex-end, last icon right edge 1380.
  • Correct on the event, news and program full pages; no horizontal overflow.

Remaining tasks

  • The now-redundant .webshare--align-* .webshare__list rules could be removed in a follow-up.

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
Edited by Rajab Natshah

Merge request reports

Loading
Loading