diff options
author | elioat <elioat@tilde.institute> | 2024-08-15 06:06:17 -0400 |
---|---|---|
committer | elioat <elioat@tilde.institute> | 2024-08-15 06:06:17 -0400 |
commit | 9f6bfa0fc299615b2676bfaa2b6b3a7ee8063531 (patch) | |
tree | 5b8012bdc22235fa2ee0aa4e461c46ea19a3054c /js/lut-cam/index.html | |
parent | 800d420eab70942506f2c96ab63f3d845592e7d2 (diff) | |
download | tour-9f6bfa0fc299615b2676bfaa2b6b3a7ee8063531.tar.gz |
*
Diffstat (limited to 'js/lut-cam/index.html')
-rw-r--r-- | js/lut-cam/index.html | 29 |
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> |