fix: align widened content with header grid, sync ToC tooltip state - #52
Merged
Conversation
- .md-nav__source: fixed dark badge colors instead of Material's broken indigo fallback (background-color var was never set for this theme) - .md-content divider and .md-grid width cap: scoped to >=76.25em, they were leaking unwanted margin/border onto mobile - .md-content__inner: drops the 90ch reading cap once a sidebar is collapsed (UCD-180 widen feature), instead of staying pinned to it - .md-main__inner: use padding instead of a one-sided margin override so it still centers via margin:auto like the header, keeping both edges aligned when a sidebar collapses - toc-collapse-toggle.js: sync the tooltip text with the button's actual state, it stayed on "ausblenden" even after the ToC was hidden
- Toggle buttons now sit outside the relevant sidebar (or outside .md-main__inner once collapsed) instead of straddling the divider, with a 20px gap from whichever edge is closer — never overlapping the ToC/nav's own links or the "edit this page" icon - .md-content padding-left: 40px removed, it only existed to clear the old straddling button and left content not flush with the header - .md-content__inner: max-width transitions smoothly now (was jumping instantly between 90ch and an unanimatable `none`), and drops the 90ch cap whenever the ToC sidebar is actually visible, not just when a sidebar has been toggled - Toggle border color: fixed an invalid `border` shorthand that silently dropped the "active" border, and two dark-mode selectors that combined data-md-color-scheme with html[data-ds-...] and could never match since Material sets that attribute on <body>, not <html> — both toggles now use the already scheme-aware var(--md-accent-fg-color) and render identically in light/dark, open/collapsed
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
1 participant
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.
Summary
.md-nav__source(mobile repo badge): fixed dark colors instead of Material's broken indigo fallback.md-contentdivider /.md-gridwidth cap: scoped to>=76.25em, no longer leaking onto mobile.md-content__inner: drops the 90ch reading cap once a sidebar is collapsed (UCD-180 widen feature), so text actually fills the reclaimed space.md-main__inner: padding instead of a one-sided margin override, so it stays centered like the header when a sidebar collapses (previously the content area went flush left while the header stayed centered)toc-collapse-toggle.js: tooltip text now syncs with the button's actual state instead of always saying "ausblenden"Test plan