From 026ac5ee5287f7ab2edf8de0b500d14264b4f363 Mon Sep 17 00:00:00 2001
From: Suyash Singh <suyxcode@gmail.com>
Date: Wed, 14 Jan 2026 22:28:54 +0530
Subject: [PATCH] Final Commit

@suyXcode
---
 index.html | 122 +++++++++++++++++++++++++----------------------------
 style.css  |  16 +++++++
 2 files changed, 73 insertions(+), 65 deletions(-)
 create mode 100644 style.css
diff --git a/index.html b/index.html
index 55ad96f..e495b8a 100644
--- a/index.html
+++ b/index.html
@@ -1,65 +1,57 @@
-<html>
-<head>
-<meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Analog Watch</title>
-<script src="https://efpage.de/DML/DML_homepage/lib/DML-min.js"></script>
-<style>
-html {
-  background: #282828;
-  text-align: center;
-  font-size: 10px;
-}
-body{
-  padding:30;
-  margin:10;
-  font-size: 2rem;
-  display: flex;
-  flex: 1;
-  min-height: 100vh;
-  align-items: center;
-}
-  </style>
-</head>
-<body>
-<script>
-  "use strict";
-    const cx = 210, cy = 210;  // Radius
-    const _clockstyle = "width: " + (2 * cx) + "px;  height: " + (2 * cy) + "px;"
-      + "border: 7px solid #CACBD5; background: #fffdf7;"
-      + "border-radius: 50%; margin: 50px;"
-      + "box-shadow: -4px -4px 10px rgba(67,67,67,0.5), inset 4px 4px 10px rgba(0,0,0,0.5),"
-      + "inset -4px -4px 10px rgba(67,67,67,0.5), 4px 4px 10px rgba(0,0,0,0.3);"
-    sidiv("", _clockstyle)
-    let c = canvas2D({ width: px(2 * cx), height: px(2 * cy) })
-    c.ctx.lineCap = "round"
-    unselectBase()
-    // Paint anything radial
-    function tick(color, width, angle, length, innerlength =0 ) {
-      function ls(length) { return length * Math.sin(angle / 180.0 * Math.PI) }
-      function lc(length) { return -length * Math.cos(angle / 180.0 * Math.PI) }
-      c.setLineType(width, color)
-      c.line(cx + ls(innerlength), cy + lc(innerlength), cx + ls(length), cy + lc(length))
-    }
-    // Draw clock
-    function drawClock() {
-      c.clear()
-      // Draw ticks
-      for (let i = 0; i < 360; i += 30)
-        if ((i % 90) == 0) tick("#2ca58d", 10, i, 200, 180)
-        else tick("salmon", 5, i, 200, 180)
-
-      // draw hands
-      let t = new Date();  // get time
-      tick("#0a2342", 10, t.getHours() * 30, 128)  // hour
-      tick("#2ca58d", 7, t.getMinutes() * 6, 145)  // min
-      tick("#ff6b6c", 5, t.getSeconds() * 6, 158)  // s
-      // drwa center
-      c.setFillStyle("#fffdf7")
-      c.circle(cx, cy, 10, { fill: true })
-    }
-    drawClock()
-    setInterval(drawClock, 1000)
-  </script>
-</body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://efpage.de/DML/DML_homepage/lib/DML-min.js"></script>
+    <link href="style.css" rel="stylesheet">
+</head>
+
+<body>
+    
+  <script>
+  "use strict";
+    const cx = 210, cy = 210;  // Radius
+    const _clockstyle = "width: " + (2 * cx) + "px;  height: " + (2 * cy) + "px;"
+      + "border: 7px solid #CACBD5; background: #fff;"
+      + "border-radius: 50%; margin: 50px;"
+      + "box-shadow: -4px -4px 10px rgba(80,67,90,0.5), inset 4px 4px 10px rgba(0,0,0.5,0.5),"
+      + "inset -4px -4px 10px rgba(67,67,87,0.5), 4px 4px 10px rgba(0,0,0,0.3);"
+
+    sidiv("", _clockstyle)
+    let c = canvas2D({ width: px(2 * cx), height: px(2 * cy) })
+    c.ctx.lineCap = "round"
+    unselectBase()
+
+    // Paint anything radial
+    function tick(color, width, angle, length, innerlength =0 ) {
+      function ls(length) { return length * Math.sin(angle / 180.0 * Math.PI) }
+      function lc(length) { return -length * Math.cos(angle / 180.0 * Math.PI) }
+      c.setLineType(width, color)
+      c.line(cx + ls(innerlength), cy + lc(innerlength), cx + ls(length), cy + lc(length))
+    }
+    // Draw clock
+    function drawClock() {
+      c.clear()
+      // Draw ticks
+      for (let i = 0; i < 360; i += 30)
+        if ((i % 90) == 0) tick("#2ca58d", 10, i, 200, 180)
+        else tick("orange", 5, i, 200, 180)
+
+      // draw hands
+      let t = new Date();  // get time
+      tick("#00FAAC", 10, t.getHours() * 30, 128)  // hour
+      tick("#862B0D", 6, t.getMinutes() * 6, 145)  // min
+      tick("#FA4659", 4, t.getSeconds() * 6, 158)  // s
+
+      // drwa center
+      c.setFillStyle("#fffdf7")
+      c.circle(cx, cy, 10, { fill: true })
+    }
+    drawClock()
+    setInterval(drawClock, 1000)
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..172fce3
--- /dev/null
+++ b/style.css
@@ -0,0 +1,16 @@
+html {
+    background: #f69f4e;
+    text-align: center;
+    font-size: 10px;
+  }
+  
+  body{
+    padding:30;
+    padding-left: 30%;
+    margin:10;
+    font-size: 2rem;
+    display: flex;
+    flex: 1;
+    min-height: 100vh;
+    align-items: center;
+  }
\ No newline at end of file
