mark active nav menu entry

2 files changed, 40 insertions, 29 deletions

diff --git a/themes/aoidh/assets/aoidh.css b/themes/aoidh/assets/aoidh.css
index 9acb0ef..eacc098 100644
--- a/themes/aoidh/assets/aoidh.css
+++ b/themes/aoidh/assets/aoidh.css
@@ -1,5 +1,6 @@
 :root {
   --paper-color: #ffffea;
+  --light-yellow: #eeee9e;
   --dark-yellow: #99994c;
   --light-blue: #eaffff;
   --dark-blue: #8888cc;
@@ -12,7 +13,7 @@ html {
 }
 
 body {
-  margin: 2rem auto;
+  margin: 1rem auto;
   padding: .5rem 1rem .25rem;
   max-width: 60rem;
   border: 1px solid var(--dark-yellow);
@@ -30,7 +31,7 @@ body {
 .content {
   margin-left: auto;
   margin-right: auto;
-  max-width: 40rem;
+  max-width: 45rem;
 }
 
 header {
@@ -39,26 +40,36 @@ header {
 
 nav ul {
   display: flex;
-  list-style-type: none;
+  flex-wrap: wrap;
+}
+
+nav li {
+  display: inline-block;
+  width: 16.66666667%; /* 1/6 */
+  margin: .1rem 0 .1rem 1.5rem;
+}
+
+nav li:first-child {
+  margin-left: 0;
 }
 
 nav a {
-  text-decoration: none;
+  display: inline-block;
+  width: 100%;
+  text-align: center;
+  vertical-align: middle;
+  white-space: nowrap;
   color: #000;
-  background: #fff;
-  padding: .2rem 1.5rem .2rem 1.5rem;
-  margin: .1rem 0 .1rem 1rem;
   border: .1rem solid var(--dark-blue);
   box-shadow: .1rem .1rem var(--dark-blue);
 }
 
-nav li:first-child a {
-  margin-left: 0;
+li.nav-active a {
+  font-weight: bold;
+  box-shadow: .2rem .2rem var(--dark-yellow);
 }
 
 nav a:active {
-  color: #000;
-  background: #fff;
   box-shadow: 0 0;
 }
 
@@ -66,18 +77,6 @@ ul {
   padding: 0;
 }
 
-h1 {
-  font-size: 130%;
-}
-
-h2 {
-  font-size: 120%;
-}
-
-h3 {
-  font-size: 110%;
-}
-
 p {
   text-align: justify;
   hyphens: auto;
@@ -102,6 +101,18 @@ a:active {
   border: 1px solid var(--dark-blue);
 }
 
+h1 {
+  font-size: 130%;
+}
+
+h2 {
+  font-size: 120%;
+}
+
+h3 {
+  font-size: 110%;
+}
+
 table {
   border-collapse: collapse;
   text-align: left;
diff --git a/themes/aoidh/layouts/_partials/menu.html b/themes/aoidh/layouts/_partials/menu.html
index 485fe0b..b053791 100644
--- a/themes/aoidh/layouts/_partials/menu.html
+++ b/themes/aoidh/layouts/_partials/menu.html
@@ -21,13 +21,13 @@ Renders a menu for the given menu ID.
 {{- define "_partials/inline/menu/walk.html" }}
   {{- $page := .page }}
   {{- range .menuEntries }}
-    <li>
+    <li
+    {{ if $page.IsMenuCurrent .Menu . }}
+      class="nav-active"
+    {{ else if $page.HasMenuCurrent .Menu . }}
+      class="nav-ancestor"
+    {{ end }}>
       <a
-      {{ if $page.IsMenuCurrent .Menu . }}
-        class="nav-active"
-      {{ else if $page.HasMenuCurrent .Menu . }}
-        class="nav-ancestor"
-      {{ end }}
       {{ printf "href=%q" .URL | safeHTMLAttr }}
       >{{ .Name }}</a>
       {{- with .Children }}