about summary refs log tree commit diff stats
path: root/js/lut-cam/index.html
diff options
context:
space:
mode:
authorelioat <elioat@tilde.institute>2024-08-15 06:06:17 -0400
committerelioat <elioat@tilde.institute>2024-08-15 06:06:17 -0400
commit9f6bfa0fc299615b2676bfaa2b6b3a7ee8063531 (patch)
tree5b8012bdc22235fa2ee0aa4e461c46ea19a3054c /js/lut-cam/index.html
parent800d420eab70942506f2c96ab63f3d845592e7d2 (diff)
downloadtour-9f6bfa0fc299615b2676bfaa2b6b3a7ee8063531.tar.gz
*
Diffstat (limited to 'js/lut-cam/index.html')
-rw-r--r--js/lut-cam/index.html29
1 files changed, 27 insertions, 2 deletions
diff --git a/js/lut-cam/index.html b/js/lut-cam/index.html
index 28d9b0d..02186c6 100644
--- a/js/lut-cam/index.html
+++ b/js/lut-cam/index.html
@@ -13,7 +13,7 @@
             display: flex;
             justify-content: center;
             align-items: center;
-            background-color: #000;
+            background-color: beige;
         }
         #canvas {
             width: 100%;
@@ -40,6 +40,27 @@
             font-size: 18px;
             cursor: pointer;
         }
+
+        button, select {
+            border: none;
+            cursor: pointer;
+            transition: background-color 0.3s ease;
+        }
+
+        button:hover, button:focus {
+            outline: none; 
+        }
+
+        button.capture {
+            background-color: teal;
+            color: #FFFFFF;
+        }
+
+        button.capture:disabled {
+            background-color: #ccc;
+            color: #5c5c5c;
+        }
+
     </style>
 </head>
 <body>
@@ -66,10 +87,14 @@
 </div>
 
 <div id="controls">
+    <div id="focus-container">
+        <input style="display: none;" type="range" id="focus-slider" min="0" max="100" step="1" value="50" disabled>
+    </div>
     <button id="toggle-camera">Turn Camera On</button>
-    <button id="capture" disabled>Capture Frame</button>
+    <button id="capture" disabled class="capture">Capture Image</button>
 </div>
 
+
 <script src="lut.js"></script>
 </body>
 </html>