@eeacms/volto-marine-policy 2.0.33 → 2.0.35

package/CHANGELOG.md

@@ -4,11 +4,24 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-### [2.0.33](https://github.com/eea/volto-marine-policy/compare/2.0.32...2.0.33) - 22 October 2025
+### [2.0.35](https://github.com/eea/volto-marine-policy/compare/2.0.34...2.0.35) - 3 November 2025
+
+#### :rocket: New Features
+
+- feat: new icons for Demo site explorer [laszlocseh - [`cbde97c`](https://github.com/eea/volto-marine-policy/commit/cbde97c9ff6ff209d9e3f0d4dbbf2d4338730f18)]
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`2246072`](https://github.com/eea/volto-marine-policy/commit/22460723524bce84c7f48ed2bb8cd38e7ec78ecc)]
+- style: Automated code fix [eea-jenkins - [`ac39190`](https://github.com/eea/volto-marine-policy/commit/ac39190f1c45b3f08d64222f188ae21bc924ef12)]
 
 #### :hammer_and_wrench: Others
 
-- update demo sites map marine protected areas [laszlocseh - [`20ff428`](https://github.com/eea/volto-marine-policy/commit/20ff4280bc26593126566718993d16a0c36574cc)]
+- fix eslint [laszlocseh - [`55aaaae`](https://github.com/eea/volto-marine-policy/commit/55aaaaeb97d54a49f8ee0acaf8b6bd8987ef1d47)]
+### [2.0.34](https://github.com/eea/volto-marine-policy/compare/2.0.33...2.0.34) - 29 October 2025
+
+### [2.0.33](https://github.com/eea/volto-marine-policy/compare/2.0.32...2.0.33) - 22 October 2025
+
 ### [2.0.32](https://github.com/eea/volto-marine-policy/compare/2.0.31...2.0.32) - 21 October 2025
 
 #### :rocket: New Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-marine-policy",
-  "version": "2.0.33",
+  "version": "2.0.35",
   "description": "@eeacms/volto-marine-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/components/Blocks/DemoSitesExplorer/DemoSitesExplorerView.js

@@ -140,13 +140,21 @@ export default function DemoSitesExplorerView(props) {
                     {/* <div className="legend-row legend-subtitle">Legend</div> */}
                     <div className="legend-row">
                       <div className="circle">
-                        <div className="dot-demosite"></div>
+                        {/* <div className="dot-demosite"></div> */}
+                        <img
+                          src="/marine/europe-seas/eu-mission-restore-our-oceans-and-water/icon-point.png/@@images/image/small"
+                          alt=""
+                        />
                       </div>
                       <div>Demo site</div>
                     </div>
                     <div className="legend-row">
                       <div className="circle">
-                        <div className="dot-region"></div>
+                        {/* <div className="dot-region"></div> */}
+                        <img
+                          src="/marine/europe-seas/eu-mission-restore-our-oceans-and-water/icon-region.png/@@images/image/small"
+                          alt=""
+                        />
                       </div>
                       <div>Associated region</div>
                     </div>

package/src/components/Blocks/DemoSitesExplorer/DemoSitesMap.jsx

@@ -62,7 +62,6 @@ function DemoSitesMap(props) {
         // LAYERS: 'OSMBlossomComposite', OSMCartoComposite, OSMPositronComposite
         LAYERS: 'OSMPositronComposite',
         TILED: true,
-        DPI: 192,
       },
       serverType: 'geoserver',
       transition: 0,
@@ -151,6 +150,7 @@ function DemoSitesMap(props) {
           showFullExtent: true,
           zoom: 3.4,
         }}
+        pixelRatio={1}
         // pixelRatio={window.devicePixelRatio || 1}
         // controls={ol.control.defaults({ attribution: false })}
       >
@@ -250,22 +250,34 @@ const selectedClusterStyle = ({ selectedFeature, ol, enableMarineMO }) => {
         });
       } else {
         // let color = feature.values_.features[0].values_['color'];
-        let color = '#0179cf';
-        let width = feature.values_.features[0].values_['width'];
-        let radius = feature.values_.features[0].values_['radius'];
-        // console.log(color)
-        // let color = '#0083E0'; // #0083E0 #50B0A4
+        // type_is_region
+        // let color = '#0179cf';
+        // let width = feature.values_.features[0].values_['width'];
+        // let radius = feature.values_.features[0].values_['radius'];
+
+        // return new ol.style.Style({
+        //   image: new ol.style.Circle({
+        //     radius: radius,
+        //     fill: new ol.style.Fill({
+        //       color: '#fff',
+        //     }),
+        //     stroke: new ol.style.Stroke({
+        //       color: color,
+        //       width: width,
+        //     }),
+        //   }),
+        // });
+        let iconUrl =
+          feature.values_.features[0].values_['type_is_region'] ===
+          'Associated region'
+            ? '/marine/europe-seas/eu-mission-restore-our-oceans-and-water/icon-region.png/@@images/image/icon'
+            : '/marine/europe-seas/eu-mission-restore-our-oceans-and-water/icon-point.png/@@images/image/icon';
 
         return new ol.style.Style({
-          image: new ol.style.Circle({
-            radius: radius,
-            fill: new ol.style.Fill({
-              color: '#fff',
-            }),
-            stroke: new ol.style.Stroke({
-              color: color,
-              width: width,
-            }),
+          image: new ol.style.Icon({
+            anchor: [0.5, 1],
+            scale: 0.8,
+            src: iconUrl,
           }),
         });
       }

package/src/components/Blocks/DemoSitesExplorer/styles.less

@@ -433,12 +433,11 @@
 
   .circle {
     position: relative;
-    width: 22px;
+    width: 30px;
     min-width: 22px;
     height: 22px;
     border-radius: 50%;
-    // background-color: #007265;
-    background-color: #0179cf;
+    // background-color: #0179cf;
     gap: 0.5em;
   }