|
- import { createGlobalStyle } from 'styled-components'
-
- const GlobalStyle = createGlobalStyle({
- ':root': {
- '--color-bg': 'white',
- '--color-fg': 'black',
- color: 'var(--color-fg, black)',
- backgroundColor: 'var(--color-bg, white)',
- fontFamily: 'system-ui, sans-serif',
- },
- 'body': {
- margin: 0,
- },
- 'a': {
- color: 'inherit',
- },
- '@media (prefers-color-scheme: dark)': {
- ':root': {
- '--color-bg': 'black',
- '--color-fg': 'white',
- color: 'var(--color-fg, white)',
- backgroundColor: 'var(--color-bg, black)',
- },
- },
- })
-
- const MyApp = ({Component, pageProps}) => {
- return (
- <>
- <GlobalStyle/>
- <Component {...pageProps} />
- </>
- )
- }
-
- export default MyApp;
|