SP
Код
import React, { useState } from 'react'
import './nav.sass'
import {connectconnect} from 'react-redux'
import DividerElem from "../elements/divider/DividerElem";
import {NextPage} from "next";
interface IProps {}
const Nav: NextPage<IProps> = () => {
// const state = useSelector((state:any) => state)
// console.log(state)
const [isActiveMenu, setIsActiveMenu] = useState(false)
return (
<nav className={`${isActiveMenu ? 'active' : ''}`}>
<div className="nav__top">
<div className="nav__top__group">
<div className={`nav__top__menuIcon ${isActiveMenu ? 'active' : ''}`}
onClick={() => setIsActiveMenu(!isActiveMenu)}
></div>
<div className="nav__top__logo"></div>
</div>
<div className="nav__top__group">
<div className="nav__top__icon search"></div>
<div className="nav__top__icon user"></div>
<div className="nav__top__icon bookmark"></div>
</div>
</div>
<ul className={`nav__list ${isActiveMenu ? 'active' : ''}`}>
<div className="nav__list__group main">
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
</div>
<DividerElem/>
<div className="nav__list__group category">
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
</div>
<DividerElem/>
<div className="nav__list__group footer">
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
<li className={"nav__list__item"}><a href="">Test</a></li>
</div>
<div className="nav__list__group social">
<div className={"nav__list__icon"}>
<a href="">
<img src="/images/fb.svg" alt=""/>
</a>
</div>
<div className={"nav__list__icon"}>
<a href="">
<img src="/images/insta.svg" alt=""/>
</a>
</div>
<div className={"nav__list__icon"}>
<a href="">
<img src="/images/telegram.svg" alt=""/>
</a>
</div>
</div>
<div className="nav__list__bg"></div>
</ul>
</nav>
)
}
Nav.getInitialProps = async ({req}) => {
consoleconsole.log('test')
return {
data: ''
}
}
export default connectconnect()(Nav)