fix: #3625286 Set the heading font weight to the design system's 600

Fixes #3625286: Heading font weight is 700, but the VBE Stylesheet specifies 600

What was wrong

scss/_bootstrap-variables.scss set $headings-font-weight: 700. The VBE Stylesheet design system puts every heading step on the shared weight/primary/heavy: 600 token — Desktop/Heading/H1 through H6 all specify 600.

Is 600 actually available?

Yes, and this was checked before changing anything rather than assumed. The theme ships Sora as a variable font: fonts/sora/css/sora.css declares font-weight: 400 700. In the browser, document.fonts.check('600 16px sora') returns true and the loaded face reports weight: "400 700". 600 is a real instance, not a synthesised weight.

What this changes

One SCSS variable, 700 → 600. The two compiled declarations that follow from it were produced by a real yarn theme:build, not hand-written:

  • css/base/bootstrap.base.css — the h1…h6 reboot rule
  • css/base/ckeditor5.bootstrap.base.css — the same rule for the editor, keeping WYSIWYG parity

The RTL stylesheets carry no heading weight declaration, so they are untouched. No component SCSS changes.

Verification

Measured in a real browser on a Drupal CMS + Educare install. An h4 carrying .h5 now computes to 18px / line-height 25.2px / weight 600, matching Desktop/Heading/H5 exactly — previously the size and line-height already matched and only the weight was off.

Before/after comparison at 1440px, toggling the weight back to 700 in place and re-measuring every heading box:

page headings page height at 600 at 700 boxes that changed
/ 32 6383px 6383px none
/news 16 4060px 4060px none
/events/upcoming 14 1777px 1821px 1

So it is not purely cosmetic on every page: at 700 the card title "Creative Writing Masterclass" wrapped to a second line and made the listing 44.8px taller. At the design's 600 it fits on one line. That is the only box that moved across the three pages, and it moves in the right direction.

The anonymous axe-core 4.13.0 sweep (wcag2a, wcag2aa, wcag21a, wcag21aa, wcag22aa) stays at 0 violations.

Remaining tasks

  • ➖ The design's Desktop/Body/Bold/Medium is also 600 while Bootstrap's <strong> still renders 700. Out of scope here — this issue is about headings — and worth its own issue.

Checkpoints

  • File an issue
  • Fix: An issue that fixes a bug
  • Reviewed by a human
  • Code review by maintainers

AI-Generated: Yes

Edited by Rajab Natshah

Merge request reports

Loading
Loading