graphql.github.io
graphql.github.io copied to clipboard
Selecting text in dark theme is hiding the texts with links
Description
Selecting text in dark theme is hiding the texts with links
Steps to Reproduce
Set website theme as dark mode or system (with dark mode enabled)
Expected Result
Texts with links should be readable even after selection
Actual Result
Text with links gets hidden upon selection
Additional Context
After investigating in dev tools below style looks as cause
:is(html[class~=dark] *)::selection {
CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
--tw-bg-opacity: 1;
background-color: rgb(225 0 152 / var(--tw-bg-opacity, 1));
}
If I reduce --tw-bg-opacity property value to 0.5 from 1, text becomes readable.
graphql.github.io/src/globals.css
::selection {
@apply bg-primary/50 dark:bg-primary;
}
is this correct place to apply fix?
cc @dimaMachina ^