completed basic model of project

Vikram-Singh0 · Vikram-Singh0 · commit ec37d356202e · 2024-06-29T00:12:29.000+05:30
diff --git a/index.html b/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <title>Document</title>
+
+</head>
+<body>
+    <label id="counter">0</label>
+    <br><br>
+    <div id="btncontainer">
+        <button id="decrease" class="btn">Decrese</button>
+        <button id="reset" class="btn">Reset</button>
+        <button id="increase" class="btn">Increase</button>
+
+    </div>
+   
+    <script src="index.js"></script>
+</body>
+</html>
diff --git a/index.js b/index.js
@@ -0,0 +1,21 @@
+
+
+const decrease= document.getElementById("decrease");
+const reset= document.getElementById("reset");
+const increase= document.getElementById("increase");
+const counter= document.getElementById("counter");
+
+let count=0;
+
+decrease.onclick=function(){
+    count--;
+    counter.textContent=count;
+}
+reset.onclick=function(){
+    count=0;
+    counter.textContent=count;
+}
+increase.onclick=function(){
+    count++;
+    counter.textContent=count;
+}
diff --git a/style.css b/style.css
@@ -0,0 +1,27 @@
+#counter{
+    font-size: 10rem;
+    font-family: 'Times New Roman', Times, serif;
+    text-align: center;
+    display: block;
+}
+
+#btncontainer{
+    display: flex;
+    text-align: center;
+    justify-content: center;
+    
+}
+.btn{
+    padding: 10px;
+    margin: 20px;
+    font-size: 4vh;
+    color: cornflowerblue;
+    background-color: black;
+    cursor: pointer;
+    border-radius: 10%;
+    border: 10px bold blueviolet;
+    
+}
+.btn :hover{
+      background-color: aquamarine;  
+}
