Adding New Project

CodeMonitor-lab · CodeMonitor-lab · commit b9f42909d4dc · 2025-07-20T12:14:00.000+03:00
diff --git a/Calculator/Calculator.html b/Calculator/Calculator.html
@@ -0,0 +1,79 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Tailwind Calculator</title>
+  <script src="https://cdn.tailwindcss.com"></script>
+</head>
+<body class="bg-gray-100 flex items-center justify-center h-screen">
+
+  <div class="bg-white p-6 rounded-2xl shadow-lg w-80">
+    <h1 class="text-2xl font-bold text-center mb-4">Calculator</h1>
+
+    <input type="text" id="display" class="w-full text-right text-2xl p-3 mb-4 border rounded-md bg-gray-100" disabled>
+
+    <div class="grid grid-cols-4 gap-3">
+      <!-- Row 1 -->
+      <button class="btn" onclick="clearDisplay()">C</button>
+      <button class="btn" onclick="deleteLast()">DEL</button>
+      <button class="btn" onclick="append('%')">%</button>
+      <button class="btn bg-orange-500 text-white" onclick="append('/')">/</button>
+
+      <!-- Row 2 -->
+      <button class="btn" onclick="append('7')">7</button>
+      <button class="btn" onclick="append('8')">8</button>
+      <button class="btn" onclick="append('9')">9</button>
+      <button class="btn bg-orange-500 text-white" onclick="append('*')">*</button>
+
+      <!-- Row 3 -->
+      <button class="btn" onclick="append('4')">4</button>
+      <button class="btn" onclick="append('5')">5</button>
+      <button class="btn" onclick="append('6')">6</button>
+      <button class="btn bg-orange-500 text-white" onclick="append('-')">-</button>
+
+      <!-- Row 4 -->
+      <button class="btn" onclick="append('1')">1</button>
+      <button class="btn" onclick="append('2')">2</button>
+      <button class="btn" onclick="append('3')">3</button>
+      <button class="btn bg-orange-500 text-white" onclick="append('+')">+</button>
+
+      <!-- Row 5 -->
+      <button class="btn col-span-2" onclick="append('0')">0</button>
+      <button class="btn" onclick="append('.')">.</button>
+      <button class="btn bg-green-500 text-white" onclick="calculate()">=</button>
+    </div>
+  </div>
+
+  <script>
+    const display = document.getElementById('display');
+
+    function append(value) {
+      display.value += value;
+    }
+
+    function clearDisplay() {
+      display.value = '';
+    }
+
+    function deleteLast() {
+      display.value = display.value.slice(0, -1);
+    }
+
+    function calculate() {
+      try {
+        display.value = eval(display.value);
+      } catch (e) {
+        display.value = 'Error';
+      }
+    }
+  </script>
+
+  <style>
+    .btn {
+      @apply bg-gray-200 p-4 rounded-md text-xl font-semibold hover:bg-gray-300;
+    }
+  </style>
+
+</body>
+</html>
