Add the ability to tell if menu entry is active

assets/scss/partials/_header.scss

@@ -22,4 +22,7 @@
       color: var(--c-txt-alt);
     }
   }
+  >a.active {
+    color: #fff;
+  }
 }

config.toml

@@ -54,20 +54,20 @@ copyright = "This work is licensed under a Creative Commons Attribution-NonComme
 
   [[menu.main]]
     name = "Writing"
-    url = "/writing/"
+    pageref = "/writing"
     weight = 10
 
   [[menu.main]]
     name = "Gallery"
-    url = "/gallery/"
+    pageref = "/gallery"
     weight = 20
 
   [[menu.main]]
     name = "Link"
-    url = "/link/"
+    pageref = "/link"
     weight = 30
 
   [[menu.main]]
     name = "About"
-    url = "/about/"
+    pageref = "/about"
     weight = 40

layouts/_default/list.html

@@ -1,5 +1,5 @@
 {{ define "header" }}
-{{ partialCached "header.html" . }}
+{{ partial "header.html" . }}
 {{ end }}
 
 {{ define "main" }}

layouts/_default/single.html

@@ -7,7 +7,7 @@
 {{ end }}
 
 {{ define "header" }}
-{{ partialCached "header.html" . }}
+{{ partial "header.html" . }}
 {{ end }}
 
 {{ define "main" }}

layouts/gallery/list.html

@@ -1,5 +1,5 @@
 {{ define "header" }}
-{{ partialCached "header.html" . }}
+{{ partial "header.html" . }}
 {{ end }}
 
 {{ define "main" }}

layouts/gallery/single.html

@@ -1,5 +1,5 @@
 {{ define "header" }}
-{{ partialCached "header.html" . }}
+{{ partial "header.html" . }}
 {{ end }}
 
 {{ define "main" }}

layouts/partials/header.html

@@ -3,8 +3,9 @@
 			<a href="{{.Site.BaseURL}}">{{ .Site.Title }}</a>
 		</div>
 		<nav id="site-nav">
+			{{- $currentPage := . }}
 			{{- range .Site.Menus.main }}
-			<a href="{{ .URL }}">{{ .Name }}</a>
+			<a href="{{ .URL }}" class="{{ if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}active{{ end }}">{{ .Name }}</a>
 			{{- end }}
 		</nav>
 	</header>

layouts/writing/single.html

@@ -7,7 +7,7 @@
 {{ end }}
 
 {{ define "header" }}
-{{ partialCached "header.html" . }}
+{{ partial "header.html" . }}
 {{ end }}
 
 {{ define "main" }}