Fix #2696 map rotation style for openlayers (#2820)

* fix #2696 aligned style of map rotation tool for ol * disable map rotation on openlayers
geosolutions-it · Apr 20, 2018 · a3d3cb0 · a3d3cb0
1 parent 3ee6dbb
commit a3d3cb0
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 1 deletion.
diff --git a/web/client/localConfig.json b/web/client/localConfig.json
@@ -98,6 +98,14 @@
         "mobile": [{
                 "name": "Map",
                 "cfg": {
+                    "mapOptions": {
+                      "openlayers": {
+                        "interactions": {
+                          "pinchRotate": false,
+                          "altShiftDragRotate": false
+                        }
+                      }
+                    },
                     "tools": ["locate"]
                 }
             }, "Version", "DrawerMenu",
@@ -195,6 +203,10 @@
             "cfg": {
               "mapOptions": {
                 "openlayers": {
+                  "interactions": {
+                    "pinchRotate": false,
+                    "altShiftDragRotate": false
+                  },
                   "attribution": {
                     "container": "#mapstore-map-footer-container"
                   }
@@ -349,8 +361,12 @@
                 "name": "Map",
                 "cfg": {
                     "tools": ["locate"],
-                  "mapOptions": {
+                    "mapOptions": {
                     "openlayers": {
+                      "interactions": {
+                        "pinchRotate": false,
+                        "altShiftDragRotate": false
+                      },
                       "attribution": {
                         "container": "#mapstore-map-footer-container"
                       }

diff --git a/web/client/themes/default/less/ol.less b/web/client/themes/default/less/ol.less
@@ -115,3 +115,27 @@ div.ol-scale-line-inner {
         border-top-color: #ffcc33;
     }
 }
+
+.ol-rotate {
+    width: @square-btn-size;
+    height: @square-btn-size;
+    background: none;
+    margin-right: 7px;
+    .ol-rotate-reset {
+        box-shadow: -1px 1px 5px 1px #5e5e5e;
+        height: @square-btn-size;
+        width: @square-btn-size;
+        color: @ms2-color-text-primary;
+        background-color: @ms2-color-primary;
+        border-color: @btn-primary-border;
+        .ol-compass {
+            font-size: 36px;
+        }
+    }
+    .ol-rotate-reset:hover, .ol-rotate-reset:focus {
+        background-color: darken(@ms2-color-primary, 5%);
+    }
+}
+.ol-rotate:hover {
+    background: none;
+}