From 9dc03b05c7413e523dd8cf0c1ad8d9452f60efb9 Mon Sep 17 00:00:00 2001
From: guillaume-haerinck <guillaume.haerinck@outlook.com>
Date: Sun, 6 Nov 2022 10:53:43 +0100
Subject: [PATCH 1/2] Support navbar child items

---
 assets/css/common/header.css | 33 +++++++++++++++++++++++++++++++++
 layouts/partials/header.html | 12 +++++++++++-
 2 files changed, 44 insertions(+), 1 deletion(-)

diff --git a/assets/css/common/header.css b/assets/css/common/header.css
index 64894da4..e141e84d 100644
--- a/assets/css/common/header.css
+++ b/assets/css/common/header.css
@@ -91,3 +91,36 @@ body:not(.dark) #sun {
 .logo-switches {
     flex-wrap: inherit;
 }
+
+.sub-menu {
+    position: absolute;
+    visibility: hidden;
+    list-style: none;
+    z-index: 10;
+    border-radius: var(--radius);
+    padding: 0 15px;
+    background-color: var(--code-bg);
+    border: 1px solid var(--tertiary);
+}
+
+.sub-menu a:hover {
+    text-shadow: 0px 0px 1px currentColor;
+}
+
+.menu-item:hover .sub-menu {
+    visibility: visible;
+    display: block;
+}
+
+.sub-menu:hover {
+    visibility: visible;
+}
+
+.arrow-down {
+    border-left: 5px solid transparent;
+    border-right: 5px solid transparent;
+    border-top: 5px solid var(--primary);
+    position: relative;
+    top: 1em;
+    left: 6px;
+}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 4a7291e2..52e8a74f 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -125,7 +125,7 @@
             {{- $menu_item_url := (cond (strings.HasSuffix .URL "/") .URL (printf "%s/" .URL) ) | absLangURL }}
             {{- $page_url:= $currentPage.Permalink | absLangURL }}
             {{- $is_search := eq (site.GetPage .KeyName).Layout `search` }}
-            <li>
+            <li class="menu-item">
                 <a href="{{ .URL | absLangURL }}" title="{{ .Title | default .Name }} {{- cond $is_search (" (Alt + /)" | safeHTMLAttr) ("" | safeHTMLAttr ) }}"
                 {{- cond $is_search (" accesskey=/" | safeHTMLAttr) ("" | safeHTMLAttr ) }}>
                     <span {{- if eq $menu_item_url $page_url }} class="active" {{- end }}>
@@ -141,7 +141,17 @@
                         <path d="M10 14L21 3"></path>
                     </svg>
                     {{- end }}
+                    {{ if .HasChildren }}
+                    <i class="arrow-down"></i>
+                    {{ end }}
                 </a>
+            {{ if .HasChildren }}
+                <div class="sub-menu">
+                    {{ range .Children }}
+                        <a href="{{ .URL }}">{{ .Name }}</a>
+                    {{ end }}
+                </div>
+            {{ end }}
             </li>
             {{- end }}
         </ul>

From 46b957095a611b4afa18dfbe772a22dba03672eb Mon Sep 17 00:00:00 2001
From: guillaume-haerinck <guillaume.haerinck@outlook.com>
Date: Sat, 26 Nov 2022 11:50:26 +0100
Subject: [PATCH 2/2] Use SVG path for down carret as the css one has issues
 when solo menu

---
 assets/css/common/header.css | 9 ---------
 layouts/partials/header.html | 4 +++-
 2 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/assets/css/common/header.css b/assets/css/common/header.css
index e141e84d..40c84a00 100644
--- a/assets/css/common/header.css
+++ b/assets/css/common/header.css
@@ -115,12 +115,3 @@ body:not(.dark) #sun {
 .sub-menu:hover {
     visibility: visible;
 }
-
-.arrow-down {
-    border-left: 5px solid transparent;
-    border-right: 5px solid transparent;
-    border-top: 5px solid var(--primary);
-    position: relative;
-    top: 1em;
-    left: 6px;
-}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 52e8a74f..3cc1d757 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -142,7 +142,9 @@
                     </svg>
                     {{- end }}
                     {{ if .HasChildren }}
-                    <i class="arrow-down"></i>
+                    <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" fill="currentColor" viewBox="0 0 14 14"> 
+                        <path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/> 
+                    </svg>
                     {{ end }}
                 </a>
             {{ if .HasChildren }}