diff --git a/src/components/Map/MapView.jsx b/src/components/Map/MapView.jsx index 983d6b0..e0bf43c 100644 --- a/src/components/Map/MapView.jsx +++ b/src/components/Map/MapView.jsx @@ -17,11 +17,7 @@ import TimeFilterButtons from "../Filters/TimeFilterButtons"; export default function MapView({ theme = "dark", - - // lift posts to App (so Sociowall is NOT inside the map) onPostsState, - - // selection controlled by App selectedPost, onSelectPost, }) { @@ -79,7 +75,6 @@ export default function MapView({ const bottomCategories = FILTER_CATEGORY_MAP[mainFilter] || ["All"]; - /* SW_SUBCAT_ICONS:BEGIN */ const getSubcatIcon = (main, sub) => { const M = { All: { @@ -125,15 +120,12 @@ export default function MapView({ return (M[main] && M[main][sub]) || ""; }; - /* SW_SUBCAT_ICONS:END */ - // keep subFilter valid useEffect(() => { if (!bottomCategories.length) return; if (!subFilter || !bottomCategories.includes(subFilter)) setSubFilter("All"); }, [mainFilter, bottomCategories, subFilter]); - // push posts state up to App (for Sociowall) useEffect(() => { if (!onPostsState) return; onPostsState({ @@ -144,7 +136,6 @@ export default function MapView({ }); }, [status, visiblePosts, loadingPosts, loadError, onPostsState]); - // if App selects a post (from Sociowall), fly to it on map useEffect(() => { if (!selectedPost) return; const map = mapRef.current; @@ -158,7 +149,6 @@ export default function MapView({ } }, [selectedPost, mapRef]); - // Hide subcats when map isn't visible enough (keeps UI clean) useEffect(() => { const el = stageRef.current; if (!el || typeof IntersectionObserver === "undefined") return; @@ -176,7 +166,6 @@ export default function MapView({ return () => obs.disconnect(); }, []); - // Websocket for new posts useEffect(() => { const proto = window.location.protocol === "https:" ? "wss" : "ws"; const host = @@ -231,7 +220,6 @@ export default function MapView({ setDraftCoords(null); }; - // Keep submit to allow Enter key, but no popup: const handleSearchSubmit = (e) => { e.preventDefault(); }; @@ -271,7 +259,6 @@ export default function MapView({ baseLat = center.lat; } - // keep marker visually above pointer const pixelOffsetY = -20; const screenPoint = map.project([baseLng, baseLat]); const correctedPoint = { x: screenPoint.x, y: screenPoint.y + pixelOffsetY }; @@ -327,7 +314,6 @@ export default function MapView({ setMainFilter(code); }; - // allow selecting from map later (optional hook) const handleSelectPost = (post) => { if (onSelectPost) onSelectPost(post); const map = mapRef.current; @@ -345,10 +331,10 @@ export default function MapView({
{status &&
{status}
} - {/* === TOP OVERLAY: Search + 2 boutons === */} -
+ {/* TOP: Search à gauche, 2 icônes à droite */} +
-
+
@@ -426,8 +418,6 @@ export default function MapView({
- {/* On n'a plus besoin du bouton My spot séparé en bas, il est en haut maintenant */} - {isCreating && (
diff --git a/src/styles/overlays.css b/src/styles/overlays.css index 5c3752d..07e4113 100644 --- a/src/styles/overlays.css +++ b/src/styles/overlays.css @@ -173,3 +173,59 @@ body[data-theme="light"] .sw-search-clear{ align-items:center; justify-content:center; } + +/* ==== TOP ROW: search + 2 icônes actions ===== */ + +.sw-top-row{ + display:flex; + align-items:center; + justify-content:space-between; + gap:0.75rem; +} + +/* la search prend tout l'espace dispo à gauche */ +.sw-top-search{ + flex:1 1 auto; +} + +/* bloc des 2 boutons icônes à droite */ +.map-top-actions{ + display:flex; + flex-direction:row; + align-items:center; + gap:0.5rem; +} + +/* bouton icône: rond + label en dessous */ +.map-action-btn{ + display:flex; + flex-direction:column; + align-items:center; + justify-content:center; + padding:0.25rem 0.45rem; + border-radius:0.9rem; + border:1px solid rgba(255,255,255,0.08); + background:rgba(8,8,16,0.9); + backdrop-filter:blur(14px); + box-shadow:0 8px 22px rgba(0,0,0,0.55); + font-size:0.7rem; + line-height:1.1; + cursor:pointer; + white-space:nowrap; +} + +.map-action-btn:disabled{ + opacity:0.45; + cursor:default; +} + +.map-action-icon{ + font-size:1.05rem; + margin-bottom:0.15rem; +} + +.map-action-label{ + font-size:0.6rem; + text-transform:uppercase; + letter-spacing:0.04em; +}