Fixed truncated dropdown menu

[sarzz2]

fixes #1037

Summary

In the "Sub-Articles" section of the "Contributing" page, when the dropdown menu is expanded, some section names are cut off at the right edge of the page making user scroll horizontally.

Description of changes

removed nowrap property and adjusted CSS of the subarticle to make it fit on the page

I confirm I have:

• Joined the Python Discord community
• Read the Code of Conduct and agree to it
• I have discussed implementing this feature on the relevant service (Discord, GitHub, etc.)

[netlify]

✅ Deploy Preview for pydis-static ready!

Name	Link
🔨 Latest commit	787609c
🔍 Latest deploy log	https://app.netlify.com/sites/pydis-static/deploys/6599e67b66116000089a3e5e
😎 Deploy Preview	https://deploy-preview-1138--pydis-static.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[coveralls]

coverage: 100.0%. remained the same
when pulling 787609c on sarzz2:main
into a2d6103 on python-discord:main.

[hedyhli]

Thank you! This was bothering me for a long time.

One problem though, this doesn't fix it on mobile:

Maybe it's out of scope, I could fix this case in another PR.

However, here's my idea:

We can add two lines to the max width media query (in the same file), so the dropdown menu can then be fixed on the right edge:

On line 12, something like this:

.dropdown-menu {
  left: unset;
  right: 0;
}

What do you think?

[sarzz2]

works fine @hedyhli committed the changes.

[wookie184]

All seems good to me, thanks

[hedyhli]

Works beautifully 👍