Improve contrast in docs.julialang.org menu


#1

I love Julia’s docs and use them a lot But struggle to read the topics menu. Am I the only one that has trouble with this? Is it a good idea to make a style adjustment there? The problem is that the text is light gray and the background is a slightly lighter gray. On hover or select the style is a little easier to see but It would be nice to be able to see the options without having to hover the mouse over every option.


#2

I’ve thought the same but hadn’t yet got round to filing an issue (probably with Documenter.jl?). Also, I think there’s too little hierarchical structure, i.e. there are 65 top-level items including some ‘apparent’ duplications (eg two “Strings”). But I think changes are already in the works…


#3

Good point!

…and on a somewhat unrelated thought, it would be nice to be able to do a key word search or something like that to find packages for specific purposes. Last night, I noticed that comments of one package author that didn’t know that another similar package was being developed. I have found myself reading through the “1226 registered packages” listing to see if packages exist for one purpose or another.


#4

Just a thought… although at the moment I am a bit busy to offer my help on this. Since many of julia’s users are into data science, it would be pretty useful and impressive IMO to have something like a D3 visualization of the packages in some sort of cluster-layout. I was thinking that the packages could be clustered based on the vocabulary found in the packages or their documentation.

Sorry, I guess this is getting off the original topic here.


#5

Agreed. The current style used by Documenter is just carried over from the original Sphinx theme, and I’m currently working on making it a bit more readable since the colours are indeed slightly difficult to read at times.

Yes, changes to how we display the nav menu are also in the works; the current theme doesn’t really handle deeply nested content that well I think. Being able to expand/collapse different parts of the tree would go a long way to making it more manageable I think.

Anyone will any other feedback on these kinds of things are more than welcome to add their suggestions here (or on the Documenter issue tracker) and I’ll try to incorporate them if possible.


#6

Would it be possible to include some version navigation? Google often takes me to en/release-0.4/manual/..., and usually I want to go to en/stable/manual/... instead. It would be cool if there were a link/button/menu to choose the version.


#7

This one has a version selector:

http://docs.julialang.org/en/latest/


#8

And should get translation selections! I think the translation selection widget should just be in the same spot:

(slightly offtopic, but I think something that should be brought to light)


#9

I don’t think anything complicated needs done to improve the contrast but here are a couple of simple options.

If you want to change the background, just changing nav.toc { background-color: #fcfcfc; } is an option that makes a huge difference without investing much time. The question is what color should be applied?

Alternatively the text color in both the menu items and sub-items could be changed with this:
nav.toc ul { color: #b3b3b3; }
no need to change the sub items because they inherit their color property
nav.toc ul .internal a { color: inherit; }

I really like to use the controls in the browser tools to play around with the colors before committing to anything (Most probably know this but just press Ctrl + shift + i to open the developer tools and play with the styles).


#10

Should this be the one linked from www.julialang.org ?


#11

It’s been noted before that “latest” is misleading, because “in development” or “currently not 100% ready for production use” might be more accurate descriptions. (https://github.com/JuliaDocs/Documenter.jl/issues/337) Probably sticking with stable 0.5 would be better for end users…


#12

I’d propose the following to help with the contrast:

The items with a darker background are the ones with mouseover.

Here are the changes to the style and an example full site build.