diff --git a/macrovision.css b/macrovision.css index 0cea0570..9b89b4ad 100644 --- a/macrovision.css +++ b/macrovision.css @@ -49,6 +49,10 @@ body { filter: brightness(var(--brightness)); } +.entity-image.flipped { + transform: translate(-50%, var(--offset)) scale(-1, 1); +} + .entity-name { display: none; position: absolute; @@ -1028,4 +1032,5 @@ button { left: 0%; z-index: 1; user-select: none; -} \ No newline at end of file +} + diff --git a/macrovision.html b/macrovision.html index a742c19e..0c1e3b9c 100644 --- a/macrovision.html +++ b/macrovision.html @@ -210,6 +210,9 @@
Brightness
+
+ +
diff --git a/macrovision.js b/macrovision.js index 29415ad2..bc546431 100644 --- a/macrovision.js +++ b/macrovision.js @@ -2035,6 +2035,14 @@ document.addEventListener("DOMContentLoaded", () => { updateSizes(); }); + document.querySelector("#options-flip").addEventListener("click", e => { + if (selected) { + selected.querySelector(".entity-image").classList.toggle("flipped"); + } + document.querySelector("#options-brightness-display").innerText = entities[selected.dataset.key].brightness; + updateSizes(); + }); + const sceneChoices = document.querySelector("#scene-choices"); Object.entries(scenes).forEach(([id, scene]) => {