Initial commit

index.html

@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Stitches and Rows</title>
+    <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
+    <link rel="stylesheet" href="style.css">
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
+    <script src="script.js" defer></script>
+</head>
+<body>
+
+<h1>
+  Stiches and Rows!
+</h1>
+
+
+  <div id="settings-card">
+    <h2>Settings</h2>
+    <div class="settings-group">
+      <label>
+        Stitches per Row
+        <input type="number" id="input-stitches">
+      </label>
+      <label class="toggle">
+        <span>Auto-increase rows</span>
+        <input type="checkbox" id="input-autoincrease">
+        <span class="slider"></span>
+      </label>
+    </div>
+  </div>
+
+    <textarea id="notes" placeholder="Notes..."></textarea>
+
+    <div id="pip-button-container">
+        <button id="button-start-pip" title="Picture in Picture">
+          <span class="material-icons">picture_in_picture</span>
+        </button>
+    </div>
+
+    <div id="div-pip-container">
+        <div id="div-pip-element">
+            <div class="counter-buttons">
+                <button id="button-stitch">
+                    <div id="stitches-counter">0</div>
+                    <div>Stitches</div>
+                </button>
+                <button id="button-row">
+                    <div id="rows-counter">0</div>
+                    <div>Rows</div>
+                </button>
+            </div>
+
+            <div class="control-buttons">
+                <button id="button-undo">Undo</button>
+                <button id="button-reset">Reset</button>
+            </div>
+        </div>
+    </div>
+
+    <div id="about">
+        <h3>
+            About this Site
+        </h3>
+        <p>
+            This is <b>Stiches and Rows</b>, made by Honey.
+        </p>
+        <p>
+            You can support this projects by buying me a Starbucks and giving luvs
+        </p>
+
+        <p style="text-align:center;">
+            <a class="icon-link" href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQTz06kj_mq-KXVfbAiItN5iWLoPQ_OQPfacqbV0uvlrIb3mOzwnYIDhiiNdnITap0rTKc&usqp=CAU" target="_blank"><i class="fa-solid fa-cat"></i></a> | 
+            <a class="icon-link" href="https://www.starbucks.de/de/" target="_blank"><i class="fa-solid fa-heart"></i></a>
+        </p>
+    </div>
+
+        
+</body>
+</html>