diff --git a/src/app/carto/carto.component.html b/src/app/carto/carto.component.html
index 887e418bf49f659574952a231539671a3bd8d67d..37b8c5ce0f6acda3fe8b51b6a96d430e04e9599e 100644
--- a/src/app/carto/carto.component.html
+++ b/src/app/carto/carto.component.html
@@ -24,7 +24,7 @@
[variant]="buttonTypeEnumV3.PrimaryBlack"
[label]="isMapPhone ? 'Liste' : 'Carte'"
[size]="'large'"
- [iconName]="isMapPhone ? 'liste' : 'map-markerButtonPhone'"
+ [iconName]="isMapPhone ? 'toggleList' : 'toggleMap'"
(action)="switchMapList()"
/>
</div>
diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss
index d5033106c0a04d2d9be620ff2ced12f07cd1a27b..d1176a3ed71ae1aff72a24fd068f543c767f27f2 100644
--- a/src/app/map/components/map.component.scss
+++ b/src/app/map/components/map.component.scss
@@ -46,10 +46,13 @@
/*** Marker ***/
::ng-deep .leaflet-marker-icon {
+ color: $red;
&:hover {
z-index: calc($map-selected-marker - 1) !important;
svg {
- fill: $primary-color-dark;
+ &:hover {
+ color: $black;
+ }
&.mdm {
fill: $gold;
}
diff --git a/src/app/map/services/marker.ts b/src/app/map/services/marker.ts
index c640c4a20df8b0d3fa715db930b697e700d81d46..c26978844f285e6b5d4d925d43cd6cbd8936fb10 100644
--- a/src/app/map/services/marker.ts
+++ b/src/app/map/services/marker.ts
@@ -2,21 +2,19 @@ import { divIcon } from 'leaflet';
export const markerIcon = divIcon({
className: null,
- html: '<svg width="48" height="48" fill="#4C4D53"><use xlink:href="assets/ico/sprite.svg#map-marker"></use></svg>',
- iconSize: [48, 48],
+ html: '<svg width="34" height="34" fill="#4C4D53"><use xlink:href="assets/ico/sprite.svg#map-marker"></use></svg>',
iconAnchor: [24, 48],
popupAnchor: [0, -48],
});
-export const markerIconActive = divIcon({
+export const markerIconHover = divIcon({
className: 'on-top-marker',
- html: '<svg width="48" height="48"><use xlink:href="assets/ico/sprite.svg#map-markerSelected"></use></svg>',
- iconSize: [48, 48],
+ html: '<svg width="34" height="34"><use xlink:href="assets/ico/sprite.svg#map-markerHover"></use></svg>',
iconAnchor: [24, 48],
popupAnchor: [0, -48],
});
-export const markerIconHover = divIcon({
+export const markerIconActive = divIcon({
className: 'on-top-marker',
- html: '<svg width="48" height="48"><use xlink:href="assets/ico/sprite.svg#map-markerHover"></use></svg>',
+ html: '<svg width="48" height="48"><use xlink:href="assets/ico/sprite.svg#map-markerSelected"></use></svg>',
iconSize: [48, 48],
iconAnchor: [24, 48],
popupAnchor: [0, -48],
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index 9e1cdda3711efe98b80bfa302a06130558fd9c36..1d69706bd48cb428ceb9b0f70bfe4b95d7c685ee 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -1,20 +1,22 @@
<svg xmlns="http://www.w3.org/2000/svg">
- <symbol id="map-marker" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
- <path
- d="M23.74 45.7307L24.4466 46.3909L25.1301 45.7067C27.1682 43.6665 29.1698 41.8435 31.0637 40.1188L31.2426 39.9559C37.5627 34.201 42.8674 29.3707 42.8674 21.463C42.8674 11.2671 34.6104 3 24.4227 3C14.2349 3 5.97791 11.2671 5.97791 21.463C5.97791 25.615 7.05764 28.6957 9.15679 31.6153C11.1977 34.4541 14.2063 37.1381 17.9903 40.514L18.0681 40.5834C19.7853 42.1155 21.6751 43.8015 23.74 45.7307ZM30.2489 21.463C30.2489 24.6856 27.6394 27.2963 24.4227 27.2963C21.2059 27.2963 18.5965 24.6856 18.5965 21.463C18.5965 18.2403 21.2059 15.6296 24.4227 15.6296C27.6394 15.6296 30.2489 18.2403 30.2489 21.463Z"
- stroke="white" stroke-width="2" />
+
+ <symbol id="map-marker" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="17" cy="17" r="17" fill="currentColor" fill-opacity="0.1" />
+ <circle cx="17" cy="17" r="7.5" fill="currentColor" stroke="white" />
</symbol>
- <symbol id="map-markerSelected" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
- <path
- d="M23.74 45.7307L24.4466 46.3909L25.1301 45.7067C27.1682 43.6665 29.1698 41.8435 31.0637 40.1188L31.2426 39.9559C37.5627 34.201 42.8674 29.3707 42.8674 21.463C42.8674 11.2671 34.6104 3 24.4227 3C14.2349 3 5.97791 11.2671 5.97791 21.463C5.97791 25.615 7.05764 28.6957 9.15679 31.6153C11.1977 34.4541 14.2063 37.1381 17.9903 40.514L18.0681 40.5834C19.7853 42.1155 21.6751 43.8015 23.74 45.7307ZM30.2489 21.463C30.2489 24.6856 27.6394 27.2963 24.4227 27.2963C21.2059 27.2963 18.5965 24.6856 18.5965 21.463C18.5965 18.2403 21.2059 15.6296 24.4227 15.6296C27.6394 15.6296 30.2489 18.2403 30.2489 21.463Z"
- fill="#da3635" stroke="white" stroke-width="2" />
+
+ <symbol id="map-markerHover" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="17" cy="17" r="17" fill="#333333" fill-opacity="0.1" />
+ <circle cx="17" cy="17" r="7.5" fill="#333333" stroke="white" />
</symbol>
- <symbol id="map-markerHover" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <symbol id="map-markerSelected" viewBox="0 0 34 44" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <ellipse cx="17" cy="39" rx="17" ry="5" fill="#333333" fill-opacity="0.25" />
<path
- d="M23.74 45.7307L24.4466 46.3909L25.1301 45.7067C27.1682 43.6665 29.1698 41.8435 31.0637 40.1188L31.2426 39.9559C37.5627 34.201 42.8674 29.3707 42.8674 21.463C42.8674 11.2671 34.6104 3 24.4227 3C14.2349 3 5.97791 11.2671 5.97791 21.463C5.97791 25.615 7.05764 28.6957 9.15679 31.6153C11.1977 34.4541 14.2063 37.1381 17.9903 40.514L18.0681 40.5834C19.7853 42.1155 21.6751 43.8015 23.74 45.7307ZM30.2489 21.463C30.2489 24.6856 27.6394 27.2963 24.4227 27.2963C21.2059 27.2963 18.5965 24.6856 18.5965 21.463C18.5965 18.2403 21.2059 15.6296 24.4227 15.6296C27.6394 15.6296 30.2489 18.2403 30.2489 21.463Z"
- fill="#B85959" stroke="white" stroke-width="2" />
+ d="M16.7837 36.7307L17.4904 37.3909L18.1739 36.7067C19.8607 35.0181 21.5177 33.5089 23.0886 32.0784C23.1471 32.025 23.2056 31.9718 23.264 31.9186C28.4811 27.1684 32.9328 23.1151 32.9328 16.4815C32.9328 7.93228 26.0092 1 17.4664 1C8.92355 1 2 7.93228 2 16.4815C2 19.9604 2.90658 22.5499 4.66826 25.0002C6.37177 27.3696 8.87867 29.6061 12.0062 32.3963L12.0831 32.4649C13.5072 33.7354 15.073 35.1324 16.7837 36.7307ZM22.1271 16.4815C22.1271 19.0598 20.0395 21.1481 17.4664 21.1481C14.8933 21.1481 12.8056 19.0598 12.8056 16.4815C12.8056 13.9032 14.8933 11.8148 17.4664 11.8148C20.0395 11.8148 22.1271 13.9032 22.1271 16.4815Z"
+ fill="#333333" stroke="white" stroke-width="2" />
+ <circle cx="17.5318" cy="16.5113" r="5.39024" fill="white" />
</symbol>
<symbol id="map-marker-added" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -27,12 +29,21 @@
fill="#47C562" />
</symbol>
- <symbol id="map-markerButtonPhone" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <symbol id="toggleMap" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M19.763 25.4357C23.8485 21.694 27 18.8077 27 14.0741C27 7.95803 22.0751 3 16 3C9.92487 3 5 7.95803 5 14.0741C5 19.075 7.5581 21.3702 12.4128 25.726C13.4953 26.6973 14.692 27.771 16 29C17.2972 27.6941 18.5699 26.5284 19.763 25.4357ZM16 18.4074C18.3772 18.4074 20.3043 16.4673 20.3043 14.0741C20.3043 11.6808 18.3772 9.74074 16 9.74074C13.6228 9.74074 11.6957 11.6808 11.6957 14.0741C11.6957 16.4673 13.6228 18.4074 16 18.4074Z"
stroke="white" stroke-width="1.5" stroke-linecap="round" />
</symbol>
+ <symbol id="toggleList" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="7.75" cy="10.75" r="0.75" fill="white" />
+ <rect x="10" y="10" width="15" height="1.5" rx="0.75" fill="white" />
+ <circle cx="7.75" cy="16.25" r="0.75" fill="white" />
+ <rect x="10" y="15.5" width="15" height="1.5" rx="0.75" fill="white" />
+ <circle cx="7.75" cy="21.75" r="0.75" fill="white" />
+ <rect x="10" y="21" width="15" height="1.5" rx="0.75" fill="white" />
+ </symbol>
+
<symbol id="adress" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M11 2C12.6055 2.0145 14.1397 2.68885 15.265 3.87463C16.3902 5.06042 17.0142 6.66048 16.9998 8.32269C16.9998 11.8208 12.1242 19 11 19C9.87584 19 5.00025 11.8208 5.00025 8.32269C4.98578 6.66048 5.60982 5.06042 6.73504 3.87463C7.86026 2.68885 9.39446 2.0145 11 2ZM10.9999 5.55695C12.0865 5.53677 13.0768 6.19906 13.5059 7.23274C13.9349 8.26643 13.7173 9.4661 12.9553 10.2683C12.1933 11.0704 11.0384 11.3157 10.0329 10.8888C9.02744 10.4619 8.37129 9.44779 8.37266 8.32272C8.36215 6.80858 9.53743 5.57133 10.9999 5.55695Z"
@@ -168,15 +179,6 @@
<path d="M4.78906 14.6543L8.15154 18.0168" stroke="#333333" stroke-width="1.5" />
</symbol>
- <symbol id="liste" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
- <circle cx="7.75" cy="10.75" r="0.75" fill="white" />
- <rect x="10" y="10" width="15" height="1.5" rx="0.75" fill="white" />
- <circle cx="7.75" cy="16.25" r="0.75" fill="white" />
- <rect x="10" y="15.5" width="15" height="1.5" rx="0.75" fill="white" />
- <circle cx="7.75" cy="21.75" r="0.75" fill="white" />
- <rect x="10" y="21" width="15" height="1.5" rx="0.75" fill="white" />
- </symbol>
-
<svg id="user" viewBox="0 0 28 25" xmlns="http://www.w3.org/2000/svg">
<path
d="M21.0256 13.9213C22.2638 12.4488 23 10.5413 23 8.5C22.9665 3.81496 19.185 0 14.5 0C9.81496 0 6 3.81496 6 8.5C6 13.185 9.81496 17 14.5 17C16.5079 17 18.3819 16.2972 19.8209 15.126C20.2289 14.717 20.2289 14.717 21.0256 13.9213ZM7.67323 8.5C7.67323 4.7185 10.7185 1.67323 14.5 1.67323C18.2815 1.67323 21.3268 4.7185 21.3268 8.5C21.3268 12.2815 18.2815 15.3268 14.5 15.3268C10.7185 15.3268 7.67323 12.248 7.67323 8.5Z"