Skip to content

GitLab

dotstatsuite-data-explorer
dotstatsuite-data-explorer
Closed
Opened by SSandrine@SSandrineMaintainer7 of 7 tasks completed7/7 tasks
Report abuse New issue

Adjust the theme and some components to reach the WCAG AA contrast level

To reach the AA contrast level, 2 main colors of the current theme of the DE and some components have to be changed.

Color changes The Primary (#0965c1) color will be replaced by the same color than the current Primary-Dark (#0549ab) For information, the Primary (#0965c1) color will now be available under the Secondary accent-3 (#0965c1) color.

The TXT-light (#666666) color is replaced by the #444 color.

The muted color has been changed to #666 (instead of #aaaaaa).

Component changes

  • The appearance of the selected filters number in the green background has been adjusted. Instead of displaying the number with a green background, a green frame will be used and the text color of the number will change. image
  • The other change is the highlight appearance for a free-text search. The green color which does not offer a proper contrast with a white background will be replaced by a yellow highlight with a green underline. image
  • The "Facet hover and active", "Facet active and hover", "Primary hover" buttons have changed. The text color is now TXT-dark instead of white.
  • The color of the menu icons is now "Primary" instead of #5c7080 image
  • The search bar background color is the same but the definition changed in the UI documentation taking into account the new theme: secondary accent-3 color.
  • The homepage changes are the "----- or Browse by ----" text which is now white Neutral lighten-5.
  • Update the design of the footnotes (upper script of the flags or footnotes icon underlined by the tooltip line, displayed on the right side of the data)
Edited by Mike Velluet