react-notion-x render dark-mode by a property named darkMode. if i want set light\dark mode automatically by browser behavior from window.matchMedia('(prefers-color-scheme: dark)').matches. i should managed it by a state:
The result is that light-mode will be render at first time, and then the dark-mode view will be rendered Immediately followed.
I think it's a bad case for users extremely in deep-night.
So, why not set the default css variable by media-query and use the darkMode property to override it. like this:
react-notion-x render dark-mode by a property named darkMode. if i want set light\dark mode automatically by browser behavior from
window.matchMedia('(prefers-color-scheme: dark)').matches
. i should managed it by a state:The result is that light-mode will be render at first time, and then the dark-mode view will be rendered Immediately followed. I think it's a bad case for users extremely in deep-night.
So, why not set the default css variable by media-query and use the darkMode property to override it. like this: