first commit

swaraj-das · Jun 28, 2024 · 85bbfae · 85bbfae
commit 85bbfae
Show file tree

Hide file tree

Showing 11 changed files with 405 additions and 0 deletions.
diff --git a/images/add.png b/images/add.png
diff --git a/images/arrow.png b/images/arrow.png
diff --git a/images/controller.png b/images/controller.png
diff --git a/images/fb.png b/images/fb.png
diff --git a/images/ig.png b/images/ig.png
diff --git a/images/logo.png b/images/logo.png
diff --git a/images/menu.png b/images/menu.png
diff --git a/images/tw.png b/images/tw.png
diff --git a/index.html b/index.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Collect your GamingTools</title>
+    <link rel="shortcut icon" href="images/logo.png" type="image/x-icon">
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="container">
+        <div class="navbar">
+            <img src="images/logo.png" class="logo" alt="Logo">
+            <span class="website-name">Collect your GamingTools</span>
+            <nav>
+                <ul id="menuList">
+                    <li><a href="#">Game Controllers</a></li>
+                    <li><a href="#">VR Accessories</a></li>
+                    <li><a href="#">Media Remotes</a></li>
+                    <li><a href="#">Others</a></li>
+                </ul>
+            </nav>
+            <img src="images/menu.png" class="menu-icon" onclick="toggleMenu()">
+        </div>
+
+        <div class="row">
+            <div class="col-1">
+                <h2>PS4 V2 Dualshock 4</h2>
+                <h3>Wireless Controllers for PlayStation 4</h3>
+                <p>(Compatible/Generic)</p>
+                <div class="price">
+                    <span class="original-price">&#8377;5500</span>
+                    <span class="discounted-price">&#8377;3999</span>
+                <span class="discount">30% off</span>
+                </div>
+                <button type="button">Buy Now<img src="images/arrow.png" alt="Arrow"></button>
+            </div>
+            <div class="col-2">
+                <img src="images/controller.png" class="controller" alt="Controller">
+                <div class="color-box"></div>
+                <div class="add-btn">
+                    <img src="images/add.png" alt="Add">
+                    <p><small>Add to cart</small></p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="social-links">
+        <img src="images/fb.png" alt="Facebook">
+        <img src="images/tw.png" alt="Twitter">
+        <img src="images/ig.png" alt="Instagram">
+    </div>
+    <footer>
+        <p>&copy; 2024 Gaming Website. All rights reserved.</p>
+        <p>Made by Swaraj &#128512;</p>
+    </footer>
+
+    <script src="/script.js"></script>
+
+</body>
+</html>
diff --git a/script.js b/script.js
@@ -0,0 +1,10 @@
+var menuList = document.getElementById("menuList");
+menuList.style.maxHeight = "0px";
+
+function toggleMenu() {
+    if (menuList.style.maxHeight == "0px") {
+        menuList.style.maxHeight = "130px";
+    } else {
+        menuList.style.maxHeight = "0px";
+    }
+}