Checkpoint

I haven't touched this code in a month and need a rollback point for when I break everything.
2026-07-25 17:39:21 -04:00
parent cc14fc933d
commit 3c2c8ec0ae
2 changed files with 292 additions and 239 deletions
@@ -0,0 +1,21 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&family=VT323&display=swap" rel="stylesheet">
+    <link href='https://fonts.googleapis.com/css?family=Inter' rel='stylesheet'>
+    <link rel="stylesheet" href="timer.css" />
+    <script src="timer.js"></script>
+    <title>Lilac Timer</title>
+  </head>
+  <body>
+    <main>
+      <div class='widgetContainer'>
+        <div class="layoutContainer">
+        </div>
+      </div>
+    </main>
+  </body>
+</html>
@@ -52,6 +52,14 @@ p {
  font-size: 1.3em;
 }

+
+
+/*
+*** Timer Widget ***
+*/
+
+
+
  .contentContainer {
    height: fit-content;
    width: fit-content;
@@ -332,3 +340,27 @@ p {
    42% {left: 0%; top: 0%;}
    100% {left: -54%; top: 0%;}
  }
+
+
+
+/*
+*** Progres Bar Widget ***
+*/
+
+
+  .widgetContainer {
+    max-height: 16vh;
+    max-width: 100vw;
+    position: relative;
+    text-align: center;
+    background-color: lightblue;
+    container-type: inline-size;
+    container-name: sidebar;
+  }
+  .layoutContainer {
+    height: clamp(64px, calc(.164*100vw), calc(.164*100vw));
+    width: clamp(36.563px, 100vw, 100vw);
+    position: relative;
+    text-align: center;
+    background-color: grey;
+  }