Fix device card rendering - disable legacy code and fix CSS

- Disable legacy addBtDeviceCard when BluetoothMode is active
- Clear device container when starting scan to remove legacy cards
- Fix grid CSS with explicit auto height and align-items: start
- Add visibility rules for all card body elements
- Reset devices map when clearing container

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-21 17:47:09 +00:00
parent bb660d02f5
commit bac7f8d55c
3 changed files with 39 additions and 12 deletions
+31 -7
View File
@@ -560,28 +560,52 @@
#btDeviceListContent { #btDeviceListContent {
display: grid !important; display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
grid-auto-rows: auto !important;
gap: 12px !important; gap: 12px !important;
padding: 12px !important; padding: 12px !important;
align-items: start !important;
} }
#btDeviceListContent .device-card { #btDeviceListContent > * {
min-height: auto !important;
height: auto !important;
}
#btDeviceListContent .device-card,
#btDeviceListContent .signal-card {
margin: 0; margin: 0;
height: fit-content; height: auto !important;
min-height: auto !important;
} }
/* Ensure card body is visible */ /* Ensure card body is visible */
.device-card .signal-card-body { .device-card .signal-card-body,
.signal-card .signal-card-body {
display: flex !important; display: flex !important;
flex-direction: column; flex-direction: column !important;
gap: 8px; gap: 8px !important;
visibility: visible !important;
opacity: 1 !important;
height: auto !important;
overflow: visible !important;
} }
.device-card .device-identity { .device-card .device-identity,
.signal-card .device-identity {
display: block !important; display: block !important;
visibility: visible !important;
} }
.device-card .device-signal-row { .device-card .device-signal-row,
.signal-card .device-signal-row {
display: flex !important; display: flex !important;
visibility: visible !important;
}
.device-card .device-meta-row,
.signal-card .device-meta-row {
display: flex !important;
visibility: visible !important;
} }
/* ============================================ /* ============================================
+3 -5
View File
@@ -213,12 +213,10 @@ const BluetoothMode = (function() {
if (startBtn) startBtn.style.display = scanning ? 'none' : 'block'; if (startBtn) startBtn.style.display = scanning ? 'none' : 'block';
if (stopBtn) stopBtn.style.display = scanning ? 'block' : 'none'; if (stopBtn) stopBtn.style.display = scanning ? 'block' : 'none';
// Clear placeholder when starting scan // Clear container when starting scan (removes legacy cards and placeholder)
if (scanning && deviceContainer) { if (scanning && deviceContainer) {
const placeholder = deviceContainer.querySelector('div[style*="text-align: center"]'); deviceContainer.innerHTML = '';
if (placeholder && placeholder.textContent.includes('Start scanning')) { devices.clear(); // Also clear our device map
deviceContainer.innerHTML = '';
}
} }
// Update global status if available // Update global status if available
+5
View File
@@ -6315,6 +6315,11 @@
// Add Bluetooth device card to device list panel // Add Bluetooth device card to device list panel
function addBtDeviceCard(device, isNew) { function addBtDeviceCard(device, isNew) {
// Skip if new BluetoothMode is handling rendering
if (typeof BluetoothMode !== 'undefined' && BluetoothMode.isScanning()) {
return;
}
// Add to new device list panel // Add to new device list panel
const deviceList = document.getElementById('btDeviceListContent'); const deviceList = document.getElementById('btDeviceListContent');
if (deviceList) { if (deviceList) {