doc: make documentation menu background transparent

[tawseefnabi]

• Set transparent background for menu in both light and dark modes
• Adjusted text colors for better contrast
• Light mode: rgba(0, 0, 0, 0.1) background with dark text
• Dark mode: rgba(255, 255, 255, 0.1) background with white text

[nodejs-github-bot]

Review requested:

• @nodejs/nodejs-website

[avivkeller]

Can you provide a before/after screenshot comparison?

[tawseefnabi]

Hi @avivkeller
this is before

this is after changes

[avivkeller]

I just checked the current documentation:

I don't see an issue

[bjohansebas]

I don’t see the issue either. What browser are you using @tawseefnabi ?

[tawseefnabi]

I don’t see the issue either. What browser are you using @tawseefnabi ?

@bjohansebas @avivkeller
issue was reported here
#59282

[avivkeller]

Yes, we see that, however, we can't reproduce it, can you?

[gurgunday]

I can't reproduce it either

[dario-piotrowicz]

I can reproduce the issue, it seems to happen only on screens with width <= 600px:

[dario-piotrowicz]

Thanks for the PR @tawseefnabi 🙂

Have you considered simply adding a z-index: 1 to the picker class instead?

node/doc/api_assets/style.css

Line 229 in aac7925

.picker {