Forum Discussion
CaseyLim
3 years agoCommunity Member
Rise note block not meeting accessibility contrast with a URL added
Hi all,
I have a theme that uses a blue colour #0085ac
The note blocks render out as a slightly lighter blue. When I add hyperlink to the text inside the note block it also becomes blue. The contrast drops significantly and there is no way to set the note block to a different colour!
Relevant CSS:
.brand--background-transparent {
background-color: #0085ac1A !important;
background-color: var(--background-color-accent-transparent) !important;
}
The contrast with blue + light blue background is 3.7. Certainly not meeting WCAG 2.0 aa standards.
Some suggestions:
- If themes include a colour palette, have an options to set the note block as other theme colours (doesnt guarentee it will be contrasted enough, but if the dev team uses SCSS there may be a mixin to darken/lighten colours?)
- additional colour picker for note block backgrounds
- KarlMullerCommunity Member
Hi Casey,
The color of the Note block is determined by the accent color that you selected for your course.
Here are some suggestions for Note block alternatives:
https://community.articulate.com/discussions/building-better-courses/better-note-boxes-in-rise