Use outlined appearance for locked room cards with blue border
This commit is contained in:
@@ -70,7 +70,7 @@
|
||||
#solver { margin-bottom: 0.75rem; }
|
||||
#solver-results { margin-top: 0.5rem; }
|
||||
.room-card { margin-bottom: 0.3rem; }
|
||||
.room-locked { --border-width: 1px; --border-color: var(--wa-color-brand-50); }
|
||||
.room-locked { --wa-color-surface-border: var(--wa-color-brand-50); }
|
||||
.room-label { font-weight: bold; font-size: 0.8rem; margin-bottom: 0.2rem; }
|
||||
.solver-score { font-size: 0.8rem; margin-top: 0.3rem; color: var(--wa-color-neutral-500); }
|
||||
.divider { border: none; border-top: 1px solid #909090; margin: 0.75rem 0; }
|
||||
|
||||
@@ -427,7 +427,9 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
|
||||
for (let i = 0; i < sol.rooms.length; i++) {
|
||||
const key = sol.rooms[i].map(m => m.id).sort((a, b) => a - b).join(',');
|
||||
const card = document.createElement('wa-card');
|
||||
card.className = 'room-card' + (lockedRooms.has(key) ? ' room-locked' : '');
|
||||
const locked = lockedRooms.has(key);
|
||||
card.className = 'room-card' + (locked ? ' room-locked' : '');
|
||||
if (locked) card.setAttribute('appearance', 'outlined');
|
||||
const label = document.createElement('div');
|
||||
label.className = 'room-label';
|
||||
label.textContent = 'Room ' + (i + 1);
|
||||
|
||||
Reference in New Issue
Block a user