diff --git a/index.html b/index.html
index 735da08..98ee3fb 100644
--- a/index.html
+++ b/index.html
@@ -180,6 +180,10 @@
width: 4em;
}
+ input[disabled] {
+ border-color: var(--box-border);
+ }
+
/* No character loaded box (AKA the welcome screen) */
#cont-no-loaded {
@@ -209,6 +213,30 @@
font-weight: normal;
font-size: 80%;
}
+
+ /* Input unlockers */
+
+ .input-unlocker {
+ display: none;
+ }
+
+ .input-unlocker + label > .input-locked {
+ display: initial;
+ cursor: pointer;
+ }
+
+ .input-unlocker + label > .input-unlocked {
+ display: none;
+ cursor: pointer;
+ }
+
+ .input-unlocker:checked + label > .input-locked {
+ display: none;
+ }
+
+ .input-unlocker:checked + label .input-unlocked {
+ display: initial;
+ }
@@ -232,8 +260,18 @@
Character data
Campaign
Name
- Max Effort
- Armor
+ Max Effort
+
+
+ Armor
+
+
Pools
@@ -245,9 +283,19 @@
Pool
/
-
+
+
+
Edge
-
+
+
+
@@ -257,9 +305,19 @@
Pool
/
-
+
+
+
Edge
-
+
+
+
@@ -269,9 +327,19 @@
Pool
/
-
+
+
+
Edge
-
+
+
+
@@ -297,6 +365,15 @@
}
};
+ const toggleInputLockedHandler = (evt) => {
+ let cb = evt.target;
+ let pool = cb.id.slice(cb.id.lastIndexOf("-") + 1);
+ let input = cb.previousElementSibling;
+ let toUnlock = cb.checked;
+
+ input.disabled = !toUnlock;
+ };
+
document.addEventListener(
"DOMContentLoaded",
() => {
@@ -304,6 +381,10 @@
document.getElementById("warn-no-local-storage").style.display = "initial";
alert("Local Storage is not available, saving and loading data will be unavailable.");
}
+
+ document
+ .querySelectorAll(".input-unlocker")
+ .forEach((elem) => {elem.addEventListener("change", toggleInputLockedHandler)});
},
);