diff --git a/static/css/index.css b/static/css/index.css
index 3738a03..6bc9d3c 100644
--- a/static/css/index.css
+++ b/static/css/index.css
@@ -1769,8 +1769,7 @@ header h1 .tagline {
font-family: 'JetBrains Mono', monospace;
font-size: 11px;
background: var(--bg-primary);
- min-height: 400px;
- max-height: 600px;
+ min-height: 0; /* Allow shrinking in flex context */
}
.output-content::-webkit-scrollbar {
@@ -2516,9 +2515,8 @@ header h1 .tagline {
/* Satellite Dashboard Embed */
.satellite-dashboard-embed {
width: 100%;
- height: calc(100vh - 200px);
- min-height: 700px;
- max-height: 900px;
+ flex: 1;
+ min-height: 400px;
background: var(--bg-primary);
border-radius: 8px;
overflow: hidden;
@@ -3322,8 +3320,8 @@ header h1 .tagline {
background: var(--bg-secondary);
margin: 0 15px 10px 15px;
border: 1px solid var(--border-color);
- height: calc(100vh - 200px);
- min-height: 400px;
+ flex: 1;
+ min-height: 0; /* Allow shrinking in flex context */
box-sizing: border-box;
overflow: hidden;
}
@@ -3799,8 +3797,8 @@ header h1 .tagline {
@media (max-width: 1200px) {
.wifi-layout-container {
- height: auto;
- max-height: calc(100vh - 200px);
+ flex: 1;
+ min-height: 0;
}
.wifi-main-content {
@@ -3836,8 +3834,8 @@ header h1 .tagline {
background: var(--bg-secondary);
margin: 0 15px 10px 15px;
border: 1px solid var(--border-color);
- height: calc(100vh - 200px);
- min-height: 400px;
+ flex: 1;
+ min-height: 0; /* Allow shrinking in flex context */
}
.bt-visuals-column {
@@ -4518,8 +4516,8 @@ header h1 .tagline {
@media (max-width: 1200px) {
.bt-layout-container {
flex-direction: column;
- height: auto;
- max-height: calc(100vh - 200px);
+ flex: 1;
+ min-height: 0;
}
.bt-layout-container .wifi-visuals {
diff --git a/static/css/modes/meshtastic.css b/static/css/modes/meshtastic.css
index 3a3c722..d39d459 100644
--- a/static/css/modes/meshtastic.css
+++ b/static/css/modes/meshtastic.css
@@ -420,6 +420,12 @@
background: var(--bg-primary);
}
+/* Override Leaflet's default div-icon styling for mesh markers */
+.mesh-marker-wrapper.leaflet-div-icon {
+ background: transparent;
+ border: none;
+}
+
.mesh-map .leaflet-popup-content-wrapper {
background: var(--bg-card);
color: var(--text-primary);
@@ -437,37 +443,42 @@
margin: 10px 12px;
}
-/* Custom node marker */
+/* Custom node marker - high visibility on dark maps */
.mesh-node-marker {
display: flex;
align-items: center;
justify-content: center;
- width: 28px;
- height: 28px;
- background: var(--accent-cyan);
- border: 2px solid #fff;
+ width: 32px;
+ height: 32px;
+ background: #00ffff; /* Bright cyan for maximum visibility */
+ border: 3px solid #ffffff;
border-radius: 50%;
box-shadow:
- 0 2px 6px rgba(0, 0, 0, 0.4),
- 0 0 12px 4px rgba(0, 212, 255, 0.5); /* Cyan glow */
+ 0 2px 8px rgba(0, 0, 0, 0.6),
+ 0 0 20px 8px rgba(0, 255, 255, 0.7), /* Strong outer glow */
+ inset 0 0 8px rgba(255, 255, 255, 0.3); /* Inner highlight */
color: #000;
font-family: 'JetBrains Mono', monospace;
- font-size: 10px;
+ font-size: 11px;
font-weight: bold;
text-shadow: 0 0 2px rgba(255, 255, 255, 0.8);
}
.mesh-node-marker.local {
- background: var(--accent-green);
+ background: #00ff88; /* Bright green for local node */
box-shadow:
- 0 2px 6px rgba(0, 0, 0, 0.4),
- 0 0 12px 4px rgba(34, 197, 94, 0.5); /* Green glow */
+ 0 2px 8px rgba(0, 0, 0, 0.6),
+ 0 0 20px 8px rgba(0, 255, 136, 0.7), /* Strong green glow */
+ inset 0 0 8px rgba(255, 255, 255, 0.3);
}
.mesh-node-marker.stale {
- background: var(--text-dim);
- opacity: 0.7;
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); /* No glow for stale */
+ background: #888888;
+ border-color: #aaaaaa;
+ opacity: 0.8;
+ box-shadow:
+ 0 2px 6px rgba(0, 0, 0, 0.4),
+ 0 0 8px 2px rgba(136, 136, 136, 0.3); /* Subtle glow for stale */
}
/* ============================================
diff --git a/static/js/modes/meshtastic.js b/static/js/modes/meshtastic.js
index 81766bf..b271dfd 100644
--- a/static/js/modes/meshtastic.js
+++ b/static/js/modes/meshtastic.js
@@ -625,9 +625,9 @@ const Meshtastic = (function() {
const icon = L.divIcon({
className: 'mesh-marker-wrapper',
html: `${shortName.slice(0, 2).toUpperCase()}
`,
- iconSize: [28, 28],
- iconAnchor: [14, 14],
- popupAnchor: [0, -14]
+ iconSize: [32, 32],
+ iconAnchor: [16, 16],
+ popupAnchor: [0, -16]
});
// Build telemetry section
diff --git a/static/js/modes/sstv.js b/static/js/modes/sstv.js
index 5d83c7e..9515ef1 100644
--- a/static/js/modes/sstv.js
+++ b/static/js/modes/sstv.js
@@ -350,7 +350,8 @@ const SSTV = (function() {
*/
async function start() {
const freqInput = document.getElementById('sstvFrequency');
- const deviceSelect = document.getElementById('sstvDevice');
+ // Use the global SDR device selector
+ const deviceSelect = document.getElementById('deviceSelect');
const frequency = parseFloat(freqInput?.value || ISS_FREQ);
const device = parseInt(deviceSelect?.value || '0', 10);
diff --git a/templates/index.html b/templates/index.html
index 5e81dd4..50a6354 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -135,7 +135,7 @@
+
+
+
+
Space
+
+
+
+
+
-
-
-