search

asterisk / documentation

The Asterisk Documentation Project.
https://docs.asterisk.org/
Other
26 stars 22 forks source link

Missing sidebar TOC on large screens #84

Open Wryhder opened 1 month ago

Wryhder commented 1 month ago

It feels a bit awkward to constantly click the hamburger icon to navigate the doc site on a PC. I'd like to suggest adding a sidebar table of contents (TOC) for large screens and only introducing the hamburger menu on smaller screens. Having a prominent TOC on large screens should also help (re-)orient a user regarding their current place in the docs without needing to click the icon.

missing sidebar toc on large screens-fundamentals-asterisk architecture

Wryhder commented 1 month ago

I'd love to create a PR for this if accepted as a valid issue.

gtjoseph commented 1 month ago

Welcome! The left side navigation bar should automatically show when the browser window is wide enough to display it which seems to be about 1500 pixels. What size screen do you have and what happens if you maximize your browser?

Wryhder commented 1 month ago

Welcome! The left side navigation bar should automatically show when the browser window is wide enough to display it which seems to be about 1500 pixels. What size screen do you have and what happens if you maximize your browser?

Ah, my bad. I didn't realize there was a sidebar.

My browser is always maxed. I'm not sure if these are the relevant details you're asking for. This is from my browser console:

> window.screen.width 1172 > window.innerWidth 1164

My PC is a 14-inch (1920 x 1080 display), which is relatively small, but it's usually large enough to fit most website's content and TOCs. Could the 1500 be adjusted to accommodate smaller sizes than this number?

gtjoseph commented 1 month ago

Interesting. If you're browser is maximized on a 1920x1080 display, then window.screen.width should be 1920. The TOC innerWidth cutoff looks to be about 1220 but let me see if I can control that.

Wryhder commented 1 month ago

Interesting. If you're browser is maximized on a 1920x1080 display, then window.screen.width should be 1920.

This made me curious so I checked and I was using 150% scaling. Changing it to 100% gave me these values in the console:

> window.screen.width 1751 > window.innerWidth 1746

The sidebar also showed up for me on the doc site. However, at this scale icons and text on my screen are too small for comfort, so I'm back to 150.

The TOC innerWidth cutoff looks to be about 1220 but let me see if I can control that.

I'd appreciate it if you make the change, but please free to close the issue (as it seems less valid than I thought when I opened it).

gtjoseph commented 1 month ago

Gotcha. I'm still looking. Maybe there's also a buried option somewhere to allow the user to always show the sidebar.