bubble/devthread.ru
1
0
Fork 0
mirror of https://github.com/sergeyyarkov/devthread.ru.git synced 2026-10-11 10:19:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

useContext

Browse Source
This commit is contained in:
Sergey Yarkov 2020-07-20 14:09:24 +03:00
parent 07764daa62
commit 1a342f3438
1 changed files with 2 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Header/Header.js
View File

@ -16,6 +16,7 @@ const Header = () => {
const [isScrolled, setIsScrolled] = React.useState(false) const [isScrolled, setIsScrolled] = React.useState(false)
const [isMobileOpen, setIsMobileOpen] = React.useState(false) const [isMobileOpen, setIsMobileOpen] = React.useState(false)
const { pathname } = useLocation() const { pathname } = useLocation()
const { isDark, toggleLightTheme, toggleDarkTheme } = React.useContext(ThemeContext)
React.useEffect(() => { React.useEffect(() => {
isMobileOpen ? document.body.style.overflowY = 'hidden' : document.body.style.overflowY = '' isMobileOpen ? document.body.style.overflowY = 'hidden' : document.body.style.overflowY = ''
@ -56,9 +57,7 @@ const Header = () => {
</nav> </nav>
</div> </div>
<div className="header-nav__theme"> <div className="header-nav__theme">
<ThemeContext.Consumer> {isDark ? <SunIcon onClick={toggleLightTheme} /> : <MoonIcon onClick={toggleDarkTheme} />}
{theme => theme.isDark ? <SunIcon onClick={theme.toggleLightTheme} /> : <MoonIcon onClick={theme.toggleDarkTheme} />}
</ThemeContext.Consumer>
</div> </div>
</div> </div>
<div className={isMobileOpen ? 'header-content__nav mobile mobileOpen' : 'header-content__nav mobile'}> <div className={isMobileOpen ? 'header-content__nav mobile mobileOpen' : 'header-content__nav mobile'}>