Add submenu for resources

This commit is contained in:
dora 2021-05-24 02:57:26 -04:00
parent ed9724a36e
commit 0843f4a3c8
1 changed files with 39 additions and 17 deletions

View File

@ -51,32 +51,54 @@ const menu: NavLink[] = [
{
name: "Resources",
route: "/resources",
submenu: [
{
name: "Services",
route: "/resources/services",
},
{
name: "Tech Talks",
route: "/resources/tech-talks",
},
{
name: "CS Club Wiki",
route: "https://wiki.csclub.uwaterloo.ca/",
},
],
},
];
function NavItem(props: NavLink) {
const router = useRouter();
const externalLink =
props.route.includes("https://") || props.route.includes("https://");
return (
<>
<Link href={props.route}>
<a
title={props.name}
className={
router.pathname === props.route ||
((props.submenu?.length ?? 0) > 0 &&
router.pathname.startsWith(props.route))
? styles.currentPage
: ""
}
onClick={() => {
if (document.activeElement instanceof HTMLElement) {
document.activeElement.blur();
}
}}
>
{externalLink ? (
<a href={props.route} target="_blank" rel="noopener noreferrer">
{props.name}
</a>
</Link>
) : (
<Link href={props.route}>
<a
title={props.name}
className={
router.pathname === props.route ||
((props.submenu?.length ?? 0) > 0 &&
router.pathname.startsWith(props.route))
? styles.currentPage
: ""
}
onClick={() => {
if (document.activeElement instanceof HTMLElement) {
document.activeElement.blur();
}
}}
>
{props.name}
</a>
</Link>
)}
{(props.submenu?.length ?? 0) > 0 ? (
<ul className={styles.dropdown}>
{props.submenu?.map((item) => {