canastack-admin
/
sw-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Auto deploy: 2025-12-09 06:15:34

This commit is contained in:
Your Name 2025-12-09 06:15:38 +00:00
parent e0df3ac6d8
commit 5325e81b65
1 changed files with 23 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/styles/mapMarkers.css
View File

@ -1,9 +1,13 @@
/* Ne PAS toucher au transform du marker : MapLibre gère la position. */ /* Le conteneur du pin : MapLibre gère la position/transform */
.post-pin { .post-pin {
display: flex;
flex-direction: column;
align-items: center;
pointer-events: auto; pointer-events: auto;
} }
/* Bulle principale (état compact) */ /* ===== PETIT POST (compact) ===== */
.post-pin-bubble { .post-pin-bubble {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@ -14,7 +18,6 @@
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
} }
/* Petit rond à gauche */
.post-pin-dot { .post-pin-dot {
width: 10px; width: 10px;
height: 10px; height: 10px;
@ -23,7 +26,6 @@
margin-right: 6px; margin-right: 6px;
} }
/* Texte compact */
.post-pin-text { .post-pin-text {
color: #e8f5ff; color: #e8f5ff;
font-size: 11px; font-size: 11px;
@ -34,23 +36,31 @@
text-overflow: ellipsis; text-overflow: ellipsis;
} }
/* Petite pointe qui touche la coordonnée */ /* PETITE POINTE sous la bulle – pointe exactement sur la coordonnée */
.post-pin-pointer { .post-pin-pointer {
width: 0; width: 0;
height: 0; height: 0;
margin: 0 auto; margin-top: 2px;
border-left: 6px solid transparent; border-left: 7px solid transparent;
border-right: 6px solid transparent; border-right: 7px solid transparent;
border-top: 7px solid rgba(6, 40, 80, 0.95); border-top: 9px solid rgba(6, 40, 80, 0.95); /* couleur de la bulle */
filter: drop-shadow(0 1px 3px rgba(0,0,0,0.6));
} }
/* ÉTAT AGRANDI */ /* ===== GROS POST (quand on clique) ===== */
.post-pin.post-pin-expanded .post-pin-bubble { .post-pin.post-pin-expanded .post-pin-bubble {
border-radius: 10px; padding: 8px 10px;
max-width: 220px; border-radius: 12px;
max-width: 260px;
background: rgba(8, 20, 40, 0.98);
} }
/* Titre + texte multi-ligne comme ta maquette */
.post-pin.post-pin-expanded .post-pin-text { .post-pin.post-pin-expanded .post-pin-text {
white-space: normal; white-space: normal;
max-width: 220px; max-width: 260px;
line-height: 1.35;
} }
/* On garde la même pointe, donc le gros post pointe toujours sur la position */