From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Thu, 5 Sep 2019 15:53:38 +0000 (+0200)
Subject: fix #3003 @0.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=b2ba59e82aeb532cdb7e6501d5f5dd3dfade0e8c;p=pmi.git

fix #3003 @0.5
---

diff --git a/resources/js/app.js b/resources/js/app.js
index 261a0ca..eb2a499 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -123,17 +123,23 @@ const app = new Vue({
 
 });
 
-window.addEventListener('scroll', function () {
+
+function getBodyScrollTop() {
+    const el = document.scrollingElement || document.documentElement;
+    return el.scrollTop
+}
+
+document.addEventListener('scroll', function () {
     checkScroll();
 }, {passive: true});
 
 function checkScroll() {
     window.headerHeight = 134;
-    var scroll = document.documentElement.scrollTop;
+    var scroll = getBodyScrollTop();
     if (scroll > 200) {
         document.getElementById('site-header').classList.add('minimized');
         window.headerHeight = 60;
-    } else if (scroll < 100) {
+    } else {
         document.getElementById('site-header').classList.remove('minimized');
     }
 }
diff --git a/resources/styles/components/header.styl b/resources/styles/components/header.styl
index 6bbe279..ad5117d 100644
--- a/resources/styles/components/header.styl
+++ b/resources/styles/components/header.styl
@@ -5,7 +5,7 @@
 
 .site-header
   --transition-duration 500ms
-  @apply bg-navy text-white text-lg font-display font-medium antialiased sticky top-0
+  @apply bg-navy text-white text-lg font-display font-medium antialiased fixed top-0
   transition height var(--transition-duration)
   width 100%
   z-index 100
diff --git a/resources/views/partials/header.blade.php b/resources/views/partials/header.blade.php
index 4260612..347e8d6 100644
--- a/resources/views/partials/header.blade.php
+++ b/resources/views/partials/header.blade.php
@@ -1,4 +1,5 @@
 @include('partials.nav-mobile')
+<div id="header-placeholder"></div>
 <header id="site-header" class="site-header">
     <div class="container flex items-center py-8 relative z-30">