Basics for OnlyKat

learning-thing · Jul 7, 2024 · a777214 · a777214
1 parent 1a7cd4f
commit a777214
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 0 deletions.
diff --git a/index.css b/index.css
@@ -0,0 +1,24 @@
+.title {
+    font-family: sans-serif;
+    transition-duration: 2s;
+}
+
+#title {
+    font-family: sans-serif;
+    transition-duration: .4s;
+}
+
+#clickme {
+    font-family: sans-serif;
+    transition-duration: 1s;
+    background-color: black;
+    color: white;
+    border-radius: 10px;
+    padding: 10px;
+
+}
+
+body {
+
+    background-color: rgba(82, 77, 129, 0.671);
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <title>OnlyKats</title>
+        <link rel="stylesheet" href="index.css">
+    </head>
+    <body>
+        <div id="root">
+            <h1 id="title">OnlyKats</h1>
+            <button onclick="initmethod()" id="clickme">Click Me</button>
+        </div>
+    </body>
+    <script src="index.js"></script>
+</html>
diff --git a/index.js b/index.js
@@ -0,0 +1,20 @@
+var x = 1;
+var clickCount = 0;
+
+function initmethod() {
+    clickCount++;
+    document.getElementById("clickme").innerHTML = "Click Me " + clickCount;
+
+    if (x < 9) {
+        x+=1;
+        console.log("X is zero");
+        document.getElementById("title").innerHTML = "Kat Level: "+(x+1);
+        document.getElementById("title").style.marginLeft = ((x+1)*20) + "px";
+    } else {
+        x = 0;
+    }
+}
+
+
+
+//#initmethod();