Glossary entries cannot be linked to individually #44

Context

There is no way to send somebody a link to the definition of "upstream". Every entry is rendered without an id, so the whole page is the smallest thing you can link to.

What to change

Files: js/glossary.js, css/components.css

Requirements:

• Give each rendered entry an id derived from its term — Pull request becomes term-pull-request
• Lower-case it, replace spaces with hyphens, strip anything that is not a letter, number or hyphen
• Add a small anchor link on each heading so the URL can be copied
• The anchor needs an accessible name; a bare # tells a screen reader nothing

Acceptance criteria

• Every entry has a unique, predictable id
• Clicking the anchor puts that term's URL in the address bar
• Loading that URL directly scrolls to the right entry
• The anchor has an accessible name
• Two terms could never collide on the same id

How to verify locally

python3 -m http.server 8000

Then open http://localhost:8000.

Difficulty

Beginner, with one thing to think about: what happens to a term containing a full stop, like .gitignore.

New here? Comment /claim on this issue and a bot will assign it to you. Then read CONTRIBUTING.md.

Stuck at any point? Comment here saying what you have tried and where it stopped working — that is not an admission of failure, it is how we find out the instructions were unclear. You can also come to a PR Debug Clinic (Oct 12 or Oct 21).