Fix navbar highlighting for nested paths

layouts/_default/baseof.html

@@ -38,8 +38,11 @@
                         <nav class="d-flex justify-content-center my-3">
                             <ul class="nav nav-pills">
                                 {{ $p := . }}
+                                {{ $basePath := path.Clean (urls.Parse .Site.BaseURL).Path }}
                                 {{ range .Site.Menus.main }}
-                                {{ $active := or (and (eq .URL `/`) (eq $p.RelPermalink `/`)) (and (ne .URL `/`) (hasPrefix $p.RelPermalink .URL)) }}
+                                {{ $pagePath := strings.TrimPrefix $basePath $p.RelPermalink }}
+                                {{ $menuPath := strings.TrimPrefix $basePath .URL }}
+                                {{ $active := or (and (eq $menuPath `/`) (eq $pagePath `/`)) (and (ne $menuPath `/`) (hasPrefix $pagePath $menuPath)) }}
                                 <li class="nav-item"><a href="{{ .URL }}" class="nav-link{{if $active }} active{{ end }}">{{ .Name }}</a></li>
                                 {{ end }}
                             </ul>

layouts/home.html

@@ -13,7 +13,7 @@
 {{ end }}
 <div class="row py-3">
     <div class="col">
-        <div class="rounded-4" style="background-image: url('/cover.jpg'); background-position: center; background-size: cover; height: 20rem; max-width: 100%"></div>
+      <div class="rounded-4" style="background-image: url('{{ .Site.BaseURL }}/cover.jpg'); background-position: center; background-size: cover; height: 20rem; max-width: 100%"></div>
     </div>
 </div>
 <div class="d-flex justify-content-center py-3 row">
@@ -24,7 +24,7 @@
                 <p class="lead">{{ .Params.blurb | markdownify }}</p>
             </div>
             <div class="col-12 col-md-6 text-center">
-                <img alt="Avatar" class="img-fluid rounded-4" src="/avatar.jpg" style="max-height:20rem">
+                <img alt="Avatar" class="img-fluid rounded-4" src="{{ .Site.BaseURL }}/avatar.jpg" style="max-height:20rem">
             </div>
         </div>
     </div>