Show changes on popout button

This commit is contained in:
David Cook
2023-11-23 13:32:44 +11:00
parent 5e96368c85
commit 88fe8dcbe0
2 changed files with 12 additions and 1 deletions

View File

@@ -42,7 +42,10 @@ export default class PopoutController extends Controller {
close() {
// Close if not already closed
if (this.dialogTarget.style.display != "none") {
// Update button to represent any changes
this.buttonTarget.innerText = this.#displayValue();
this.buttonTarget.classList.toggle("changed", this.#isChanged());
this.dialogTarget.style.display = "none";
}
}
@@ -78,6 +81,10 @@ export default class PopoutController extends Controller {
return values.filter(Boolean).join();
}
#isChanged() {
return this.#enabledDisplayElements().some((element) => element.classList.contains("changed"));
}
#enabledDisplayElements() {
return this.displayElements.filter((element) => !element.disabled);
}

View File

@@ -300,9 +300,13 @@
color: $color-txt-text;
position: relative;
}
&.changed {
border-color: $color-txt-changed-brd;
}
}
&:hover:not(:active):not(:focus) {
&:hover:not(:active):not(:focus):not(.changed) {
border-color: transparent;
}