feat: show address, floor, building, room in asset list items

- Add .ai-address and .ai-location CSS classes
- Increase .asset-item padding to 14px, align-items to flex-start
- Reduce .ai-name font to 14px, allow wrapping
- Render address line (📍 icon) when present
- Render floor · building · room location line when any field present
- Keep existing icon and meta line unchanged
This commit is contained in:
2026-05-23 19:46:25 -04:00
parent 13bf61d856
commit a5708623cc
+7 -3
View File
@@ -396,7 +396,7 @@
ASSET LIST ITEMS (shared)
═══════════════════════════════════════════════════════════════════════ */
.asset-item {
display: flex; align-items: center; gap: 12px; padding: 12px;
display: flex; align-items: flex-start; gap: 12px; padding: 14px 12px;
border-bottom: 1px solid rgba(255,255,255,0.04); cursor: pointer;
transition: background 0.15s;
}
@@ -415,8 +415,10 @@
.asset-item .ai-icon.cat-Equipment { background: #2a1a2e; }
.asset-item .ai-icon.cat-Other { background: #1a1b26; }
.asset-item .ai-info { flex: 1; min-width: 0; }
.asset-item .ai-name { font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.asset-item .ai-meta { font-size: 12px; color: var(--text2); margin-top: 2px; }
.asset-item .ai-name { font-weight: 600; font-size: 14px; line-height: 1.3; }
.asset-item .ai-address { font-size: 12px; color: var(--text2); margin-top: 2px; }
.asset-item .ai-location { font-size: 11px; color: var(--text3); margin-top: 1px; }
.asset-item .ai-meta { font-size: 12px; color: var(--text2); margin-top: 3px; }
.asset-item .ai-arrow { color: var(--text2); font-size: 18px; }
/* status tag */
@@ -3701,6 +3703,8 @@
<div class="ai-icon${iconWide}" style="background:${catColor}22;color:${catColor}">${icon}</div>
<div class="ai-info">
<div class="ai-name">${esc(a.name)}</div>
${a.address ? `<div class="ai-address">📍 ${esc(a.address)}</div>` : ''}
${(a.floor || a.building_number || a.building_name || a.room) ? `<div class="ai-location">${[a.floor, a.building_number, a.building_name, a.room].filter(Boolean).join(' · ')}</div>` : ''}
<div class="ai-meta">
${esc(a.machine_id)}${a.serial_number ? ' · S/N: ' + esc(a.serial_number) : ''}
${a.make ? ' · ' + esc(a.make) : ''}