CCCHH/hmdooris
2
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Color state icon
All checks were successful
docker-image / docker (push) Successful in 1m23s
Details

Browse source
This commit is contained in:
Stefan Bethke 2025-07-15 22:05:05 +02:00
commit 81baba1411
2 changed files with 6 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

6
hmdooris/static/main.css
View file

@ -61,15 +61,15 @@ body {
color: black; color: black;
} }
.lock__line button.lock__button__lock { .lock__line button.lock__button__lock, .lock__state-icon--locked {
background-color: #f88; background-color: #f88;
} }
.lock__line button.lock__button__unlock { .lock__line button.lock__button__unlock, .lock__state-icon--unlocked {
background-color: #8f8; background-color: #8f8;
} }
.lock__line button.lock__button__lock:disabled, .lock__line button.lock__button__unlock:disabled { .lock__line button.lock__button__lock:disabled, .lock__line button.lock__button__unlock:disabled, .lock__state-icon--unknown {
background-color: #ccc; background-color: #ccc;
color: #444; color: #444;
} }

3
hmdooris/static/main.js
View file

@ -6,16 +6,19 @@
let button_lock = document.querySelector(`#lock__line__${lock.id} .lock__button__lock`); let button_lock = document.querySelector(`#lock__line__${lock.id} .lock__button__lock`);
let button_unlock = document.querySelector(`#lock__line__${lock.id} .lock__button__unlock`); let button_unlock = document.querySelector(`#lock__line__${lock.id} .lock__button__unlock`);
if (lock.status === "LOCKED") { if (lock.status === "LOCKED") {
state_icon.class = "lock__state-icon lock__state-icon--locked";
state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-lock-alt-svgrepo-com"/></svg>'; state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-lock-alt-svgrepo-com"/></svg>';
state_label.innerText = 'locked'; state_label.innerText = 'locked';
button_lock.disabled = true; button_lock.disabled = true;
button_unlock.disabled = false; button_unlock.disabled = false;
} else if (lock.status === "UNLOCKED") { } else if (lock.status === "UNLOCKED") {
state_icon.class = "lock__state-icon lock__state-icon--unlocked";
state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-unlock-alt-svgrepo-com"/></svg>'; state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-unlock-alt-svgrepo-com"/></svg>';
state_label.innerText = 'unlocked'; state_label.innerText = 'unlocked';
button_lock.disabled = false; button_lock.disabled = false;
button_unlock.disabled = true; button_unlock.disabled = true;
} else { } else {
state_icon.class = "lock__state-icon lock__state-icon--unknown";
state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-arrow-spin-svgrepo-com"/></svg>'; state_icon.innerHTML = '<svg class="icon"><use href="static/icons.svg#icon-arrow-spin-svgrepo-com"/></svg>';
state_label.innerText = 'unknown'; state_label.innerText = 'unknown';
button_lock.disabled = true; button_lock.disabled = true;