From 2084a39d715cac129602d0c67628e96d0a1546e6 Mon Sep 17 00:00:00 2001
From: mahmoud adel <58145645+mahmoudadel54@users.noreply.github.com>
Date: Fri, 10 May 2024 16:57:16 +0300
Subject: [PATCH] #10214: Mobile issue - Overlay of tools and info (#10276)

---
 web/client/plugins/widgets/WidgetsTray.jsx  | 10 +++++++---
 web/client/themes/default/less/leaflet.less |  4 ++--
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/web/client/plugins/widgets/WidgetsTray.jsx b/web/client/plugins/widgets/WidgetsTray.jsx
index e7fb103449..f7cb79a639 100644
--- a/web/client/plugins/widgets/WidgetsTray.jsx
+++ b/web/client/plugins/widgets/WidgetsTray.jsx
@@ -22,6 +22,7 @@ import WidgetsBar from './WidgetsBar';
 import BButton from '../../components/misc/Button';
 import {mapLayoutValuesSelector} from "../../selectors/maplayout";
 import {withContainerDimensions} from "./withContainerDimensions";
+import { is3DMode } from '../../selectors/maptype';
 
 const Button = tooltip(BButton);
 
@@ -81,7 +82,9 @@ class WidgetsTray extends React.Component {
         expanded: PropTypes.bool,
         setExpanded: PropTypes.func,
         layout: PropTypes.object,
-        isSingleWidgetLayout: PropTypes.bool
+        isSingleWidgetLayout: PropTypes.bool,
+        isMobileAgent: PropTypes.bool,
+        is3DMap: PropTypes.bool
     };
     static defaultProps = {
         enabled: true,
@@ -94,7 +97,7 @@ class WidgetsTray extends React.Component {
         return this.props.enabled
             ? (<div className="widgets-tray"
                 style={{
-                    marginBottom: 32,
+                    marginBottom: this.props.isMobileAgent && !this.props.is3DMap ? 60 : 32,
                     marginRight: (this.props.layout?.right ?? 0) + 65,
                     bottom: 0,
                     right: 0,
@@ -124,7 +127,8 @@ export default compose(
         trayWidgets,
         state => state.browser && state.browser.mobile,
         (state) => mapLayoutValuesSelector(state, { right: true }),
-        (widgets, isMobileAgent, layout = []) => ({ widgets, layout, isMobileAgent })
+        is3DMode,
+        (widgets, isMobileAgent, layout = [], is3DMap) => ({ widgets, layout, isMobileAgent, is3DMap })
     ), {
         toggleTray
     }),
diff --git a/web/client/themes/default/less/leaflet.less b/web/client/themes/default/less/leaflet.less
index 0bc237590f..d9bbe1d10a 100644
--- a/web/client/themes/default/less/leaflet.less
+++ b/web/client/themes/default/less/leaflet.less
@@ -71,8 +71,8 @@
 }
 
 .leaflet-control-scale {
-    top: 10px;
-    right: 10px;
+    bottom: 5px;
+    right: 55px ;
     clear: none;
     z-index: 1000;
 }