This commit is contained in:
Rémy Jacquin 2025-07-12 10:02:39 +00:00 committed by GitHub
commit 1b82cc215d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 27 additions and 9 deletions

View file

@ -2,8 +2,9 @@ const updateNavBar = () => {
const topNavbar = document.getElementById('top-navbar')
const navbarToggler = document.getElementById('navbar-toggler')
const themeIcon = document.getElementById('navbar-theme-icon-svg')
const scrollContainer = document.querySelector('body');
if (window.scrollY > 40) {
if (scrollContainer.scrollTop > 40) {
topNavbar?.classList.remove('transparent-navbar')
topNavbar?.classList.add('shadow')
@ -44,8 +45,9 @@ document.addEventListener('DOMContentLoaded', function () {
// When the user scrolls down 80px from the top of the document,
// resize the navbar's padding and the logo's font size
const topNavbar = document.getElementById('top-navbar')
const scrollContainer = document.querySelector('body');
if (topNavbar?.classList.contains('homepage')) {
document.addEventListener('scroll', updateNavBar)
scrollContainer.addEventListener('scroll', updateNavBar)
updateNavBar()
}

View file

@ -4,12 +4,28 @@
See: https://css-tricks.com/snippets/jquery/smooth-scrolling/
*/
*,
html {
html,
:not(.dropdown) {
scroll-behavior: smooth !important;
overflow-y: hidden;
}
body {
position: relative;
overflow-y: scroll;
height: 100vh;
}
body.scroll-container {
scroll-snap-type: y mandatory;
}
/*
Enable scroll snap for home page
*/
div#home,
div.section-holder {
scroll-snap-align: start;
}
/*

View file

@ -23,7 +23,7 @@
</script>
{{ end }}
</head>
<body data-bs-spy="scroll" data-bs-target="#top-navbar" data-bs-offset="100">
<body data-bs-spy="scroll" data-bs-target="#top-navbar" data-bs-offset="100" {{ if site.Params.features.scrollSnap.enable | default false }}class="scroll-container"{{end}}>
<!--- NAVBAR ------------------------->
{{- partial "navigators/navbar.html" . -}}