diff --git a/src/layouts/white/White.jsx b/src/layouts/white/White.jsx
index 9ef35f0..b81fa3d 100644
--- a/src/layouts/white/White.jsx
+++ b/src/layouts/white/White.jsx
@@ -1,11 +1,11 @@
-import React, { useState } from 'react';
+import React, { useContext } from 'react';
import { Container } from '@material-ui/core';
import {
ThemeProvider,
createMuiTheme,
makeStyles,
- responsiveFontSizes,
} from '@material-ui/core/styles';
+import {ThemeContext} from '../../App'
import Footer from './components/footer';
import Header from './components/header';
@@ -23,30 +23,26 @@ const useStyles = makeStyles((theme) => ({
},
}));
+
const White = (props) => {
const { children } = props;
const classes = useStyles();
- const [darkMode, setDarkMode] = useState(true);
+ const { darkMode} = useContext(ThemeContext);
let theme = createMuiTheme({
typography: {
fontFamily: 'Yeon Sung',
transform: 'matrix(1, 0, 0, 1, 0, 0)',
- // h1: {
- // // marginLeft: '-.5rem',
- // paddingLeft: 0,
- // },
+
},
palette: {
type: darkMode ? 'dark' : 'light',
},
});
- theme = responsiveFontSizes(theme);
-
return (
-
+
{children}
diff --git a/src/layouts/white/components/header/Header.jsx b/src/layouts/white/components/header/Header.jsx
index e04c749..5e9f8ca 100644
--- a/src/layouts/white/components/header/Header.jsx
+++ b/src/layouts/white/components/header/Header.jsx
@@ -8,33 +8,31 @@ import {
Breadcrumbs,
Link as MaterialLink,
Grid,
+ IconButton
} from '@material-ui/core';
import DarkModeToogle from './darkModeToogle'
-import ArtTrackOutlinedIcon from '@material-ui/icons/ArtTrackOutlined';
import { makeStyles } from '@material-ui/styles';
import HideOnScroll from '../../../../common/hideOnScroll'
+import ThreeSixtyOutlinedIcon from '@material-ui/icons/ThreeSixtyOutlined';
const useStyles = makeStyles((theme) => ({
appBar: {
position: 'fixed',
zIndex: 1301,
- backgroundColor: 'transparent',
+ background: 'transparent',
+ [theme.breakpoints.down('lg')]: {
+ backgroundColor: theme.palette.background.default,
+ },
},
name: {
textTransform: 'uppercase',
letterSpacing: '.5rem',
- },
- white: {
- color: "#fff",
- },
- black: {
- color: "#000",
- },
+ }
}));
-const handleClick = (event) => {
+const handleScrollDown = (event) => {
event.preventDefault();
const anchor = (event.target.ownerDocument || document).querySelector(
'#footer'
@@ -45,10 +43,8 @@ const handleClick = (event) => {
}
};
-const Header = (props) => {
+const Header = () => {
const classes = useStyles();
- const { darkMode, setDarkMode } = props;
-
return (
<>
@@ -70,7 +66,7 @@ const Header = (props) => {
About
@@ -78,13 +74,12 @@ const Header = (props) => {
-
+
-
-
+
+
+
+
diff --git a/src/layouts/white/components/header/darkModeToogle/DarkModeToogle.jsx b/src/layouts/white/components/header/darkModeToogle/DarkModeToogle.jsx
index c33f60a..880b42a 100644
--- a/src/layouts/white/components/header/darkModeToogle/DarkModeToogle.jsx
+++ b/src/layouts/white/components/header/darkModeToogle/DarkModeToogle.jsx
@@ -1,29 +1,22 @@
-import React from 'react';
-import { makeStyles } from '@material-ui/styles';
+import React,{useContext} from 'react';
+import {IconButton} from '@material-ui/core'
+import {ThemeContext} from '../../../../../App'
import WbSunnyOutlinedIcon from '@material-ui/icons/WbSunnyOutlined';
import NightsStayOutlinedIcon from '@material-ui/icons/NightsStayOutlined';
+const DarkModeToogle = () => {
-const useStyles = makeStyles((theme) => ({
- white: {
- color: "#fff",
- marginRight:'1rem'
-},
-black: {
- color: "#000",
- marginRight:'1rem'
-},
-}));
-
-const DarkModeToogle = (props) => {
- const classes = useStyles();
- const { darkMode, setDarkMode } = props;
+ const { darkMode, setDarkMode } = useContext(ThemeContext);
+ const icon = darkMode ?
+ :
return (
- setDarkMode(!darkMode)}>
- {darkMode ?
- : }
-
+ setDarkMode(!darkMode)}
+ >
+ {icon}
+
);
};
diff --git a/src/layouts/white/components/header/navigation/Navigation.jsx b/src/layouts/white/components/header/navigation/Navigation.jsx
deleted file mode 100644
index 3dd5091..0000000
--- a/src/layouts/white/components/header/navigation/Navigation.jsx
+++ /dev/null
@@ -1,139 +0,0 @@
-import React, { useState, useEffect, createRef } from 'react';
-import { Link } from 'react-router-dom';
-import {
- Container,
- Hidden,
- Tabs,
- Tab,
- useMediaQuery,
- IconButton,
- SwipeableDrawer,
-} from '@material-ui/core';
-import MenuIcon from '@material-ui/icons/Menu';
-import MenuOpenIcon from '@material-ui/icons/MenuOpen';
-import { makeStyles, useTheme } from '@material-ui/styles';
-
-const useStyles = makeStyles((theme) => ({
- toolbar: theme.mixins.toolbar,
-
- drawerIconContainer: {
- alignSelf: 'center',
- '&:hover': { backgroundColor: 'transparent' },
- [theme.breakpoints.down('md')]: { padding: 0 },
- },
- drawerIcon: {
- height: '40px',
- width: '40px',
- color: 'white',
- },
- drawer: { minWidth: '50vw' },
- tab: {
- alignItems: 'flex-start',
- fontSize: '2rem',
- textTransform: 'capitalize',
-
- },
- right: {},
-}));
-
-const Navigation = (props) => {
- const classes = useStyles();
- const theme = useTheme();
-
- const matches = useMediaQuery(theme.breakpoints.down('sm'));
- const iOS = process.browser && /iPad|iPhone|iPod/.test(navigator.userAgent);
- const [value, setValue] = useState(0);
- const [openDrawer, setOpenDrawer] = useState(false);
-
- const handleTabsChange = (e, newValue) => {
- setValue(newValue);
- setOpenDrawer(false);
- };
-
- const open = () => {
- setOpenDrawer(true);
- };
- const close = () => {
- setOpenDrawer(false);
- };
- const wrapper = createRef();
-
- return (
-
-
- setOpenDrawer(!openDrawer)}
- disableRipple
- className={classes.drawerIconContainer}
- >
- {openDrawer ? (
-
- ) : (
-
- )}
-
-
-
- {matches ? (
-
-
-
-
-
-
-
-
-
-
- ) : (
-
-
-
-
-
-
-
-
-
- )}
-
- );
-};
-export default Navigation;
diff --git a/src/layouts/white/components/header/navigation/index.js b/src/layouts/white/components/header/navigation/index.js
deleted file mode 100644
index 7bc6dc0..0000000
--- a/src/layouts/white/components/header/navigation/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Navigation';
diff --git a/src/logo.svg b/src/logo.svg
deleted file mode 100644
index 9dfc1c0..0000000
--- a/src/logo.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/src/pages/projects/Projects.jsx b/src/pages/projects/Projects.jsx
index 987bfdd..cc58084 100644
--- a/src/pages/projects/Projects.jsx
+++ b/src/pages/projects/Projects.jsx
@@ -4,14 +4,7 @@ const Projects = () => {
return (
Projects ...in progress
- {[...new Array(120)]
- .map(
- () => `Cras mattis consectetur purus sit amet fermentum.
-Cras justo odio, dapibus ac facilisis in, egestas eget quam.
-Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
-Praesent commodo cursus magna, vel scelerisque nisl consectetur et.`,
- )
- .join('\n')}
+
)
}