Files
wkc-website/src/theme/layout/DesktopNav.tsx
2023-11-09 17:21:03 -05:00

30 lines
699 B
TypeScript

import React from "react";
import { Button, HStack, Link } from "@chakra-ui/react";
import navItems, { NavItem } from "./navItems";
const DesktopNav = (): JSX.Element => {
return (
<HStack
as="nav"
display={{ base: "none", lg: "flex" }}
h="auto"
w="auto"
spacing={4}
// m="auto"
justifyContent="center"
alignContent="center"
alignItems="center"
>
{navItems.map((navItem: NavItem) => {
return (
<Link id={"dekstop-" + navItem[0]} key={navItem[0]} href={navItem[1]}>
<Button variant="nav">{navItem[0]}</Button>
</Link>
);
})}
</HStack>
);
};
export default DesktopNav;