Hey guys! I'm running a fresh instance of payload, using next-payload and something is wrong with light mode :/
As far as I can tell, the problem is here:
body {
color: rgb(var(--foreground-rgb));
background: linear-gradient( to bottom, transparent, rgb(var(--background-end-rgb)) ) rgb(var(--background-start-rgb));
}
body
is using the css vars
background-start-rgb
and
background-end-rgb
But this vars are set by a media query that reads not html's data-theme (which is now "light") but
(prefers-color-scheme: dark)
, that comes from my OS:
@media (prefers-color-scheme: dark)
:root {
--background-start-rgb: 0, 0, 0;
--background-end-rgb: 0, 0, 0;
}
I've already used payload in a couple other projects, that did not have this issue
Does someone else have this problem?
ok, so 🤡 the culprit was Next's starter global css
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.