Leilukin
/
leilukin-site
mirror of https://github.com/helenclx/leilukin-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Rename sticky navbar class

This commit is contained in:
Helen Chong 2024-04-18 13:17:05 +08:00
parent 4797d9ee8c
commit 297f88bae3
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/_includes/main/navbar.njk
View File

@ -46,7 +46,7 @@
} }
/* Added to the navbar with JS when it reaches its scroll position */ /* Added to the navbar with JS when it reaches its scroll position */
.sticky-nav { .nav--sticky {
position: fixed; position: fixed;
width: 100%; width: 100%;
top: 0; top: 0;
@ -55,7 +55,7 @@
/* Add some top padding to the page content to prevent sudden quick movement /* Add some top padding to the page content to prevent sudden quick movement
as the navigation bar gets a new position at the top of the page as the navigation bar gets a new position at the top of the page
(position:fixed and top:0) */ (position:fixed and top:0) */
.sticky-nav + main { .nav--sticky + main {
padding-top: 2rem; padding-top: 2rem;
} }
</style> </style>
@ -68,9 +68,9 @@
const scrollPos = window.scrollY || document.documentElement.scrollTop; const scrollPos = window.scrollY || document.documentElement.scrollTop;
const stickyLine = hero.scrollHeight - navbar.scrollHeight; const stickyLine = hero.scrollHeight - navbar.scrollHeight;
if (scrollPos > stickyLine) { if (scrollPos > stickyLine) {
navbar.classList.add("sticky-nav"); navbar.classList.add("nav--sticky");
} else { } else {
navbar.classList.remove("sticky-nav"); navbar.classList.remove("nav--sticky");
} }
}); });
</script> </script>