theme/layouts/partials/navbar.html

<nav class="w-full bg-primary">
	<div class="mx-auto flex max-w-screen-2xl justify-between px-2">
		<a href="/">
			<span class="sr-only">Vikunja</span>
			<svg class="my-2 ml-2 h-10 lg:ml-0" viewBox="0 0 872.59 256.75" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><metadata><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><dc:title/></cc:Work></rdf:RDF></metadata><g transform="matrix(1.3333 0 0 -1.3333 -88.275 376.11)"><g transform="matrix(.1 0 0 .1 9.548 -4.2435)"><path d="m2268.2 2512.3c-15.884 19.573-32.512 38.571-49.949 56.876-180.6 189.62-426.24 294.06-691.67 294.06-256.43 0-497.51-99.862-678.83-281.18-22.365-22.368-43.484-45.656-63.335-69.76-141.09-171.28-217.84-384.27-217.84-609.07 0-256.42 99.861-497.5 281.18-678.82 181.32-181.32 422.39-281.17 678.83-281.17 256.43 0 497.5 99.858 678.83 281.17 181.32 181.33 281.17 422.4 281.17 678.82 0 219.21-78.86 437.22-218.37 609.07" fill="#196aff"/><path d="m1823.7 1648.9c35.688 104.5 94.631 136.49 101.96 297.74 2.5753 56.667-14.661 236.66-14.661 236.66s28.013 72.169-25.823 152.56c-83.476 124.65-255.4 133.13-345.69 133.13s-260.21-8.4751-343.68-133.13c-53.84-80.394-25.826-152.56-25.826-152.56s-9.5356-92.571-16.752-174.22c-1.6998-19.16 0.1575-94.95 2.4544-113.26 4.1285-32.812 14.481-65.05 25.808-96.432 14.342-39.735 36.82-80.055 53.983-120.82 51.799-123.08 8.4513-275.53 11.1-408.25 2.2383-94.211-20.013-189.78-28.731-281.91 98.129-33.338 202.09-50.725 308.72-50.725 119.83 0 236.31 21.899 344.9 63.789-20.394 115.35-44.092 224.76-47.748 266.5-10.646 126.2-41.304 260.04-0.01 380.94" fill="#fff"/><path d="m1162.9 2383.9c1.1503-18.73 2.9966-37.93 8.2718-56.159 1.6558-5.6818 4.1029-19.683 11.415-21.764 9.0923-2.59 25.911 8.2571 32.288 12.957 12.356 9.096 23.925 18.459 36.285 27.651 7.8835 5.8613 16.492 10.47 24.211 16.496 8.4 6.5463 14.719 14.474 21.709 22.178 8.4843 9.3597 14.847 19.049 21.372 29.497 5.103 8.1545 37.069 13.463 42.187 21.031 5.5866 8.2755 0.9158 18.511 0.9158 28.698 0 74.164 4.4546 147.57 6.1874 220.29 1.7877 49.887 21.379 109.13-53.44 85.744-160.31-49.887-158.53-271.26-151.4-386.62" fill="#fff"/><path d="m1869.1 2279.7c-1.6118 1.7511-4.1945 3.2384-6.2606 4.7696-8.9788 6.649-17.445 13.606-25.156 21.482-9.411 9.6125-19.192 18.958-28.164 28.929-7.8908 8.7626-17.313 16.602-25.006 25.574-5.1286 5.9602-10.081 12.305-14.609 18.562-2.3115 3.1761-3.5204 6.9969-5.3374 10.396-2.7072 5.0114-39.882 10.118-36.19 15.005 6.3009 8.3304 20.328 15.397 23.702 24.94 17.243 48.667 24.771 244.53 26.852 294.51 5.3521 127.83 117.57-6.2386 137.17-57.682 57.008-149.66 23.145-258.78-46.315-386.62" fill="#fff"/><path d="m1716.5 1787.9c-0.081 73.805-9.2535 103.66-50.407 139.75-25.742 22.566-55.836 31.175-103.74 29.992-47.902 1.1833-82.424-13.378-107.32-39.223-37.549-38.992-47.436-62.053-47.542-135.86-0.059-39.893 42.956-128.16 55.756-148.54 21.244-35.93 60.562-48.85 99.104-46.154 38.545-2.6962 77.867 10.224 99.096 46.154 12.811 20.372 55.107 106.95 55.052 153.87" fill="#f1e6d3"/><path d="m1226.6 2316.1c-9.6162 86.088-38.582 239.98 61.489 331.24 11.038 10.074 14.001-24.2 15.848-38.066 2.5386-19.038-0.051-73.416 0.337-92.583 0.7143-36.087 8.2754-54.964 4.7513-71.46-9.6272-45.092-17.353-42.183-26.559-69.603-18.258-54.378-53.235-83.066-55.866-59.529" fill="#f1d7d4"/><path d="m1851.7 2333.1c10.243-18.331 36.996 80.256 45.381 123.07 7.8945 40.307 17.925 93.869 4.059 133.91-7.4365 21.482-53.078 84.568-58.463 62.892-2.0991-8.4183-3.1834-71.098-8.345-101.09-6.3889-37.109-17.91-73.805-17.98-111.54-0.1502-84.568 25.336-88.055 35.347-107.24" fill="#f1d7d4"/><path d="m1522 1319.7c-2.1687-6.583-18.595-11.404-24.764-13.393-14.91-4.8172-28.145 6.9383-36.476 16.844-11.583 13.73-11.276 35.629-16.126 51.642-2.9343 9.6822-19.533 10.997-24.518 2.0405-16.628-29.9-81.161 26.365-66.163 45.095 9.8872 12.353-13.781 23.262-23.54 11.078-28.948-36.16 48.92-103.5 93.579-85.245 1.9892-9.0338 4.0736-18.056 7.9091-26.636 7.5245-16.851 23.98-27.739 41.011-36.89 23.196-12.437 68.258 9.4074 75.142 30.255 4.7916 14.503-21.28 19.635-26.054 5.2093" fill=
		</a>
		<button
			class="navbar-burger block cursor-pointer p-3 pr-4 text-white lg:hidden"
			data-target="navMenu"
			aria-label="Open Menu"
		>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				class="h-8 w-8"
				fill="none"
				viewBox="0 0 24 24"
				stroke="currentColor"
			>
				<path
					stroke-linecap="round"
					stroke-linejoin="round"
					stroke-width="2"
					d="M4 6h16M4 12h16M4 18h16"
				/>
			</svg>
		</button>
		<div class="hidden font-title font-semibold text-white lg:flex">
			{{ $currentNode := .Page }}{{ range .Site.Menus.page }}
				<a
					class="{{ if $currentNode.IsMenuCurrent "page" . }}
						bg-primary-darker
					{{ end }} block h-full py-4 px-2 hover:bg-primary-darker"
					href="{{ .URL }}"
				>
					{{ .Name }}
				</a>
			{{ end }}
		</div>
	</div>

	<!-- Mobile Menu -->
	<div class="fixed top-0 bottom-0 left-0 right-0 hidden bg-black bg-opacity-50" id="navMenu" aria-expanded="false">
		<div class="fixed flex h-screen w-3/4 flex-col bg-gray-100 font-title font-semibold">
			{{ $currentNode := .Page }}{{ range .Site.Menus.page }}
				<a
					class="{{ if $currentNode.IsMenuCurrent "page" . }}
						bg-primary text-white
					{{ end }} block py-2 px-4 hover:bg-primary hover:text-white"
					href="{{ .URL }}"
				>
					{{ .Name }}
				</a>
			{{ end }}
		</div>
	</div>
</nav>