Merge pull request #132 from acid-info/mobile-menu

[#125] fix menu navigation and style issues
This commit is contained in:
amir houieh 2023-08-28 13:09:54 +02:00 committed by GitHub
commit f16f364d51
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 2 deletions

View File

@ -29,9 +29,7 @@ export default function NavBar({ defaultState }: NavBarProps) {
const state = useNavbarState(defaultState)
const themeState = useThemeState()
const { pathname } = useRouter()
const isSearchPage = pathname === '/search'
const [hide, setHide] = useState(false)
const scrollDirection = useScrollDirection()
const [showMobileMenu, setShowMobileMenu] = useState(false)
const className = pathname.split('/')[1] + '_page'
@ -40,6 +38,10 @@ export default function NavBar({ defaultState }: NavBarProps) {
setShowMobileMenu(!showMobileMenu)
}
useEffect(() => {
setShowMobileMenu(false)
}, [pathname])
useEffect(() => {
defaultState && state.state.set((value) => ({ ...value, ...defaultState }))
}, [defaultState])

View File

@ -5,11 +5,21 @@ import { uiConfigs } from '@/configs/ui.configs'
import { FooterOrgPanel } from '@/components/Footer/Footer.OrgPanel'
import { useThemeState } from '@/states/themeState'
import { ThemeSwitchWithLabel } from '@/components/ThemeSwitch/ThemeSwitch'
import { useEffect } from 'react'
interface Props {}
export const NavbarMobileMenu = (props: Props) => {
const themeState = useThemeState()
useEffect(() => {
if (typeof window === 'undefined') return
document.documentElement.style.overflow = 'hidden'
return () => {
document.documentElement.style.overflow = 'auto'
}
}, [])
return (
<NavbarMobileMenuContainer>
<InnerContainer>