Skip to content

[css-flexbox] Example 4 (for collapsed flex items) is unreadable in dark mode #6387

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
dholbert opened this issue Jun 16, 2021 · 1 comment
Closed
Labels
css-flexbox-1 Current Work

Comments

@dholbert
Copy link
Member

STEPS TO REPRODUCE:
(1) Set your OS to use a dark theme (to trigger the dark-mode rendering for CSSWG drafts)
(2) View Example 4 in the flexbox ED, roughly here:
https://drafts.csswg.org/css-flexbox-1/#collapsed-flex-item

ACTUAL RESULTS:
The example has ~unreadable light-gray text on a white background. Screenshot:
screenshot of Example 4

EXPECTED RESULTS:
Readable text in the example.

@dholbert dholbert added the css-flexbox-1 Current Work label Jun 16, 2021
@dholbert
Copy link
Member Author

It looks like this is because:

  • there's a global dark-mode switch that changes color to the light-gray color
  • the example manually sets background: white for this section, but does not set color, so it's at the mercy of its inherited color to determine whether the text is readable over its white background or not.

The example probably wants to set color: black alongside its background:white, I presume. (Or it wants to be rewritten to avoid using background at all.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
css-flexbox-1 Current Work
Projects
None yet
Development

No branches or pull requests

1 participant