From 1c29d7d3acee72e35eab9743df24e5de87abb97d Mon Sep 17 00:00:00 2001
From: "Felix W. Dekker" <felix@fwdekker.com>
Date: Sun, 17 May 2020 21:06:26 +0200
Subject: [PATCH] Allow arbitrary nesting of nav entries

Fixes #1.
---
 package-lock.json       | Bin 337231 -> 337991 bytes
 package.json            |   2 +-
 src/main/css/nav.css    |   8 +++++++-
 src/main/js/Template.js |   9 ++++++---
 4 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index eb78abd76817433dc41ec6724e1f1027a24b72a4..71e6d44c6327f6d42a51fe0ec2169e007282917c 100644
GIT binary patch
delta 552
zcmYjOO-NKx80EY7J*LK)`^1LH5>l*1v=D<B%LoJ8#Pl;ns}?B;EoWM^a+4xa)I#aj
zoD7ktM1sQf5Qhr|@+2cEeU3t)Av((vp;;(`MRec1foAb7zVCkbobQ~o{3Z6e5F5Hc
ziT?I{JH2@UcaD;{{F@zCk(Xq%px@0=ot!u!Wa)ccdN_i@Te^#(ak``iU(rV@Z^@eB
zsLX5&*m;V}XWMoD)&NGk`Ei+l8keaD0>AcoWo&I2mW=-qNUc$Kg*Cy>!0j{)^?ror
zMKD~r#bQ3KTAHGB1bdjQGBJv?REw5P>cs2<g&`g?f&2I9ESyE^m3=CLt2ug9^+Aj9
z0!;S_uR*TFI$%#w7VbB#W7DC%YIu8zS@0To2bSB|l`^O@XDAs8AnZH*5E>PQ@Z+b^
zjKYDwdh!F!aR2!lx=e0nJr+h=57$C2@_M8b>{uBF&I%9V_B%QSHyzkf@$#=rePJ{$
z(skL|6_t^rLb+e*rcotgaEs=V-r-TSZ1Co+#bW=nkT+H>q;|LoCu3MB3Et}qe6EVC
wR4{|PJx6=BwMJ>bJrDOaJBi&fotOPdplMvkTswXGadDk=F<o30*Nsf_AJ0?icK`qY

delta 474
zcmYjOJxE(o80EbCLTu1R;sc{lNkb`Ui;aU2e}*hhf@D&t5xcbDqS;F0pn@eXO7N;D
z{-A;#GKha@FIbC_77B$>EyYDcG6>x?Lr1B-zBi=9H{A1`@0{;D_uHxU<GYn=L+eEQ
zK|4OoG21A7jLyMgERPDgAAiC~J$x)mOtNqcpZYtGUvPL4YF<Mc<a$4z%0l`XPrJke
zdY4fp{fm|iOugXUV^P7tj0nyaOup<CbxeIlf}eh(n!QUHwxwjKv*vzmwEP;&qn<a*
z{}EJX1&3b8Iz9wTZEa!zEEVyNBS)r($x-7W<8RPnTgY)$$&R9iLTB)EZ5xC3o_v(n
z2gP=9<VZz#vB6RXP0U`1YTo@Z`lzv5P6vgXw*w-`S1!X;*Lz5UJATo$@LSB-7Akju
zZnrI?qMvaq%IhD$Hr;CV1U;}#Rrm|WJr1*!!<gxyI)(R!lU{1x%i$|DQ@1S{$-9_&
pYc_m5N6b}L4O|(|W%fo-$8~)AQ^NPX)@0%mx(r=HB`(ce_dhwNxAy=5

diff --git a/package.json b/package.json
index ed15de9..de9e90c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@fwdekker/template",
-    "version": "0.0.15",
+    "version": "0.0.16",
     "description": "The base template for pages on fwdekker.com.",
     "author": "Felix W. Dekker (https://fwdekker.com)",
     "license": "MIT",
diff --git a/src/main/css/nav.css b/src/main/css/nav.css
index 5ed1408..23a8cff 100644
--- a/src/main/css/nav.css
+++ b/src/main/css/nav.css
@@ -58,11 +58,16 @@
 
 
 .nav ul li ul {
-    display: none;
+    /*display: none;*/
     position: absolute;
     left: 0;
 }
 
+.nav ul li ul li ul {
+    left: 100%;
+    top: 0;
+}
+
 .nav ul li:hover > ul,
 .nav ul li:focus-within > ul,
 .nav ul li ul:hover {
@@ -70,5 +75,6 @@
 }
 
 .nav ul li ul li {
+    min-width: 7em;
     width: 100%;
 }
diff --git a/src/main/js/Template.js b/src/main/js/Template.js
index d4d48b9..77f7eb7 100644
--- a/src/main/js/Template.js
+++ b/src/main/js/Template.js
@@ -61,15 +61,18 @@ export const nav = function () {
  * Unpacks a navigation entry returned from the navigation API into an HTML element.
  *
  * @param entry {Object} the entry to unpack
+ * @param [depth] {Object} the current nesting level
  * @returns {HTMLElement} the navigation list entry as HTML, described by its children
  */
-const unpackEntry = function (entry) {
+const unpackEntry = function (entry, depth = 0) {
     if (entry.entries.length === 0)
         return h("li", h("a", {href: entry.link, innerHTML: entry.name}));
 
+    const arrow = depth === 0 ? "&#9662;" : "&#9656;"
+
     return h("li",
-        h("a", {href: entry.link, innerHTML: `${entry.name} &#9662;`}),
-        h("ul", entry.entries.map(it => unpackEntry(it)))
+        h("a", {href: entry.link, innerHTML: `${entry.name} ${arrow}`}),
+        h("ul", entry.entries.map(it => unpackEntry(it, depth + 1)))
     );
 };