Merge pull request #1069 from marcchehab/patch-2 - Add SiteToc to MobileNav.

This PR adds the SiteToc to the MobileNav. It also fixes double type declarations in MobileNav by importing the interfaces from Nav. Adding SiteToc was then just a matter of uncommenting code that was there already.
This commit is contained in:
Rufus Pollock 2024-05-31 17:16:42 +02:00 committed by GitHub
commit 30e7c6379f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 14 deletions

View File

@ -53,7 +53,7 @@ export const Nav: React.FC<Props> = ({
<nav className="flex justify-between">
{/* Mobile navigation */}
<div className="mr-2 sm:mr-4 flex lg:hidden">
<NavMobile links={links}>{children}</NavMobile>
<NavMobile {...{title, links, social, search, defaultTheme, themeToggleIcon}}>{children}</NavMobile>
</div>
{/* Non-mobile navigation */}
<div className="flex flex-none items-center">

View File

@ -4,20 +4,16 @@ import { useRouter } from "next/router.js";
import { useEffect, useState } from "react";
import { SearchContext, SearchField } from "../Search";
import { MenuIcon, CloseIcon } from "../Icons";
import { NavLink, SearchProviderConfig } from "../types";
import type { NavConfig, ThemeConfig } from "./Nav";
interface Props extends React.PropsWithChildren {
author?: string;
links?: Array<NavLink>;
search?: SearchProviderConfig;
}
interface Props extends NavConfig, ThemeConfig, React.PropsWithChildren {}
// TODO why mobile navigation only accepts author and regular nav accepts different things like title, logo, version
// TODO: Search doesn't appear
export const NavMobile: React.FC<Props> = ({
children,
title,
links,
search,
author,
}) => {
const router = useRouter();
const [isOpen, setIsOpen] = useState(false);
@ -77,8 +73,8 @@ export const NavMobile: React.FC<Props> = ({
legacyBehavior
>
{/* <Logomark className="h-9 w-9" /> */}
<div className="font-extrabold text-primary dark:text-primary-dark text-2xl ml-6">
{author}
<div className="font-extrabold text-primary dark:text-primary-dark text-lg ml-6">
{title}
</div>
</Link>
</div>
@ -106,9 +102,7 @@ export const NavMobile: React.FC<Props> = ({
))}
</ul>
)}
{/* <div className="pt-6 border border-t-2">
{children}
</div> */}
<div className="pt-6">{children}</div>
</Dialog.Panel>
</Dialog>
</>