Add a title attribute to sidebar links about ex_doc

[josevalim]

@frankdugan3 I am pushing an option to resize the sidebar but a PR that adds another breakpoint for larger screens is definitely welcome.

[josevalim]

@yasoob a pull request would be welcome.

@zachdaniel there is a feature in ExDoc that allows you to collapse namespaces for cases like yours. :)

[josevalim]

Actually, the breakpoint won't play well with the resizing. 🤔

Perhaps the best option is to store the sidebar width. I will explore this.

[josevalim]

Now it has storage! Please give it a try!

[josevalim]

@yasoob actually, there is an issue in doing that. Screen readers will read both title and content, reading the same content twice. So we probably need a solution that does not rely on title=....

[yasoob]

I am researching if there is a way to use title and make screen readers discard its value. Just thinking out loud here as I am not an accessibility expert. How about setting the aria-label to an empty string and then setting title to the link name? aria-label takes precedence over title according to my research and this way we can get around the issue you mentioned.

[josevalim]

Good call. I did some tests though and always having the title makes it a bit uncomfortable to navigate. Maybe we can add the title only if after a certain number of characters? Or we figure out a way to remove the elipses on mouse-over.

[yasoob]

Regarding removing the elipses on mouse-over, are you envisioning an expanding sidebar when the elipses are removed? I am not sure how I feel about the layout shift that this would cause. Or if you are thinking about the sidebar being scrollable horizontally once the elipses are removed, that would not work because I don't know how the user can scroll horizontally while hovering over the link.

I am personally in favor of the first suggestion you put forward a.k.a putting the title only after certain number of characters. That seems like a decent trade-off. However, I am not sure how big of a fan you are of the inconsistency this could potentially cause (some links having title attribute and some not). I am in favor of this solution but it is your call now 😄

[josevalim]

I guess making the sidebar width configurable is probably the best option here. As it generally solves the problem.

[yasoob]

That is also a good option. We already have the settings modal. Maybe add this option there? However, the discoverability of that feature would be a bit questionable for those who are not aware of the settings modal.

[zachdaniel]

I will make an issue to collapse module names in our hex packages, but it does seem like some kind of "universal" solution would be a good idea. Like being able to click and drag the sidebar to make more room if you're browsing the list, or something along those lines. Thanks for the heads up :)

[frankdugan3]

Or adding a responsive breakpoint so that sidebar gets wider on larger screens. Even on 1080p, the body max size leaves substantial unused space while truncating the menu.

[zachdaniel]

I'll still use the namespacing feature, but I appreciate this change, there are plenty of places including outside of Ash where I've encountered this, and have definitely had room to make the sidebar bigger.