mirror of
https://github.com/hazemKrimi/personal-website.git
synced 2026-05-01 18:00:26 +00:00
Add global styles component
This commit is contained in:
@@ -0,0 +1,30 @@
|
||||
import { FC, useContext } from 'react';
|
||||
import { createGlobalStyle } from 'styled-components';
|
||||
import { DarkModeContext } from '../components/DarkMode';
|
||||
|
||||
export interface Props {
|
||||
dark: boolean;
|
||||
}
|
||||
|
||||
const Global = createGlobalStyle<Props>`
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Source Code Pro', monospace;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
body {
|
||||
background: ${({ dark }) => (dark ? '#262626' : '#F9F9F9')};
|
||||
color: ${({ dark }) => (dark ? 'white' : 'black')};
|
||||
}
|
||||
`;
|
||||
|
||||
const GlobalStyles: FC = () => {
|
||||
const { dark } = useContext(DarkModeContext);
|
||||
|
||||
return <Global dark={dark} />;
|
||||
};
|
||||
|
||||
export default GlobalStyles;
|
||||
Reference in New Issue
Block a user