From ed2ca985029021dbb632534cbf32d8fc7a7a1e5d Mon Sep 17 00:00:00 2001
From: Sagar Vora <sagar@resilient.tech>
Date: Mon, 3 May 2021 16:03:03 +0530
Subject: [PATCH] fix: hide scrollbar on touch devices

---
 frappe/public/scss/common/modal.scss   | 17 +++++++++++++++++
 frappe/public/scss/desk/scrollbar.scss |  4 ++--
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/frappe/public/scss/common/modal.scss b/frappe/public/scss/common/modal.scss
index 797509a466..19975610e2 100644
--- a/frappe/public/scss/common/modal.scss
+++ b/frappe/public/scss/common/modal.scss
@@ -13,6 +13,22 @@ body.modal-open[style^="padding-right"] {
 }
 
 .modal {
+	// Same scrollbar as body
+	scrollbar-width: auto;
+	&::-webkit-scrollbar {
+		width: 12px;
+		height: 12px;
+	}
+
+	// Hide scrollbar on touch devices
+	@media(max-width: 991px) {
+		scrollbar-width: none;
+		&::-webkit-scrollbar {
+			width: 0;
+			height: 0;
+		}
+	}
+
 	.modal-content {
 		border-color: var(--border-color);
 	}
@@ -29,6 +45,7 @@ body.modal-open[style^="padding-right"] {
 			font-weight: 500;
 			line-height: 2em;
 			font-size: $font-size-lg;
+			max-width: calc(100% - 80px);
 		}
 
 		.modal-actions {
diff --git a/frappe/public/scss/desk/scrollbar.scss b/frappe/public/scss/desk/scrollbar.scss
index ea6388d567..d8fb49e5ce 100644
--- a/frappe/public/scss/desk/scrollbar.scss
+++ b/frappe/public/scss/desk/scrollbar.scss
@@ -4,7 +4,7 @@
 	scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);
 }
 
-html, .modal {
+html {
 	scrollbar-width: auto;
 }
 
@@ -23,7 +23,7 @@ html, .modal {
 	height: 6px;
 }
 
-body::-webkit-scrollbar, .modal::-webkit-scrollbar {
+body::-webkit-scrollbar {
 	width: 12px;
 	height: 12px;
 }