forked from forktown/watch-party
Textual feedback for personal colour
This commit is contained in:
parent
8e19d7b34d
commit
0fc8953a69
1 changed files with 16 additions and 1 deletions
|
@ -30,7 +30,9 @@
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<label for="join-session-colour">Personal Colour:</label>
|
<label id="join-session-colour-label" for="join-session-colour">
|
||||||
|
Personal Colour:
|
||||||
|
</label>
|
||||||
<input type="color" id="join-session-colour" value="#ffffff" required />
|
<input type="color" id="join-session-colour" value="#ffffff" required />
|
||||||
|
|
||||||
<label for="join-session-id">Session ID:</label>
|
<label for="join-session-id">Session ID:</label>
|
||||||
|
@ -65,5 +67,18 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="module" src="/main.mjs?v=bfdcf2"></script>
|
<script type="module" src="/main.mjs?v=bfdcf2"></script>
|
||||||
|
<script>
|
||||||
|
const updateColourLabel = () => {
|
||||||
|
const colour = document.querySelector("#join-session-colour").value;
|
||||||
|
document.querySelector(
|
||||||
|
"#join-session-colour-label"
|
||||||
|
).textContent = `Personal Colour: ${colour}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
document
|
||||||
|
.querySelector("#join-session-colour")
|
||||||
|
.addEventListener("input", updateColourLabel);
|
||||||
|
updateColourLabel();
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue