Skip to content

Spoiler text has poor visibility when using the built-in light theme #1079

Description

@TheEyesightDim

Describe the bug

When viewing revealed spoiler text in the built-in light mode theme, the text color contrast with the spoiler block background color is very difficult to read. The current contrast between the text and background is only about 3.66:1, where it would ideally be 4.5:1 or greater. When using dark mode, the spoiler block background is the same color, but the text is light, and much easier to read there.

WebAIM Contrast Checker

Reproduction

  1. Change the app theme to the built in light theme.
  2. Write a spoiler text message.
  3. Click the spoiler box to reveal the text.
  4. The text color has a poor contrast ratio compared to the background

Expected behavior

I expected the text color and spoiler text background to have greater contrast, i.e. at least a contrast ratio of 4.5:1 as per the WCAG level AA recommendation for contrast of normal size text.

Platform and versions

Linux Gentoo
Firefox 152
Sable v1.19.4 (d8938a6)
tchncs.de homeserver

Additional context

While I know this could basically be resolved with a custom theme, I think it would be good if the defaults are also good for basic readability. Ideally, the contrast would be higher than the WCAG AA level, very light text on dark, or dark on light.

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions