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>
This commit is contained in:
David Davó 2023-10-06 20:38:18 +02:00 committed by GitHub
parent 03d263c4a1
commit 42d3c650f8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 4 deletions

View file

@ -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

View file

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

View file

@ -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 }}