From 7a9536332eb862d359e5bf0d0b9819b758dc45d7 Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Tue, 22 Mar 2022 09:16:39 +0530
Subject: [PATCH] feat: Hide page head while scrolling down

- To create more reading area in the form
---
 frappe/public/js/frappe/ui/page.js | 14 +++++++++-----
 frappe/public/scss/desk/page.scss  |  1 +
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frappe/public/js/frappe/ui/page.js b/frappe/public/js/frappe/ui/page.js
index 91a2390cdb..e3134b1f38 100644
--- a/frappe/public/js/frappe/ui/page.js
+++ b/frappe/public/js/frappe/ui/page.js
@@ -47,13 +47,17 @@ frappe.ui.Page = class Page {
 	}
 
 	setup_scroll_handler() {
-		window.addEventListener('scroll', () => {
-			if (document.documentElement.scrollTop) {
-				$('.page-head').toggleClass('drop-shadow', true);
+		let last_scroll = 0;
+		window.addEventListener('scroll', frappe.utils.throttle(() => {
+			$('.page-head').toggleClass('drop-shadow', !!document.documentElement.scrollTop);
+			let current_scroll = document.documentElement.scrollTop;
+			if (current_scroll > 0 && last_scroll <= current_scroll) {
+				$('.page-head').css("top", "-15px");
 			} else {
-				$('.page-head').removeClass('drop-shadow');
+				$('.page-head').css("top", "var(--navbar-height)");
 			}
-		});
+			last_scroll = current_scroll;
+		}), 500);
 	}
 
 	get_empty_state(title, message, primary_action) {
diff --git a/frappe/public/scss/desk/page.scss b/frappe/public/scss/desk/page.scss
index f0a9152cfb..2df349cb6c 100644
--- a/frappe/public/scss/desk/page.scss
+++ b/frappe/public/scss/desk/page.scss
@@ -88,6 +88,7 @@
 	top: var(--navbar-height);
 	background: var(--bg-color);
 	margin-bottom: 5px;
+	transition: 0.5s top;
 	.page-head-content {
 		height: var(--page-head-height);
 	}