Fix accessibility issues

[pfitzseb]

The goal of this is to make sure Documenter-generated docs conform to WCAG 2.0.
I'm opening this early so I can document the changes as I work my way through them, which should hopefully make review a bit easier.

Color contrast

Light theme Version contrast

From: Contrast ratio 3.93

To: Contrast ratio 5.26

Dark theme code contrast

From: Contrast ratio 3.55

To: Contrast ratio 11.49

Elements

Nested lists in content

Currently, nested lists are rendered as

<ul>
    <li><a href="lib/public/#Public-Documentation">Public Documentation</a></li>
    <ul>
        <li><a href="lib/public/#Contents">Contents</a></li>
        <li><a href="lib/public/#Index">Index</a></li>
        <li><a href="lib/public/#Public-Interface">Public Interface</a></li>
        <li><a href="lib/public/#DocumenterTools">DocumenterTools</a></li>
    </ul>
</ul>

Having a ul as the direct child of another ul is invalid, so 01fb501 changes that to

<ul>
    <li><a href="lib/public/#Public-Documentation">Public Documentation</a></li>
    <li class="no-marker">
        <ul>
            <li><a href="lib/public/#Contents">Contents</a></li>
            <li><a href="lib/public/#Index">Index</a></li>
            <li><a href="lib/public/#Public-Interface">Public Interface</a></li>
            <li><a href="lib/public/#DocumenterTools">DocumenterTools</a></li>
        </ul>
    </li>
</ul>

without any difference in presentation.

Focus handling

Source link

The source link is not shown when tabbing through the page content. This PR will show the button at full opacity when it's focused

and at 0.2 opacity when something in the .docstring container is focused:

[kimikage]

This is off-topic, but for consistency, I think it would be better to remove the dependency on the "darkly" theme, which also changes the font size of menus and admonitions.
I haven't checked the impact on plugins, but removing the darkly is not so hard.

[mortenpi]

Sorry for getting around to this earlier, but these changes all LGTM. Thanks @pfitzseb!

I'd be happy to merge this in it's current form if you don't have additional fixes right now, since I think it's already an improvement.

This is off-topic, but for consistency, I think it would be better to remove the dependency on the "darkly" theme, which also changes the font size of menus and admonitions. I haven't checked the impact on plugins, but removing the darkly is not so hard.

Darkly (kinda) is the current dark theme.. so it would have to be replaced with something. So when you say "remove", do you mean reducing the current dark theme down to something that would just override the colors basically? If yes, then I would support that completely --- just dropping Darkly in was kind of a shortcut to get a working dark theme in quickly, but it's definitely not ideal.

[pfitzseb]

Yeah, I don't have any immediate plans to work on this further. There are some issues related to duplicate header ids, but I haven't yet have time to look into those.

[sairus7]

I just paste here messages from Slack. Please open images in new pane to see them in original ratio:

I can't get rid of the feeling that dark documenter theme is harder to read than light one. Font looks thicker and red code lines look too dark:

And for comparison of dark themes - from top to bottom:

1. Julia docs
2. Slack text
3. GitHub markdown

Looks like julia docs have more contrast, and bold text is blurry

[fredrikekre]

Good to go? Perhaps worth adding a note in the changelog?

[pfitzseb]

Yup, good to go.