search

trema-tech / moodle-theme_trema

Theme trema, a Moodle LMS plugin.
https://moodle.org/plugins/theme_trema
GNU General Public License v3.0
40 stars 20 forks source link

Insufficient contrast of default highlighted menu item - accessibility issue #100

Closed michael-milette closed 4 months ago

michael-milette commented 2 years ago

The foreground and background colours are the same. image This is an accessibility and usability issue.

promosyofertas commented 2 years ago

Any color that you choose, it happens the same. Would be great if this were selectable...

promosyofertas commented 2 years ago

I partially solved adding in Raw SCSS: .dropdown-item:hover { background-color: #999600 ; } I'm still trying to find how to change the color for the first one that is always highlighted (using the up/down arrows moves along the menu but with the original color).

rmady commented 2 years ago

Hello @promosyofertas,

@michael-milette told me this issue and I fixed but just for Moodle 4.0, that still in beta now. This issue was solved with the focus-within. I'll add to master ASAP.

This is the code:

.dropdown-item:hover,
    .dropdown-item:focus,
    .dropdown-item:focus-within {
        background-color: lighten($primary, 20%);
        color: choose-contrast-color($primary);
    }

Thank you for your help guys!

michael-milette commented 2 years ago

Thank you! Any chance it can be fixed for currently supported versions of Moodle?

promosyofertas commented 2 years ago

Thank you! Any chance it can be fixed for currently supported versions of Moodle?

@michael-milette, if you add what @rmady posted in Raw SCSS box you can fix it. It's not perfect because is taking the base color for "painting" but it's a good solution.

@rmady, it would be great if this could be selectable in the theme...

michael-milette commented 4 months ago

This will be fixed in the next major release of Trema. In the meantime, please feel free to try the experimental "dev" branch.

Best regards,

Michael