edb/neuf-www
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add happy lil pig to expanded menu

Browse Source
This commit is contained in:
elisejakob
2024-05-14 21:28:29 +02:00
parent 08b2e5387d
commit ba93e7e783
4 changed files with 108 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
web/src/components/layout/Header.tsx
View File

@ -3,7 +3,7 @@ import { useState, useEffect, useRef } from "react";
import { usePathname } from "next/navigation";
import Link from "next/link";
import styles from "./header.module.scss";
import { Logo } from "../general/Logo";
import { Logo, LogoIcon } from "@/components/general/Logo";
export const Header = () => {
const [showMenu, setShowMenu] = useState(false);
@ -87,64 +87,67 @@ export const Header = () => {
>
<span className={styles.menuIcon}></span>
</button>
<ul className={styles.fullMenu}>
<li className={styles.menuItemLarge}>
<Link
href="/arrangementer"
data-active={pathname === "/arrangementer"}
>
Arrangementer
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/" data-active={pathname === "/praktisk"}>
Praktisk info
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/utleie" data-active={pathname === "/utleie"}>
Utleie
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/" data-active={pathname === "/medlem"}>
Bli medlem
</Link>
</li>
<li className={styles.divider}>
<Link href="/aktuelt" data-active={pathname === "/aktuelt"}>
Siste nytt
</Link>
</li>
<li>
<Link href="/" data-active={pathname === "/om"}>
Om oss
</Link>
</li>
<li>
<Link href="/kontakt" data-active={pathname === "/kontakt"}>
Kontakt
</Link>
</li>
<li>
<Link href="/" data-active={pathname === "/frivillig"}>
Bli frivillig
</Link>
</li>
<li className={styles.search}>
<label>
<p>Søk</p>
<input type="text" />
</label>
</li>
<li className={styles.galtinn}>
<Link href="/">Mitt medlemskap &rarr;</Link>
</li>
<li>
{/* TODO: skal trolig ikke være så synlig ved lansering */}
<Link href="/lokaler">Lokaler*</Link>
</li>
</ul>
<div className={styles.fullMenu}>
<LogoIcon face="right" />
<ul>
<li className={styles.menuItemLarge}>
<Link
href="/arrangementer"
data-active={pathname === "/arrangementer"}
>
Arrangementer
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/" data-active={pathname === "/praktisk"}>
Praktisk info
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/utleie" data-active={pathname === "/utleie"}>
Utleie
</Link>
</li>
<li className={styles.menuItemLarge}>
<Link href="/" data-active={pathname === "/medlem"}>
Bli medlem
</Link>
</li>
<li className={styles.divider}>
<Link href="/aktuelt" data-active={pathname === "/aktuelt"}>
Siste nytt
</Link>
</li>
<li>
<Link href="/" data-active={pathname === "/om"}>
Om oss
</Link>
</li>
<li>
<Link href="/kontakt" data-active={pathname === "/kontakt"}>
Kontakt
</Link>
</li>
<li>
<Link href="/" data-active={pathname === "/frivillig"}>
Bli frivillig
</Link>
</li>
<li className={styles.search}>
<label>
<p>Søk</p>
<input type="text" />
</label>
</li>
<li className={styles.galtinn}>
<Link href="/">Mitt medlemskap &rarr;</Link>
</li>
<li>
{/* TODO: skal trolig ikke være så synlig ved lansering */}
<Link href="/lokaler">Lokaler*</Link>
</li>
</ul>
</div>
</nav>
</header>
);