style: use distinct colors for WiFi and Bluetooth devices

WiFi devices now shown in orange (#f59f00), Bluetooth in blue (#4dabf7).
Makes it easier to distinguish device types on map and in device list.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
User
2026-02-01 04:04:39 +01:00
parent 46b7b01e98
commit a1de52fbcd
6 changed files with 12271 additions and 21 deletions

View File

@@ -8,6 +8,8 @@
--color-primary: #00ff88;
--color-secondary: #4dabf7;
--color-wifi: #f59f00;
--color-bluetooth: #4dabf7;
--color-warning: #ffd93d;
--color-danger: #ff6b6b;
--color-text: #eee;
@@ -162,8 +164,8 @@ body {
}
.filter-btn.wifi {
color: var(--color-primary);
border-color: var(--color-primary);
color: var(--color-wifi);
border-color: var(--color-wifi);
}
.filter-btn.wifi.inactive {
@@ -173,8 +175,8 @@ body {
}
.filter-btn.bluetooth {
color: var(--color-secondary);
border-color: var(--color-secondary);
color: var(--color-bluetooth);
border-color: var(--color-bluetooth);
}
.filter-btn.bluetooth.inactive {
@@ -283,11 +285,11 @@ body {
}
.device-card.wifi {
border-left: 3px solid var(--color-primary);
border-left: 3px solid var(--color-wifi);
}
.device-card.bluetooth {
border-left: 3px solid var(--color-secondary);
border-left: 3px solid var(--color-bluetooth);
}
.device-header {
@@ -661,12 +663,12 @@ body {
}
.device-detail-panel.wifi {
border-color: var(--color-primary);
box-shadow: 0 4px 20px rgba(0, 255, 136, 0.2);
border-color: var(--color-wifi);
box-shadow: 0 4px 20px rgba(245, 159, 0, 0.2);
}
.device-detail-panel.bluetooth {
border-color: var(--color-secondary);
border-color: var(--color-bluetooth);
box-shadow: 0 4px 20px rgba(77, 171, 247, 0.2);
}
@@ -929,14 +931,14 @@ body {
}
.marker-3d.wifi .marker-icon {
background: var(--color-primary);
box-shadow: 0 0 15px var(--color-primary), 0 2px 8px rgba(0, 0, 0, 0.5);
background: var(--color-wifi);
box-shadow: 0 0 15px var(--color-wifi), 0 2px 8px rgba(0, 0, 0, 0.5);
border: 2px solid rgba(255, 255, 255, 0.3);
}
.marker-3d.bluetooth .marker-icon {
background: var(--color-secondary);
box-shadow: 0 0 15px var(--color-secondary), 0 2px 8px rgba(0, 0, 0, 0.5);
background: var(--color-bluetooth);
box-shadow: 0 0 15px var(--color-bluetooth), 0 2px 8px rgba(0, 0, 0, 0.5);
border: 2px solid rgba(255, 255, 255, 0.3);
}

View File

@@ -46,8 +46,8 @@
defaultLon: {{ lon | default(4.3517) }},
apiBase: '{{ url_for("index") }}api',
colors: {
wifi: '#00ff88',
bluetooth: '#4dabf7',
wifi: '#f59f00', // Orange for WiFi
bluetooth: '#4dabf7', // Blue for Bluetooth
warning: '#ffd93d',
danger: '#ff6b6b'
},