From ee5bb1747a6f19f9ca50ba98eb20d9ee3b2ce5a1 Mon Sep 17 00:00:00 2001 From: prototypa Date: Fri, 1 Dec 2023 11:04:47 -0500 Subject: [PATCH] Only apply shadow and other styles to sticky headers on scroll, issue #279 --- src/components/common/BasicScripts.astro | 2 +- src/components/widgets/Header.astro | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/common/BasicScripts.astro b/src/components/common/BasicScripts.astro index 9451c9a..28aa1b1 100644 --- a/src/components/common/BasicScripts.astro +++ b/src/components/common/BasicScripts.astro @@ -97,7 +97,7 @@ import { UI } from '~/utils/config'; }); function appyHeaderStylesOnScroll() { - const header = document.getElementById('header'); + const header = document.querySelector("#header[data-aw-sticky-header]"); if (lastKnownScrollPosition > 60 && !header.classList.contains('scroll')) { document.getElementById('header').classList.add('scroll'); } else if (lastKnownScrollPosition <= 60 && header.classList.contains('scroll')) { diff --git a/src/components/widgets/Header.astro b/src/components/widgets/Header.astro index bee8011..79866ab 100644 --- a/src/components/widgets/Header.astro +++ b/src/components/widgets/Header.astro @@ -54,6 +54,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}` { sticky: isSticky, relative: !isSticky, dark: isDark }, "top-0 z-40 flex-none mx-auto w-full border-b border-gray-50/0 transition-[opacity] ease-in-out", ]} + {...isSticky ? { "data-aw-sticky-header": true } : {}} {...id ? { id } : {}} >