Merge pull request #784 from ralphocdol/fix-vertically-scrollable-nav

Fix vertically scrollable nav

internal/glance/static/css/site.css

@@ -279,15 +279,20 @@ kbd:active {
     max-height: 2.7rem;
 }
 
-.nav {
+.desktop-navigation {
     overflow-x: auto;
     min-width: 0;
     height: 100%;
     gap: var(--header-items-gap);
 }
 
-.nav .nav-item {
-    line-height: var(--header-height);
+.desktop-navigation .nav-item {
+    display: flex;
+    align-items: center;
+}
+
+.desktop-navigation .nav-item-text {
+    margin-top: 3px;
 }
 
 .footer {

internal/glance/templates/page.html

@@ -8,7 +8,7 @@
 
 {{ define "navigation-links" }}
 {{ range .App.Config.Pages }}
-<a href="{{ $.App.Config.Server.BaseURL }}/{{ .Slug }}" class="nav-item{{ if eq .Slug $.Page.Slug }} nav-item-current{{ end }}"{{ if eq .Slug $.Page.Slug }} aria-current="page"{{ end }}>{{ .Title }}</a>
+<a href="{{ $.App.Config.Server.BaseURL }}/{{ .Slug }}" class="nav-item{{ if eq .Slug $.Page.Slug }} nav-item-current{{ end }}"{{ if eq .Slug $.Page.Slug }} aria-current="page"{{ end }}><div class="nav-item-text">{{ .Title }}</div></a>
 {{ end }}
 {{ end }}
 
@@ -30,7 +30,7 @@
                 </svg>
                 {{- end }}
             </div>
-            <nav class="nav flex grow hide-scrollbars">
+            <nav class="desktop-navigation flex grow hide-scrollbars">
                 {{ template "navigation-links" . }}
             </nav>
             {{ if not .App.Config.Theme.DisablePicker }}