From 2a53008e04accca587e72359e6009bce6d038b55 Mon Sep 17 00:00:00 2001 From: admin Date: Sun, 3 Aug 2025 14:31:51 -0600 Subject: [PATCH] Standardized the z-indexs and did some pop up updates --- map/app/public/css/admin.css | 6 +++--- map/app/public/css/modules/base.css | 16 ++++++++++++++++ map/app/public/css/modules/cache-busting.css | 2 +- map/app/public/css/modules/doc-search.css | 2 +- map/app/public/css/modules/forms.css | 2 +- map/app/public/css/modules/map-controls.css | 2 +- map/app/public/css/modules/mobile-ui.css | 2 +- map/app/public/css/modules/modal.css | 2 +- map/app/public/css/modules/nocodb-dropdown.css | 2 +- map/app/public/css/modules/notifications.css | 4 ++-- map/app/public/css/modules/qr-code.css | 4 ++-- map/app/public/css/modules/responsive.css | 14 +++++++------- map/app/public/css/modules/unified-search.css | 2 +- map/app/public/css/shifts.css | 4 ++-- map/app/public/js/admin.js | 2 ++ map/app/public/login.html | 2 +- map/app/server.js | 4 ++++ map/app/utils/logger.js | 16 +++++++++++++++- 18 files changed, 62 insertions(+), 26 deletions(-) diff --git a/map/app/public/css/admin.css b/map/app/public/css/admin.css index 1ca9fd9..7aff681 100644 --- a/map/app/public/css/admin.css +++ b/map/app/public/css/admin.css @@ -206,7 +206,7 @@ position: fixed; top: 20px; right: 20px; - z-index: 10000; + z-index: 12300; max-width: 400px; pointer-events: none; /* Allow clicks to pass through container */ } @@ -1724,7 +1724,7 @@ height: 100vh; /* Fallback for older browsers */ height: var(--app-height); background: white; - z-index: 9999; /* Increased from 1000 */ + z-index: 12400; transition: left 0.3s ease; box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1); display: flex; @@ -1838,7 +1838,7 @@ width: 280px; height: 100vh; background: white; - z-index: 9999; /* Increased from 1000 */ + z-index: 12400; transition: left 0.3s ease; box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1); display: flex; diff --git a/map/app/public/css/modules/base.css b/map/app/public/css/modules/base.css index 247ea0c..5fbe02f 100644 --- a/map/app/public/css/modules/base.css +++ b/map/app/public/css/modules/base.css @@ -20,6 +20,22 @@ --mobile-breakpoint: 768px; --tablet-breakpoint: 1024px; --desktop-breakpoint: 1200px; + + /* Z-Index Scale - DO NOT MODIFY WITHOUT UPDATING ALL REFERENCES + * Base Layer: 1-999 (Map controls, markers, standard UI) + * Header Layer: 10001 (Main navigation header) + * Dropdown Layer: 12100-12199 (Search results, unified search, doc search) + * Modal Layer: 12000-12099 (Standard modals) + * Mobile UI Layer: 12150-12199 (Mobile dropdowns, nocodb dropdowns) + * Form Layer: 12200-12249 (Edit footer, move controls) + * Popup Layer: 12250-12299 (Shift popups, tooltips) + * Notification Layer: 12300-12399 (Status messages, alerts) + * Admin Layer: 12400-12499 (Admin sidebars) + * Loading Layer: 12500-12599 (Loading overlays) + * Confirmation Layer: 12600-12699 (Confirmation modals) + * QR Layer: 13000-13099 (QR code modals) + * Update Layer: 15000+ (Cache-busting notifications - highest priority) + */ } /* Reset and base styles */ diff --git a/map/app/public/css/modules/cache-busting.css b/map/app/public/css/modules/cache-busting.css index 77ea20a..efb6b0b 100644 --- a/map/app/public/css/modules/cache-busting.css +++ b/map/app/public/css/modules/cache-busting.css @@ -8,7 +8,7 @@ padding: 15px !important; border-radius: 8px !important; box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important; - z-index: 10000 !important; + z-index: 15000 !important; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; animation: slideInFromRight 0.3s ease-out !important; max-width: 350px !important; diff --git a/map/app/public/css/modules/doc-search.css b/map/app/public/css/modules/doc-search.css index db5d5ce..696d062 100644 --- a/map/app/public/css/modules/doc-search.css +++ b/map/app/public/css/modules/doc-search.css @@ -45,7 +45,7 @@ border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25); - z-index: 10002; /* Just slightly higher than header */ + z-index: 12100; overflow: hidden; display: flex; flex-direction: column; diff --git a/map/app/public/css/modules/forms.css b/map/app/public/css/modules/forms.css index 9bd4f1e..14db801 100644 --- a/map/app/public/css/modules/forms.css +++ b/map/app/public/css/modules/forms.css @@ -92,7 +92,7 @@ background-color: white; border-top: 2px solid var(--primary-color); box-shadow: 0 -2px 10px rgba(0,0,0,0.1); - z-index: 1500; + z-index: 12200; transition: transform 0.3s ease; max-height: 60vh; overflow-y: auto; diff --git a/map/app/public/css/modules/map-controls.css b/map/app/public/css/modules/map-controls.css index ebc53a6..60a06fb 100644 --- a/map/app/public/css/modules/map-controls.css +++ b/map/app/public/css/modules/map-controls.css @@ -19,7 +19,7 @@ padding: 20px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); - z-index: 10000; + z-index: 12200; min-width: 300px; text-align: center; } diff --git a/map/app/public/css/modules/mobile-ui.css b/map/app/public/css/modules/mobile-ui.css index 5e4d5e7..a6f4424 100644 --- a/map/app/public/css/modules/mobile-ui.css +++ b/map/app/public/css/modules/mobile-ui.css @@ -36,7 +36,7 @@ opacity: 0; visibility: hidden; transition: var(--transition); - z-index: 1001; + z-index: 12150; } .mobile-dropdown.active .mobile-dropdown-content { diff --git a/map/app/public/css/modules/modal.css b/map/app/public/css/modules/modal.css index 6e2ce60..ed09129 100644 --- a/map/app/public/css/modules/modal.css +++ b/map/app/public/css/modules/modal.css @@ -9,7 +9,7 @@ display: flex; align-items: center; justify-content: center; - z-index: 10010; + z-index: 12000; animation: fadeIn 0.3s ease; } diff --git a/map/app/public/css/modules/nocodb-dropdown.css b/map/app/public/css/modules/nocodb-dropdown.css index e8234d2..b91c947 100644 --- a/map/app/public/css/modules/nocodb-dropdown.css +++ b/map/app/public/css/modules/nocodb-dropdown.css @@ -31,7 +31,7 @@ border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); min-width: 200px; - z-index: 9999; + z-index: 12150; opacity: 0; visibility: hidden; transform: translateY(-10px); diff --git a/map/app/public/css/modules/notifications.css b/map/app/public/css/modules/notifications.css index 409a46f..8b27bbc 100644 --- a/map/app/public/css/modules/notifications.css +++ b/map/app/public/css/modules/notifications.css @@ -4,7 +4,7 @@ top: calc(var(--header-height) + 20px); left: 50%; transform: translateX(-50%); - z-index: 2000; + z-index: 12300; max-width: 400px; width: 90%; } @@ -63,7 +63,7 @@ flex-direction: column; align-items: center; justify-content: center; - z-index: 4000; + z-index: 12500; } .loading-overlay.hidden { diff --git a/map/app/public/css/modules/qr-code.css b/map/app/public/css/modules/qr-code.css index 9a9f6be..736fc5c 100644 --- a/map/app/public/css/modules/qr-code.css +++ b/map/app/public/css/modules/qr-code.css @@ -19,13 +19,13 @@ /* QR Code Modal Styles */ .qr-modal { - z-index: 11000; /* Ensure QR modal is above everything else */ + z-index: 13000; /* Ensure QR modal is above everything else */ } .qr-modal-content { max-width: 400px; text-align: center; - z-index: 11001; /* Even higher for the content */ + z-index: 13001; /* Even higher for the content */ position: relative; } diff --git a/map/app/public/css/modules/responsive.css b/map/app/public/css/modules/responsive.css index ce09a31..8398274 100644 --- a/map/app/public/css/modules/responsive.css +++ b/map/app/public/css/modules/responsive.css @@ -5,7 +5,7 @@ width: 100%; margin: 10px 0; padding: 0 0px; - z-index:10002/* Remove z-index */ + /* Remove z-index - let it inherit from header */ } .docs-search-wrapper { @@ -25,7 +25,7 @@ max-width: 100vw !important; min-width: 0 !important; border-radius: 0 0 12px 12px; - z-index: 10002; /* Same as desktop */ + z-index: 12100; margin: 0; box-shadow: 0 8px 24px rgba(0,0,0,0.25); } @@ -164,14 +164,14 @@ padding-right: 12px; } - .qr-modal-content { - width: 95%; - max-width: 350px; - z-index: 11001; /* Maintain high z-index on mobile */ + .qr-modal-content { + max-width: 340px; + margin: 10px; + z-index: 13001; /* Maintain high z-index on mobile */ } .qr-modal { - z-index: 11000; /* Maintain high z-index on mobile */ + z-index: 13000; /* Maintain high z-index on mobile */ } } diff --git a/map/app/public/css/modules/unified-search.css b/map/app/public/css/modules/unified-search.css index e2c0bac..f9d318b 100644 --- a/map/app/public/css/modules/unified-search.css +++ b/map/app/public/css/modules/unified-search.css @@ -110,7 +110,7 @@ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); max-height: 400px; overflow-y: auto; - z-index: 1000; + z-index: 12100; /* Ensure results appear above other content */ transform: translateZ(0); -webkit-transform: translateZ(0); diff --git a/map/app/public/css/shifts.css b/map/app/public/css/shifts.css index 498a362..daf9426 100644 --- a/map/app/public/css/shifts.css +++ b/map/app/public/css/shifts.css @@ -436,7 +436,7 @@ border-radius: var(--border-radius); padding: 15px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); - z-index: 10000; /* High z-index to appear above header */ + z-index: 12250; min-width: 250px; max-width: 300px; } @@ -464,7 +464,7 @@ left: 0; right: 0; bottom: 0; - z-index: 20000; /* Even higher than shift popup */ + z-index: 12600; display: flex; align-items: center; justify-content: center; diff --git a/map/app/public/js/admin.js b/map/app/public/js/admin.js index d32a559..b059351 100644 --- a/map/app/public/js/admin.js +++ b/map/app/public/js/admin.js @@ -1009,6 +1009,8 @@ function showStatus(message, type = 'info') { container = document.createElement('div'); container.id = 'status-container'; container.className = 'status-container'; + // Ensure proper z-index even if CSS hasn't loaded + container.style.zIndex = '12300'; document.body.appendChild(container); } diff --git a/map/app/public/login.html b/map/app/public/login.html index 216cbbb..09caadc 100644 --- a/map/app/public/login.html +++ b/map/app/public/login.html @@ -163,7 +163,7 @@ display: none; align-items: center; justify-content: center; - z-index: 1000; + z-index: 12000; backdrop-filter: blur(2px); } diff --git a/map/app/server.js b/map/app/server.js index 4dbb72b..a745d6d 100644 --- a/map/app/server.js +++ b/map/app/server.js @@ -6,6 +6,10 @@ const cookieParser = require('cookie-parser'); const crypto = require('crypto'); const fetch = require('node-fetch'); +// Debug: Check if server.js is being loaded multiple times +const serverInstanceId = Math.random().toString(36).substr(2, 9); +console.log(`[DEBUG] Server.js instance ${serverInstanceId} loading at ${new Date().toISOString()}`); + // Import configuration and utilities const config = require('./config'); const logger = require('./utils/logger'); diff --git a/map/app/utils/logger.js b/map/app/utils/logger.js index 3072ffa..100313e 100644 --- a/map/app/utils/logger.js +++ b/map/app/utils/logger.js @@ -1,9 +1,20 @@ const winston = require('winston'); const config = require('../config'); +// Debug: Check if logger is being created multiple times +const instanceId = Math.random().toString(36).substr(2, 9); +console.log(`[DEBUG] Creating logger instance ${instanceId} at ${new Date().toISOString()}`); + +// Ensure we only create one logger instance +if (global.appLogger) { + console.log(`[DEBUG] Reusing existing logger instance`); + module.exports = global.appLogger; + return; +} + const logger = winston.createLogger({ level: config.isProduction ? 'info' : 'debug', - defaultMeta: { service: 'bnkops-map' }, + defaultMeta: { service: 'bnkops-map', instanceId }, transports: [ new winston.transports.Console({ format: winston.format.combine( @@ -39,4 +50,7 @@ if (config.isProduction) { })); } +// Store logger globally to prevent multiple instances +global.appLogger = logger; + module.exports = logger; \ No newline at end of file