initial commit

2025-12-19 18:27:11 +09:00
commit 1f8fd99d25
9 changed files with 286 additions and 0 deletions
--- a/templates/index.html
+++ b/templates/index.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Clock Engagement</title>
+    <style>
+        body {
+            background-color: #F3E5F5; /* Very pale light purple */
+            margin: 0;
+            height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+        .box {
+            width: 300px;
+            height: 300px;
+            border: 2px solid black;
+            background-color: #000000;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+        }
+    </style>
+</head>
+<body>
+    <div class="box" id="colorBox">
+        <!-- Content can go here -->
+    </div>
+    <script>
+        function updateColor() {
+            fetch('/color')
+                .then(response => response.json())
+                .then(data => {
+                    document.getElementById('colorBox').style.backgroundColor = data.color;
+                })
+                .catch(error => console.error('Error fetching color:', error));
+        }
+
+        // Update every 100 milliseconds
+        setInterval(updateColor, 811);
+    </script>
+</body>
+</html>