From 85ebb500bc29755e3b7f44755c86f5e757f7c3fa Mon Sep 17 00:00:00 2001 From: Sociowire Dev Date: Mon, 12 Jan 2026 03:25:41 +0000 Subject: [PATCH] Fix weather widget position and z-index hierarchy - Position weather widget fixed at left:24px, top:240px - Set weather widget z-index to 300 (below FAB at 398-400) - Fix FAB z-index to be below search dropdown - Fix various z-index issues for modals and overlays Co-Authored-By: Claude Opus 4.5 --- src/App.jsx | 11 +++++++++++ src/components/Live/LiveKitBroadcast.jsx | 2 +- src/components/Live/LiveKitViewerModal.jsx | 4 ++-- src/components/Live/useLiveKit.js | 4 ++-- src/components/Map/MapView.jsx | 6 ++++-- src/components/Map/RadialMenu.css | 6 +++--- src/styles/auth-modal.css | 2 +- src/styles/filters.css | 12 ------------ src/styles/map.css | 4 ++-- src/styles/mapMarkers.css | 2 +- src/styles/profile.css | 2 +- src/styles/smartSearchBar.css | 2 +- src/styles/topbar.css | 6 +++--- 13 files changed, 32 insertions(+), 31 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 4b8cfce..cc1db8e 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -17,6 +17,17 @@ export default function App() { const { t } = useTranslation(); const [theme, setTheme] = useState("blue"); + // Clean up Facebook OAuth hash fragment (#_=_) + useEffect(() => { + if (window.location.hash === "#_=_") { + if (window.history.replaceState) { + window.history.replaceState(null, "", window.location.pathname + window.location.search); + } else { + window.location.hash = ""; + } + } + }, []); + // Wall state (lifted from MapView) const [wallPosts, setWallPosts] = useState([]); const [wallLoading, setWallLoading] = useState(false); diff --git a/src/components/Live/LiveKitBroadcast.jsx b/src/components/Live/LiveKitBroadcast.jsx index 5df05e4..5ba561b 100644 --- a/src/components/Live/LiveKitBroadcast.jsx +++ b/src/components/Live/LiveKitBroadcast.jsx @@ -7,7 +7,7 @@ import { CREATE_CATEGORY_MAP, FILTER_MAIN_CATEGORIES } from "../Map/mapConfig"; import "./Live.css"; const API_BASE = (import.meta?.env?.VITE_API_BASE_URL || "").replace(/\/+$/, ""); -const LIVEKIT_API = "https://live.us1.sociowire.com"; +const LIVEKIT_API = "https://stream.us4.sociowire.com"; /** * LiveKit-based broadcast component diff --git a/src/components/Live/LiveKitViewerModal.jsx b/src/components/Live/LiveKitViewerModal.jsx index 246057f..b93802b 100644 --- a/src/components/Live/LiveKitViewerModal.jsx +++ b/src/components/Live/LiveKitViewerModal.jsx @@ -3,8 +3,8 @@ import { Room, RoomEvent } from "livekit-client"; import { useAuth } from "../../auth/AuthContext"; import "./Live.css"; -const LIVEKIT_URL = "wss://live.us1.sociowire.com"; -const LIVEKIT_API = "https://live.us1.sociowire.com"; +const LIVEKIT_URL = "wss://live.us4.sociowire.com"; +const LIVEKIT_API = "https://stream.us4.sociowire.com"; function roomNameFromPost(post) { const raw = (post?.embed_url || post?.video_url || "").toString().trim(); diff --git a/src/components/Live/useLiveKit.js b/src/components/Live/useLiveKit.js index 1feda13..407a926 100644 --- a/src/components/Live/useLiveKit.js +++ b/src/components/Live/useLiveKit.js @@ -7,8 +7,8 @@ import { createLocalAudioTrack, } from "livekit-client"; -const LIVEKIT_URL = "wss://live.us1.sociowire.com"; -const LIVEKIT_API = "https://live.us1.sociowire.com"; +const LIVEKIT_URL = "wss://live.us4.sociowire.com"; +const LIVEKIT_API = "https://stream.us4.sociowire.com"; /** * Hook for LiveKit-based live streaming diff --git a/src/components/Map/MapView.jsx b/src/components/Map/MapView.jsx index 88004a3..27b480d 100644 --- a/src/components/Map/MapView.jsx +++ b/src/components/Map/MapView.jsx @@ -1974,11 +1974,12 @@ export default function MapView({
setActiveWeatherPost(w)} style={{ + position: 'fixed', + left: '24px', + top: '240px', display: 'inline-flex', alignItems: 'center', gap: '5px', - marginTop: '8px', - marginLeft: '70px', // Offset from left FAB padding: '5px 12px', borderRadius: '16px', background: bg, @@ -1989,6 +1990,7 @@ export default function MapView({ cursor: 'pointer', backdropFilter: 'blur(8px)', boxShadow: '0 2px 8px rgba(0,0,0,0.2)', + zIndex: 300, }} > {w.icon} diff --git a/src/components/Map/RadialMenu.css b/src/components/Map/RadialMenu.css index 9dc5406..d97a80d 100644 --- a/src/components/Map/RadialMenu.css +++ b/src/components/Map/RadialMenu.css @@ -7,7 +7,7 @@ background: rgba(0, 0, 0, 0.15); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); - z-index: 998; + z-index: 398; /* Below search dropdown (500) */ animation: fab-fade-in 0.2s ease; } @@ -21,7 +21,7 @@ .fab-right { position: fixed; top: 180px; - z-index: 999; + z-index: 399; /* Below search dropdown (500) */ } .fab-left { @@ -49,7 +49,7 @@ transition: transform 0.2s ease, box-shadow 0.2s ease; -webkit-tap-highlight-color: transparent; position: relative; - z-index: 1001; + z-index: 400; /* Below search dropdown (500) */ } .fab-btn-right { diff --git a/src/styles/auth-modal.css b/src/styles/auth-modal.css index 9e11599..d9a598e 100644 --- a/src/styles/auth-modal.css +++ b/src/styles/auth-modal.css @@ -1,7 +1,7 @@ .auth-modal-backdrop { position: fixed; inset: 0; - z-index: 10000020; + z-index: 10000; /* Auth modal - highest priority */ display: flex; align-items: center; justify-content: center; diff --git a/src/styles/filters.css b/src/styles/filters.css index 2553ae6..54f8142 100644 --- a/src/styles/filters.css +++ b/src/styles/filters.css @@ -240,18 +240,6 @@ body[data-theme="light"] .sw-icon-active .sw-icon-label{ /* SW_FILTER_ICON_VISIBILITY:END */ -/* VERSION INDICATOR */ -body::after { - content: "© Sociowire v0.0011"; - position: fixed; - bottom: 4px; - right: 4px; - font-size: 10px; - color: rgba(255,255,255,0.5); - z-index: 99999; - pointer-events: none; -} - /* ===== THEME PILLS D / B / L : blanc sur fond noir comme les catégories ===== */ .sw-theme-toggle{ display:flex; diff --git a/src/styles/map.css b/src/styles/map.css index 026db1d..1347deb 100644 --- a/src/styles/map.css +++ b/src/styles/map.css @@ -177,7 +177,7 @@ transform:translateX(-50%); max-width: min(980px, calc(100vw - 24px)); width:100%; - z-index: 10001; /* Au-dessus des filtres (z-index: 300) et du dropdown (9999) */ + z-index: 800; /* Above filters (300) but below modals (9999) */ } @@ -1365,7 +1365,7 @@ body[data-theme="light"] .map-action-btn * { bottom:50%; left:50%; transform:translate(-50%, 50%); - z-index:9000; + z-index:900; /* Below modals (9999) but above filters/content */ display:flex; flex-direction:column; gap:6px; diff --git a/src/styles/mapMarkers.css b/src/styles/mapMarkers.css index aebaa9a..2696ba2 100644 --- a/src/styles/mapMarkers.css +++ b/src/styles/mapMarkers.css @@ -1116,7 +1116,7 @@ body[data-theme="light"] .sw-modal-hero-fallback{ .sw-centered-backdrop{ position: fixed; inset: 0; - z-index: 9999999; + z-index: 9999; /* Centered modal - above most content but below auth */ background: rgba(0,0,0,0.08); backdrop-filter: blur(1px); display: flex; diff --git a/src/styles/profile.css b/src/styles/profile.css index f97814e..51f1071 100644 --- a/src/styles/profile.css +++ b/src/styles/profile.css @@ -3,7 +3,7 @@ .user-profile-modal { position: fixed; inset: 0; - z-index: 9998; /* Just below island viewer */ + z-index: 9999; background: rgba(0, 0, 0, 0.8); display: flex; align-items: center; diff --git a/src/styles/smartSearchBar.css b/src/styles/smartSearchBar.css index 598e911..dc0b110 100644 --- a/src/styles/smartSearchBar.css +++ b/src/styles/smartSearchBar.css @@ -167,7 +167,7 @@ body[data-theme="light"] { .sw-search__dropdown { position: absolute; - z-index: 9999; + z-index: 500; left: 0; right: 0; margin-top: 8px; diff --git a/src/styles/topbar.css b/src/styles/topbar.css index cd70425..285a775 100644 --- a/src/styles/topbar.css +++ b/src/styles/topbar.css @@ -767,7 +767,7 @@ body[data-theme="light"] .sw-avatar{ position: fixed; top: 70px; right: 16px; - z-index: 10000005; + z-index: 1000; animation: friendsSlideIn 0.2s ease-out; } @@ -829,7 +829,7 @@ body[data-theme="light"] .sw-avatar{ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255,255,255,0.05); backdrop-filter: blur(16px); overflow: hidden; - z-index: 10000010; + z-index: 1001; animation: langDropIn 0.18s ease-out; } @@ -908,7 +908,7 @@ body[data-theme="light"] .lang-option.is-active{ .theme-dropdown{ position: fixed; - z-index: 10000010; + z-index: 1001; background: rgba(15, 23, 42, 0.98); border: 1px solid rgba(139, 92, 246, 0.5); border-radius: 8px;