[Libreoffice-commits] online.git: loleaflet/css loleaflet/src

[Pedro Pinto Silva (via logerrit)]

 loleaflet/css/toolbar-mobile.css              |    6 +++---
 loleaflet/src/control/Control.MobileWizard.js |    2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

New commits:
commit c92682c8132786cf5bee7c3468ba338220465324
Author:     Pedro Pinto Silva <pedro.silva at collabora.com>
AuthorDate: Fri Jan 17 13:56:42 2020 +0100
Commit:     Pedro Pinto da Silva <pedro.silva at collabora.com>
CommitDate: Fri Jan 17 14:05:25 2020 +0100

    Mobile: Scroll indicators (shows the user he can swipe to see more):
    - Use shadow instead of background gradient in order to have more granular control over the result (multiple shadows)
    - [Toolbar]: decrease indicators width to 0; [MobileWizard]: decrease indicators height to 0
      - ^ to avoid mistaps. We now have larger "gradients" with 0 space from the element which allows any elmente that is underneath to be tappable
    
    Change-Id: Ie329ed4e85d7342ab9cdc90f89cfdc8663e73da7
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/86979
    Reviewed-by: Pedro Pinto da Silva <pedro.silva at collabora.com>
    Tested-by: Pedro Pinto da Silva <pedro.silva at collabora.com>

diff --git a/loleaflet/css/toolbar-mobile.css b/loleaflet/css/toolbar-mobile.css
index 75259e00f..b94857006 100644
--- a/loleaflet/css/toolbar-mobile.css
+++ b/loleaflet/css/toolbar-mobile.css
@@ -38,11 +38,11 @@
 		display: none;
 	}
 	#toolbar-down .w2ui-scroll-left, #toolbar-down .w2ui-scroll-right{
-		background: linear-gradient(to left, #fff0 0%, #ccc 98%, #bbb 100%);
+		background: none;
 		height: 100%;
-		width: 18px;
+		width: 0px;
 		top: 0%;
-		box-shadow: none;
+		box-shadow: 8px 0 13px 2px #0b87e7, -6px 0px 6px 6px #007cdc;
 		border-radius: 0px;
 	}
 	#toolbar-down .w2ui-scroll-right{
diff --git a/loleaflet/src/control/Control.MobileWizard.js b/loleaflet/src/control/Control.MobileWizard.js
index 59c31974e..02fdc05cf 100644
--- a/loleaflet/src/control/Control.MobileWizard.js
+++ b/loleaflet/src/control/Control.MobileWizard.js
@@ -60,7 +60,7 @@ L.Control.MobileWizard = L.Control.extend({
 		var docType = this._map.getDocType();
 		var maxScrolled = 52;
 		if (ContentsLength > 1 || docType != 'spreadsheet')
-			$('#mobile-wizard-content').prepend('<div id="mobile-wizard-scroll-indicator" style="width: 100%;height: 40px;position: fixed;z-index: 2;bottom: 0;background: linear-gradient(#fff0 20%, #0b87e7 400%);"></div>');
+			$('#mobile-wizard-content').append('<div id="mobile-wizard-scroll-indicator" style="width: 100%;height: 0px;position: fixed;z-index: 2;bottom: -7px;box-shadow: 0 -8px 20px 4px #0b87e770, 0 1px 10px 6px #0b87e7;"></div>');
 		if (docType == 'spreadsheet')
 			maxScrolled = 41;
 		$('#mobile-wizard').show();