[3.0] Theme split (wave 3, part 4) — Give the width-limited wrappers a shared class - #9372
Open
albertlast wants to merge 4 commits into
Open
[3.0] Theme split (wave 3, part 4) — Give the width-limited wrappers a shared class#9372albertlast wants to merge 4 commits into
albertlast wants to merge 4 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>
The rule that keeps the page centred named four different wrappers in one selector, so anything else that wanted the same treatment had to be added to that list. It becomes a class instead, and the width becomes a token. The maintenance and upgrade pages and the profile export each build their own markup but load this stylesheet, so their wrappers get the class too. Without it they would lose the width limit. Signed-off-by: albertlast <mathiaspapealbert@hotmail.com>
albertlast
force-pushed
the
3.0/theme-content-wrapper
branch
from
August 5, 2026 05:56
490c726 to
4be2d75
Compare
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
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 4 of wave 3 of the #7933 split. Stacked on #9371, #9370 and #9369 — the diff of this one is its last commit.
The rule that keeps the page centred named four wrappers in a single selector:
Anything else wanting the same treatment had to be added to that list, and the same list is repeated in
responsive.cssfor the narrow override. It becomes a.content-wrapperclass instead, and the width becomes--wrapper-width. This is what the rest of the header work hangs off: once the wrappers are collapsed, the elements that need the width limit are not the ones named above.Still no visual change. This is the second of the two structural steps, and the reparenting itself comes after it.
Three templates, not one
Themes/default/MaintenanceTemplate.phpand the XSLT inSources/Tasks/ExportProfileData.phpeach build their own markup but load this sameindex.css, so their#header,#wrapperand.inner_wrapelements were being centred by that selector too. They get the class as well; without it the upgrade and maintenance pages and every exported profile would lose the width limit and run the full width of the window.The maintenance page's own
#footerhas no.inner_wrapand so was never centred by this rule. That is left as it is.Verification
Board index captured on the parent branch and again here, at two viewport widths so that both sides of the 720px breakpoint are exercised — the wide one is where
max-width: 1200pxbites and the narrow one is whereresponsive.cssoverrides it towidth: 100%. The whole DOM is walked, recording tag,getBoundingClientRectand 25 computed properties per element, withmax-widthamong them since that is the property that would break if the class failed to apply:composer lintcannot run against the two files with classes in this environment — the customSMF/section_commentsfixer callsarray_first(), which needs PHP 8.5, and the container is on 8.4.php -lpasses on all three files and CI covers the rest.Issues References (Fixes|Related|Closes)
Related to #7933.