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

update frontend

This commit is contained in:
Your Name 2025-12-09 19:20:30 -05:00
parent 8d4f406ab5
commit 253346cedc
1 changed files with 8 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/styles/mapLayout.css
View File

@ -1,93 +1,19 @@
/* Le conteneur global */ /* ========== MAP LAYOUT MINIMAL ========== */
/* Ce fichier gère seulement la taille de la map.
Les overlays + boutons sont stylés dans overlays.css */
.map-view { .map-view {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100vh; height: 100%; /* avant: 100vh → provoquait un double scroll */
background: #020814; background: #020814;
} }
/* La map DOIT couvrir tout l'écran, sauf un petit espace pour la top bar */ /* La carte MapLibre remplit tout l'espace de la vue */
.map-container { .map-container {
position: absolute; position: absolute;
top: 70px; /* ← espace pour les boutons */ inset: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 12px; border-radius: 12px;
overflow: hidden; overflow: hidden;
background: black; background: #000;
}
/* Overlays flottants */
.map-overlay {
position: absolute;
z-index: 20;
pointer-events: none;
}
.map-overlay * {
pointer-events: auto;
}
/* TOP BAR FIXE */
.map-overlay-top {
top: 10px;
left: 10px;
right: 10px;
display: flex;
align-items: center;
justify-content: space-between;
}
/* Boutons */
.chip-pill, .chip-round, .chip-egg, .chip-hex {
background: rgba(8,32,72,0.9);
border-radius: 999px;
color: #e8f3ff;
padding: 6px 12px;
font-size: 12px;
border: none;
cursor: pointer;
}
/* LEFT = time filters */
.map-overlay-left {
top: 100px;
left: 16px;
display: flex;
flex-direction: column;
gap: 10px;
}
/* RIGHT = category filters */
.map-overlay-right {
top: 100px;
right: 16px;
display: flex;
flex-direction: column;
gap: 10px;
}
/* Bottom subcategories */
.map-overlay-bottom {
bottom: 20px;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 10px;
}
/* Crosshair */
.map-crosshair {
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
}
.crosshair-aim {
width: 20px;
height: 20px;
border-radius: 999px;
border: 2px solid #1c9dff;
} }