a11y: opacity=1 for navigation, details, actions

[SimpelMe]

Describe the feature you'd like
Disable transitioning opacities while hovering navigations (page, book), details, actions. Have always opacity=1.

Describe the benefits this feature would bring to BookStack users
Currently the contrast for these named elements are to low for many people, as long as they aren't hovering these elements. Setting the opacity for these elements to 1 in general would increase accessibility and fit WCAG and BITV.

Additional context
Currently we set 'Custom HTML Head Content'. But we would appreciate this as an a11y option or default.

<style>
/* increases a11y in Light Mode - h5 is because of comments in footer */
.tri-layout-left-contents>*, .tri-layout-right-contents>*, .breadcrumbs, h5{
    opacity: 1.0 !important;
}
</style>

[ssddanbrown]

Thanks for the suggestion @SimpelMe.

To be honest, I quite like the fading of the secondary elements as it moves focus to the main content until someone needs to interact with those elements. Additionally, I don't want to introduce a slew of options for these kind of specific details.

This sounds like an idea case for the prefers-contrast media query, but it's still draft.

Is there something you find particularly lacking or insufficient in your current custom override solution?

[SimpelMe]

I do like the fading too. But as we think about BookStack as a wiki for potentially many hundreds of employees we will focus for a11y a lot.

Til now I didn't heard about prefers-contrast media query. That looks very interesting and could be a way for us to implement it in the custom override solution too.

To be honest the custom override solution is more than many other software is providing. I'm only afraid of changes in css or class names you will do not knowing what changes customers did and why. So you probably wouldn't focus and test on these changes. But it's an issue we can deal with.

So at least this issue is maybe just a suggestion to others how to increase certain type of a11y if they focus on.

Thanks for your great software and feel free to close this issue.
Regards Simpel

[ssddanbrown]

Just checked in on this again, prefers-contrast is now better supported with Safari, Edge and chrome supporting it, and Firefox has support behind a flag. Therefore I've now added prefers-contrast media queries to prevent the fade-out of the suggested areas for better accessibility. I'm not 100% how controllable the enablement of this media query is for users, it might be inferred by OS settings, but I think we're on the right track by following browser-provided standards to handle this. Once it becomes more mature hopefully it'll be more commonly understood how this gets enabled.

The added queries have been added as part of 096ed72 and will be part of the next release so I'll therefore close this off.

Thanks again for your input @SimpelMe