Foxnouns.NET/Foxnouns.Frontend/app/components/nav/BaseNavbar.tsx

22 lines
587 B
TypeScript

import { ReactNode } from "react";
import { Nav, Navbar } from "react-bootstrap";
import { Link } from "@remix-run/react";
import Logo from "~/components/nav/Logo";
export default function BaseNavbar({ children }: { children?: ReactNode }) {
return (
<Navbar expand="lg" className={`mb-4 mx-2`}>
<Navbar.Brand to="/" as={Link}>
<Logo />
</Navbar.Brand>
{children && (
<>
<Navbar.Toggle aria-controls="main-navbar" />
<Navbar.Collapse id="main-navbar">
<Nav className="ms-auto">{children}</Nav>
</Navbar.Collapse>
</>
)}
</Navbar>
);
}