-
Notifications
You must be signed in to change notification settings - Fork 509
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(client): place hash before headings #8532
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thank you! Some quick initial thoughts
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Some tiny tweaks, then we're good to go!
Co-authored-by: Leo McArdle <leo@mca.is>
Co-authored-by: Leo McArdle <leo@mca.is>
Co-authored-by: Leo McArdle <leo@mca.is>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
fantastic, thank you!
* upstream/main: (251 commits) chore(deps-dev): bump typescript from 4.9.5 to 5.0.3 in /client/pwa (mdn#8547) chore(deps-dev): bump typescript from 4.9.5 to 5.0.3 (mdn#8543) chore(deps-dev): bump postcss-preset-env from 8.2.0 to 8.3.0 (mdn#8561) chore(deps-dev): bump @types/react from 18.0.31 to 18.0.32 (mdn#8560) chore(advertising): update copies (mdn#8562) fix(client): place hash before headings (mdn#8532) chore(deps-dev): bump ts-jest from 29.0.5 to 29.1.0 (mdn#8559) chore(deps-dev): bump black from 23.1.0 to 23.3.0 in /deployer (mdn#8555) chore(deps-dev): bump webpack-dev-server from 4.13.1 to 4.13.2 (mdn#8558) chore(deps-dev): bump swr from 2.1.1 to 2.1.2 (mdn#8556) chore(deps): bump boto3 from 1.26.99 to 1.26.104 in /deployer (mdn#8557) chore(deps-dev): bump black in /testing/integration (mdn#8554) ci(stage-build): rsync with -j html,json,txt (mdn#8549) ci(stage-build): rsync with -c (mdn#8548) chore(deps-dev): bump react-router and react-router-dom from 6.9.0 to 6.10.0 (mdn#8534) chore(deps-dev): bump @babel/preset-env from 7.20.2 to 7.21.4 (mdn#8544) chore(deps-dev): bump tailwindcss from 3.3.0 to 3.3.1 (mdn#8546) chore(deps): bump @mdn/browser-compat-data from 5.2.46 to 5.2.47 (mdn#8545) chore(deps-dev): bump @babel/core from 7.21.3 to 7.21.4 (mdn#8542) fix(docs): make icons in good/bad examples float (mdn#8531) ...
Summary
Fixes #6647.
Problem
This PR places the hash in front of section headings to make it stay on the same line.
Solution
This PR uses absolutely-positioned
::before
pseudo-elements to generate the hash, andalign-items: center
to center it.Alternative:
Put the hash in
::marker
. (It's less optimal in that::marker
inheritstext-decoration
from its parent, which cannot be nullified.)Screenshots
Before
After