Fixed navbar scroll spy (#798) (#799)

* Fixed navbar scroll spy

* Created get-section-url helper

* Fix URL for home section

Signed-off-by: hossainemruz <hossainemruz@gmail.com>

---------

Signed-off-by: hossainemruz <hossainemruz@gmail.com>
Co-authored-by: Emruz Hossain <hossainemruz@gmail.com>

assets/styles/layouts/main.scss

@@ -8,6 +8,10 @@ html {
   scroll-behavior: smooth !important;
 }
 
+body {
+  position: relative;
+}
+
 /*
   Fixes anchor overlapping with header.
   See: https://stackoverflow.com/questions/4086107/fixed-page-header-overlaps-in-page-anchors 

layouts/partials/helpers/get-section-url.html

@@ -0,0 +1,5 @@
+{{- if page.IsHome -}}
+    #{{ partial "helpers/get-section-id.html" . }}
+{{- else -}}
+    {{ site.BaseURL | relLangURL }}#{{ partial "helpers/get-section-id.html" . }}
+{{- end -}}

layouts/partials/navigators/navbar.html

@@ -77,9 +77,9 @@
     </button>
 
     <div class="collapse navbar-collapse dynamic-navbar" id="top-nav-items">
-      <ul class="navbar-nav ml-auto">
+      <ul class="nav navbar-nav ml-auto">
         <li class="nav-item">
-          <a class="nav-link" href="{{ site.BaseURL | relLangURL }}#home">{{ i18n "home" }}</a>
+          <a class="nav-link" href="{{ if .IsHome }}#home{{else}}{{ site.BaseURL | relLangURL }}#home{{end}}">{{ i18n "home" }}</a>
         </li>
         {{ if $sections }}
           {{ $sectionCount := 1 }}
@@ -88,7 +88,7 @@
               {{ $sectionCount  = add $sectionCount 1}}
               {{ if le $sectionCount $maxVisibleSections }}
                 <li class="nav-item">
-                  <a class="nav-link" href="{{ site.BaseURL | relLangURL }}#{{ partial "helpers/get-section-id.html" . }}">{{ .section.name }}</a>
+                  <a class="nav-link" href="{{ partial "helpers/get-section-url.html" . }}">{{ .section.name }}</a>
                 </li>
               {{ end }}
             {{ end }}
@@ -102,7 +102,7 @@
                   {{ if and (.section.enable) (.section.showOnNavbar) }}
                     {{ $sectionCount  = add $sectionCount 1}}
                     {{ if gt $sectionCount $maxVisibleSections }}
-                      <a class="dropdown-item" href="{{ site.BaseURL | relLangURL }}#{{ partial "helpers/get-section-id.html" . }}">{{ .section.name }}</a>
+                      <a class="dropdown-item" href="{{ partial "helpers/get-section-url.html" . }}">{{ .section.name }}</a>
                     {{ end }}
                   {{ end }}
                 {{- end }}