final polish

assets/css/compiled/main.css

@@ -1699,6 +1699,12 @@ select {
   margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
+.space-y-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+}
+
 .space-y-3 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));

exampleSite/config/_default/menus.en.toml

@@ -15,52 +15,6 @@
   pageRef = "docs"
   weight = 10
 
-[[main]]
-  name = "Nested Menu"
-  pageRef = "samples"
-  weight = 20
-
-[[main]]
-  name = "sub-menu 1"
-  parent = "Nested Menu"
-  pageRef = "samples"
-  weight = 20
-
-[[main]]
-  name = "sub-menu 2"
-  parent = "Nested Menu"
-  pageRef = "samples"
-  weight = 20
-
-[[main]]
-  name = "sub-menu 3"
-  parent = "Nested Menu"
-  pre = "github"
-  pageRef = "samples"
-  weight = 20
-
-[[subnavigation]]
-  name = "An interesting topic"
-  pageRef = "tags/interesting-topic"
-  weight = 10
-
-[[subnavigation]]
-  name = "My Awesome Category"
-  pre = "github"
-  pageRef = "categories/awesome"
-  weight = 20
-
-[[subnavigation]]
-  name = "YOLO"
-  pageRef = "categories/awesome"
-  weight = 20
-
-[[subnavigation]]
-  name = "My Awesome Category asd"
-  pre = "twitter"
-  pageRef = "categories/awesome"
-  weight = 20
-
 [[main]]
   name = "Samples"
   pageRef = "samples"

layouts/partials/header/basic.html

@@ -94,7 +94,7 @@
             <div id="menu-wrapper" style="padding-top:5px;"
                 class="fixed inset-0 z-30 invisible w-screen h-screen m-auto overflow-auto transition-opacity opacity-0 cursor-default bg-neutral-100/50 backdrop-blur-sm dark:bg-neutral-900/50">
                 <ul
-                    class="flex mt-4 flex-col items-end w-full px-6 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl">
+                    class="flex space-y-2 mt-3 flex-col items-end w-full px-6 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl">
 
                     <li>
                         <span
@@ -114,7 +114,6 @@
 
                 </ul>
                 {{ if .Site.Menus.subnavigation }}
-
                 <hr>
                 <ul
                     class="flex mt-4 flex-col items-end w-full px-6 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl">

layouts/partials/header/header-mobile-option-nested.html

@@ -1,4 +1,4 @@
-<li class="mt-3">
+<li class="mt-1">
     <a class="flex items-center">
         {{ if .Pre }}
         <span {{ if and .Pre .Name}} class="mr-1" {{ end }}>
@@ -14,7 +14,7 @@
     </a>
 </li>
 {{ range .Children }}
-<li class="mt-2">
+<li class="mt-1">
     <a href="{{ .URL }}" {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:"
         ) }} target="_blank" {{ end }} class="flex items-center">
         {{ if .Pre }}
@@ -28,3 +28,4 @@
     </a>
 </li>
 {{ end }}
+<li class="mb-2"></li>

layouts/partials/header/header-mobile-option-simple.html

@@ -1,10 +1,10 @@
-<li class="mt-3">
+<li class="mt-1">
     <a href="{{ .URL }}" {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:"
         ) }} target="_blank" {{ end }} class="flex items-center">
         {{ if .Pre }}
-        <span {{ if and .Pre .Name}} class="mr-2" {{ end }}>
+        <div {{ if and .Pre .Name}} class="mr-2" {{ end }}>
             {{ partial "icon.html" .Pre }}
-        </span>
+        </div>
         {{ end }}
         <p class="text-bg font-bg text-gray-500 hover:text-gray-900" title="{{ .Title }}">
             {{ .Name | markdownify | emojify }}