Add navigation highlighting

nushackers · Jul 1, 2017 · e5df2f0 · e5df2f0
1 parent 81783a8
commit e5df2f0
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
@@ -4,9 +4,9 @@ <h1 class="banner-text"><a href="/" title="NUS Hackers" rel="home" class="banner
   </div>
   <nav class="nav col-12 col-sm-8 col-lg-6 offset-lg-2">
     <ul class="nav-menu">
-      {{ $currentPage := . }}
+      {{ $currentURL := .URL }}
       {{ range .Site.Menus.main }}
-      <li class="nav-menu-item"><a class="nav-menu-link{{ if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} nav-menu-active{{ end }}" href="{{ .URL }}">{{ .Name }}</a></li>
+      <li class="nav-menu-item{{ if in $currentURL .URL}} nav-menu-active{{ end }}"><a class="nav-menu-link" href="{{ .URL }}">{{ .Name }}</a></li>
       {{ end }}
     </ul>
   </nav>

diff --git a/static/scss/header.scss b/static/scss/header.scss
@@ -45,10 +45,10 @@
     text-decoration: none;
     color: black;
   }
-  .nav-menu-item:hover {
+  .nav-menu-active, .nav-menu-item:hover {
     background: $highlight-orange;
   }
-  .nav-menu-item:hover .nav-menu-link {
+  .nav-menu-active .nav-menu-link, .nav-menu-item:hover .nav-menu-link {
     text-decoration: none;
     color: white;
   }