fix: dynamically measure navbar height for hero section sizing

This commit is contained in:
2026-03-01 15:02:32 -05:00
parent 723fe845df
commit 8755ddd539

View File

@@ -10,7 +10,7 @@
{{-- ═══════════════════════════════════════════════════════════════
SECTION 1 — HERO (full viewport, always visible)
═══════════════════════════════════════════════════════════════ --}}
<section class="relative flex items-center overflow-hidden" style="min-height: calc(100vh - 4rem);">
<section class="relative flex items-center overflow-hidden" style="min-height: calc(100dvh - var(--nav-h, 4rem));">
<!-- Parallax ambient blobs -->
<div class="absolute inset-0 pointer-events-none overflow-hidden">
<div class="absolute -top-40 -right-40 w-[500px] h-[500px] bg-primary/20 rounded-full blur-[120px] animate-pulse"
@@ -840,4 +840,15 @@
observe();
document.addEventListener('livewire:navigated', observe);
})();
/* ── Dynamically measure navbar height ── */
(function () {
function setNavH() {
const nav = document.querySelector('nav.fixed');
if (nav) document.documentElement.style.setProperty('--nav-h', nav.offsetHeight + 'px');
}
setNavH();
window.addEventListener('resize', setNavH);
document.addEventListener('livewire:navigated', setNavH);
})();
</script>