dandri/meshcore-analyzer
1
0
Fork 0
mirror of https://github.com/Kpa-clawbot/meshcore-analyzer.git synced 2026-03-30 13:35:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Matrix: reworked map visibility + dimmer markers

Browse Source 
- Replaced sepia+hue-rotate chain with grayscale+brightness+contrast
- Green tint via ::before (multiply) + ::after (screen) overlays
- Much brighter base map — roads/coastlines/land clearly visible
- Markers dimmed to #005f15 at 40% opacity
- DivIcon markers at 35% brightness
This commit is contained in:
you
2026-03-22 07:20:06 +00:00
parent 13d781fcd9
commit 6f8cd2eac0
3 changed files with 14 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
public/index.html
View File

@@ -22,7 +22,7 @@
<meta name="twitter:title" content="MeshCore Analyzer">
<meta name="twitter:description" content="Real-time MeshCore LoRa mesh network analyzer — live packet visualization, node tracking, channel decryption, and route analysis.">
<meta name="twitter:image" content="https://raw.githubusercontent.com/Kpa-clawbot/meshcore-analyzer/master/public/og-image.png">
<link rel="stylesheet" href="style.css?v=1774163919">
<link rel="stylesheet" href="style.css?v=1774164006">
<link rel="stylesheet" href="home.css">
<link rel="stylesheet" href="live.css?v=1774058575">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
@@ -90,7 +90,7 @@
<script src="nodes.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
<script src="traces.js?v=1774135052" onerror="console.error('Failed to load:', this.src)"></script>
<script src="analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
<script src="live.js?v=1774163847" onerror="console.error('Failed to load:', this.src)"></script>
<script src="live.js?v=1774164006" onerror="console.error('Failed to load:', this.src)"></script>
<script src="observers.js?v=1774290000" onerror="console.error('Failed to load:', this.src)"></script>
<script src="observer-detail.js?v=1774028201" onerror="console.error('Failed to load:', this.src)"></script>
<script src="node-analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>

6
public/live.js
View File

@@ -1694,9 +1694,9 @@
// Re-tint existing node markers green
for (const [key, marker] of Object.entries(nodeMarkers)) {
marker._matrixPrevColor = marker._baseColor;
marker._baseColor = '#00aa2a';
marker.setStyle({ fillColor: '#00aa2a', color: '#00aa2a' });
if (marker._glowMarker) marker._glowMarker.setStyle({ fillColor: '#00aa2a' });
marker._baseColor = '#005f15';
marker.setStyle({ fillColor: '#005f15', color: '#005f15', fillOpacity: 0.4, opacity: 0.4 });
if (marker._glowMarker) marker._glowMarker.setStyle({ fillColor: '#005f15', fillOpacity: 0.1 });
}
} else {
container.classList.remove('matrix-theme');

14
public/style.css
View File

@@ -1537,11 +1537,15 @@ tr[data-hops]:hover { background: rgba(59,130,246,0.1); }
/* === Matrix Theme === */
.matrix-theme .leaflet-tile-pane {
filter: brightness(0.55) contrast(1.5) sepia(1) hue-rotate(70deg) saturate(2.5);
filter: grayscale(1) brightness(0.7) contrast(1.8);
}
.matrix-theme .leaflet-tile-pane::after {
content: ''; position: absolute; inset: 0; z-index: 1;
background: rgba(0, 255, 65, 0.03); mix-blend-mode: overlay; pointer-events: none;
.matrix-theme .leaflet-container::before {
content: ''; position: absolute; inset: 0; z-index: 401;
background: rgba(0, 60, 10, 0.35); mix-blend-mode: multiply; pointer-events: none;
}
.matrix-theme .leaflet-container::after {
content: ''; position: absolute; inset: 0; z-index: 402;
background: rgba(0, 255, 65, 0.06); mix-blend-mode: screen; pointer-events: none;
}
.matrix-theme { background: #000 !important; }
.matrix-theme .leaflet-control-zoom a { background: #0a0a0a !important; color: #00ff41 !important; border-color: #00ff4130 !important; }
@@ -1592,4 +1596,4 @@ tr[data-hops]:hover { background: rgba(59,130,246,0.1); }
/* Node labels on map */
.matrix-theme .node-label { color: #00ff41 !important; text-shadow: 0 0 4px #00ff41 !important; }
.matrix-theme .leaflet-marker-icon:not(.matrix-char) { filter: hue-rotate(90deg) saturate(2) brightness(0.6); }
.matrix-theme .leaflet-marker-icon:not(.matrix-char) { filter: hue-rotate(90deg) saturate(1) brightness(0.35) opacity(0.5); }