From 752ff9c0aa3fdcfcc382a26f84a3d4dbe8696c7d Mon Sep 17 00:00:00 2001
From: infeeeee <gyetpet@mailbox.org.com>
Date: Fri, 6 Sep 2019 21:37:20 +0200
Subject: [PATCH] black icons on scroll on mobile

---
 css/base.css   |  6 ++++++
 js/scripts.js  | 52 ++++++++++++++++++++++++++++++++++++--------------
 sass/base.scss |  8 ++++++++
 3 files changed, 52 insertions(+), 14 deletions(-)

diff --git a/css/base.css b/css/base.css
index 8cf9c5b..8efa40f 100644
--- a/css/base.css
+++ b/css/base.css
@@ -285,6 +285,9 @@ html *::selection {
       background-repeat: no-repeat;
       width: 5rem;
       height: 5rem; }
+      .wrapper .header .dis-logo.black {
+        background-image: url(../img/dis-logo-black.png);
+        background-image: url(../img/dis-logo-black.svg); }
       @media (min-width: 769px) {
         .wrapper .header .dis-logo {
           background-image: url(../img/dis-logo-black.png);
@@ -338,6 +341,9 @@ html *::selection {
         .wrapper .header .menubutton-icon {
           background-image: url(../img/dis-plus-black.png);
           background-image: url(../img/dis-plus-black.svg); } }
+      .wrapper .header .menubutton-icon.black {
+        background-image: url(../img/dis-plus-black.png);
+        background-image: url(../img/dis-plus-black.svg); }
     .wrapper .header .kereso-icon {
       background-image: url(../img/kereso_icon-white.png);
       background-image: url(../img/kereso_icon-white.svg); }
diff --git a/js/scripts.js b/js/scripts.js
index c6f6a32..b906d78 100644
--- a/js/scripts.js
+++ b/js/scripts.js
@@ -132,23 +132,38 @@
 		var isMasonryPage = isArchive || isHome || isSearch || isSearchNoResults
 
 
-		/* ========================================================================== */
-		/*                                  FUNCTIONS                                 */
-		/* ========================================================================== */
+		/* -------------------------------------------------------------------------- */
+		/*                       Black logo on scroll on mobile                       */
+		/* -------------------------------------------------------------------------- */
 
+		$.fn.scrollStopped = function (callback) {
+			var that = this, $this = $(that);
+			$this.scroll(function (ev) {
+				clearTimeout($this.data('scrollTimeout'));
+				$this.data('scrollTimeout', setTimeout(callback.bind(that), 250, ev));
+			});
+		};
 
-		var rotateMenuButton = function () {
-			if ($(".menubutton button").hasClass("rotated")) {
-				$(".menubutton button").removeClass("rotated");
-			} else {
-				$(".menubutton button").addClass("rotated").addClass("inverted");
-			}
+		var isMenuOpen = function () {
+			let menuopen = ($('#sidebar').attr('data-simplersidebar') == 'opened') ? true : false
+			return menuopen
 		}
 
+		$(window).scroll(function () {
+			if (isMobile && !isMenuOpen()) {
+				$('.dis-logo, .menubutton-icon').addClass('black')
+			}
+		})
 
-		/* ========================================================================== */
+		$(window).scrollStopped(function () {
+			if (isMobile && !isMenuOpen()) {
+				$('.dis-logo, .menubutton-icon').removeClass('black')
+			}
+		})
+
+		/* -------------------------------------------------------------------------- */
 		/*                                   SEARCH                                   */
-		/* ========================================================================== */
+		/* -------------------------------------------------------------------------- */
 
 		// on mobile add to sidebar:
 		// if (isMobile) {
@@ -182,6 +197,13 @@
 		/*                                    MENU                                    */
 		/* ========================================================================== */
 
+		var rotateMenuButton = function () {
+			if ($(".menubutton button").hasClass("rotated")) {
+				$(".menubutton button").removeClass("rotated");
+			} else {
+				$(".menubutton button").addClass("rotated").addClass("inverted");
+			}
+		}
 
 		function mwCalc() {
 			let ww = calcWidths()
@@ -230,12 +252,12 @@
 				},
 				callbacks: {
 					animation: {
-						open: function (){
+						open: function () {
 							if (isMobile) {
-								$('.social-link, .events-link').removeClass('hidden')	
+								$('.social-link, .events-link').removeClass('hidden')
 							}
 						},
-						close: function () { 
+						close: function () {
 							$(".menubutton button").removeClass("inverted")
 							if (isMobile) {
 								$('.social-link, .events-link').addClass('hidden')
@@ -653,6 +675,8 @@
 			}
 		}
 
+		/* -------------------------- on scroll on desktop -------------------------- */
+
 		var scrolltimer = false;
 		$(window).on('wheel DOMMouseScroll', function (e) {
 			//e.preventDefault();
diff --git a/sass/base.scss b/sass/base.scss
index 1b57641..3a21a34 100644
--- a/sass/base.scss
+++ b/sass/base.scss
@@ -543,6 +543,10 @@ $v-unit-6: 24rem;
       background-repeat: no-repeat;
       width: $h-unit-1;
       height: $h-unit-1;
+      &.black {
+        background-image: url(../img/dis-logo-black.png);
+        background-image: url(../img/dis-logo-black.svg);
+      }
 
       @media #{$tablet} {
         background-image: url(../img/dis-logo-black.png);
@@ -596,6 +600,10 @@ $v-unit-6: 24rem;
 
     .menubutton-icon {
       @include bw-icon(dis-plus);
+      &.black {
+        background-image: url(../img/dis-plus-black.png);
+        background-image: url(../img/dis-plus-black.svg);
+      }
     }
 
     .kereso-icon {