Ensure whole nav row is clickable

This is a regression because I accidentally removed the `width: 100%` when adding the hamburger menu.

Fixes #18.
This commit is contained in:
Florine W. Dekker 2021-04-28 12:26:01 +02:00
parent 4f9d7b8311
commit 9a3227b43f
Signed by: FWDekker
GPG Key ID: B1B567AF58D6EE0F
3 changed files with 7 additions and 2 deletions

View File

@ -1,6 +1,6 @@
{
"name": "@fwdekker/template",
"version": "2.2.4",
"version": "2.2.5",
"description": "The base template for pages on fwdekker.com.",
"author": "Felix W. Dekker",
"license": "MIT",

View File

@ -15,6 +15,10 @@ nav * {
vertical-align: middle;
}
nav a, nav a:link, nav a:visited, nav a:hover, nav a:active {
width: 100%; /* Ensures whole li is clickable */
}
nav a, nav a:link, nav a:visited, nav a:hover, nav a:active, nav #nav-hamburger-label {
display: inline-block;
margin: 0;

View File

@ -94,7 +94,8 @@ const unpackEntry = function(entry, path = "/", highlightPath = "") {
const formattedName = (isExternalLink ? "⎋ " : "") + entry.name;
if (entry.entries.length === 0)
return `<li class="${shouldHighlight ? "currentPage" : ""}"><a href="${entry.link}">${formattedName}</a></li>`;
return "" +
`<li ${shouldHighlight ? "class=\"currentPage\"" : ""}><a href="${entry.link}">${formattedName}</a></li>`;
const depth = path.split("/").length - 2; // -1 because count parts, then another -1 because of leading `/`
const arrow = depth === 0 ? "&#9662;" : "&#9656;";