#10214: Mobile issue - Overlay of tools and info (#10276) (#10314)

geosolutions-it · May 14, 2024 · 0fadc4a · 0fadc4a
1 parent 9a97500
commit 0fadc4a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git 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
@@ -71,8 +71,8 @@
 }
 
 .leaflet-control-scale {
-    top: 10px;
-    right: 10px;
+    bottom: 5px;
+    right: 55px ;
     clear: none;
     z-index: 1000;
 }