feat: removed dark theme and theme switching (#190)

This commit is contained in:
Vojtech Simetka
2021-08-26 09:40:13 +02:00
committed by GitHub
parent 3ce83d987d
commit d1720e243c
5 changed files with 32 additions and 157 deletions
-55
View File
@@ -1,55 +0,0 @@
import { useState, ReactElement } from 'react'
import { createStyles, makeStyles } from '@material-ui/core/styles'
import { Toolbar, IconButton } from '@material-ui/core/'
import { Sun, Moon } from 'react-feather'
const drawerWidth = 240
const useStyles = makeStyles(() =>
createStyles({
appBar: {
width: `calc(100% - ${drawerWidth}px)`,
marginLeft: drawerWidth,
},
}),
)
interface Props {
themeMode: string
}
export default function SideBar(props: Props): ReactElement {
const [darkMode, toggleDarkMode] = useState(false)
const switchTheme = () => {
const theme = localStorage.getItem('theme')
if (theme) {
localStorage.setItem('theme', theme === 'light' ? 'dark' : 'light')
} else {
localStorage.setItem('theme', darkMode ? 'dark' : 'light')
}
toggleDarkMode(!darkMode)
window.location.reload()
}
const classes = useStyles()
return (
<div>
<div style={{ display: 'fixed' }} className={classes.appBar}>
<Toolbar style={{ display: 'flex' }}>
<div style={{ width: '100%' }}>
<div style={{ float: 'right' }}>
<IconButton style={{ marginRight: '10px' }} aria-label="dark-mode" onClick={() => switchTheme()}>
{props.themeMode === 'dark' ? <Moon /> : <Sun />}
</IconButton>
</div>
</div>
</Toolbar>
</div>
</div>
)
}
+1 -2
View File
@@ -81,7 +81,6 @@ const useStyles = makeStyles((theme: Theme) =>
)
interface Props {
themeMode: string
isOk: boolean
}
@@ -104,7 +103,7 @@ export default function SideBar(props: Props): ReactElement {
<img
alt="swarm"
className={classes.logo}
src={props.themeMode === 'light' ? SwarmLogoOrange : SwarmLogoOrange}
src={SwarmLogoOrange}
style={{ maxHeight: '30px', alignItems: 'center' }}
/>
</Link>