dsa-ou / algoesup

Algorithmic essays support: examples, templates, guides, library
https://dsa-ou.github.io/algoesup/
BSD 3-Clause "New" or "Revised" License
2 stars 0 forks source link

Improve text contrast #2

Closed mwermelinger closed 7 months ago

mwermelinger commented 8 months ago

The default Just the Docs style is dark grey 100 on white background and headings in dark grey 300.

To improve readability, try text in dark grey 200 or 250. In latter case, headings should be black, if that's distinguishable. Make PR to check new look before merging to main.

mwermelinger commented 8 months ago

Would be good to also improve Rouge's contrast as it uses light grey for comments and pastel colours for other syntax. Maybe it's a question of changing $code-background-color in the JtD style, rather than Rouge's style sheet. Although the default seems to be light grey 0 (the lightest grey) it actually looks darker in our documentation, e.g. here.

densnow commented 8 months ago

I've pushed a styles branch with some options for custom styling for text and syntax highlighting.

A docs/_sass/color_schemes/algoesup.scss has been added with darkened body text color and blue links (we can change to suit tastes). Also I have used rougify style colorful > colorful.scss to create the base file for the syntax highlighting located at docs/_sass/rouge_schemes/colorful.scss then tweaked a few colors to try and match Jupyter notebooks highlighting style for Python code.

In algoesup.scss you import the the styles with a @import "../_sass/rouge_schemes/colorful".