[3.0] Theme split (wave 3, part 3) — Use HTML landmark elements for the page chrome - #9371
Open
albertlast wants to merge 3 commits into
Open
[3.0] Theme split (wave 3, part 3) — Use HTML landmark elements for the page chrome#9371albertlast wants to merge 3 commits into
albertlast wants to merge 3 commits into
Conversation
The remaining theme parts are built on two nine-step ramps derived from a single hue each, rather than on individually chosen colours. Adding them ahead of those parts keeps each of them to the tokens it actually introduces. Nothing references the ramps yet and no existing token is repointed at them, so this changes nothing that is rendered. Signed-off-by: albertlast <mathiaspapealbert@hotmail.com>
The linktree becomes a nav landmark wrapping an ordered list, since the trail is ordered, and carries schema.org BreadcrumbList microdata so a search engine can read it. Layout moves from floats to flexbox, which makes the two rtl.css rules for it redundant. Keeps the HTML entity dividers rather than the icon font used on the theme branch. Nothing in the default theme uses Font Awesome yet, and the bundled local copy has no @font-face rule, so a forum with fontawesome_source set to local would get no divider at all. Keeps emitting the .last class as well, so anything styling it still works, even though :last-child now covers it. Signed-off-by: albertlast <mathiaspapealbert@hotmail.com>
The header, main menu, main content area and footer become header, nav, main and footer instead of div. That gives assistive technology real landmarks to navigate by, rather than a page that is one undifferentiated region. Every selector for these is by id, so nothing in the stylesheets or the scripts has to change, and all four elements are block level already. Signed-off-by: albertlast <mathiaspapealbert@hotmail.com>
This was referenced Aug 5, 2026
Closed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Part 3 of wave 3 of the #7933 split. Stacked on #9370, which is stacked on #9369 — the diff of this one is its last commit.
The page chrome becomes HTML landmark elements:
<header id="header">,<nav id="main_menu">,<main id="main_content_section">and<footer id="footer">, in place of thedivs that carried those ids before. Someone using a screen reader gets regions to jump between instead of one undifferentiated page.This is the structural half of the header work, deliberately separated from the visual half. The theme branch does the reparenting and the restyling in the same change; splitting them means the part that moves boxes around can be reviewed on the evidence that it moves nothing.
Why nothing changes
Every rule for these four elements selects by id, so no selector in
index.css,responsive.css,rtl.cssor any script had to change. All four elements are block level by default, and the reset appliesbox-sizing,marginandpaddingthrough*, so they are already covered.The other templates only ever reference
#main_content_sectionas an anchor target for the "Go up" links, which still resolves.Verification
Board index, a board and a topic, captured on the parent branch and again here, walking the whole DOM and recording for every element its tag, its
getBoundingClientRect, and 24 computed properties covering colour, background, font, all four margins and paddings, border, radius, shadow, alignment, float and line height:The twelve are the four intended elements on each of the three pages, and nothing else:
Worth saying how the first attempt at this went wrong, since it is the same trap that bit #9333: I switched branches to capture the baseline while the edits were still uncommitted, so they came along, and both captures showed the new markup. The run above is from a committed tree, with the served HTML checked on each side before capturing.
Issues References (Fixes|Related|Closes)
Related to #7933.