acesdit · Tejas-Santosh-Nalawade · Oct 23, 2025 · Oct 23, 2025
diff --git a/Domains/Frontend/MiniProjects/PomodoroTimer/README.md b/Domains/Frontend/MiniProjects/PomodoroTimer/README.md
@@ -0,0 +1,54 @@
+# 🍅 Pomodoro Timer
+
+**Contributor:** [YourGitHubUsername](https://github.com/YourGitHubUsername)
+
+---
+
+## 🧾 Description  
+A simple and effective **Pomodoro Timer** web app built using **HTML**, **CSS**, and **JavaScript**.  
+Helps you manage your work and break sessions following the Pomodoro technique to boost productivity.
+
+---
+
+## 📁 Folder Structure
+
+Pomodoro-Timer/
+├── index.html # Main HTML file
+├── style.css # Stylesheet for layout and design
+├── script.js # JavaScript logic for timer functionality
+└── README.md # Project documentation
+
+---
+
+## 🚀 Features  
+- ⏲️ 25-minute work sessions and 5-minute breaks by default  
+- ▶️ Start, pause, and reset timer controls  
+- 🔄 Automatic session switching between work and break  
+- 🔔 Alerts on session changes  
+- 📱 Responsive and clean UI  
+
+---
+
+## 🧩 Tech Stack  
+- **HTML5** – Structure and markup  
+- **CSS3** – Styling and layout  
+- **JavaScript (Vanilla)** – Timer logic and interactivity  
+
+---
+
+## 💡 How to Use  
+1. Click **Start** to begin a work session timer.  
+2. Use **Pause** to stop the timer temporarily.  
+3. Click **Reset** to restart the timer and switch back to the work session.  
+4. When time ends, an alert notifies you to switch sessions automatically.
+
+---
+
+## 📂 Installation & Usage  
+1. Clone or download the repository.  
+2. Open `index.html` in your web browser.  
+3. Enjoy your Pomodoro sessions!
+
+---
+
+Feel free to contribute and improve this project!
diff --git a/Domains/Frontend/MiniProjects/PomodoroTimer/index.html b/Domains/Frontend/MiniProjects/PomodoroTimer/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Pomodoro Timer</title>
+  <link rel="stylesheet" href="style.css" />
+</head>
+<body>
+  <div class="container">
+    <h1>Pomodoro Timer 🍅</h1>
+    <div class="timer" id="timer">25:00</div>
+    <div class="controls">
+      <button id="start">Start</button>
+      <button id="pause">Pause</button>
+      <button id="reset">Reset</button>
+    </div>
+    <div class="session-info">
+      <p>Work Session: <span id="work-length">25</span> minutes</p>
+      <p>Break Session: <span id="break-length">5</span> minutes</p>
+    </div>
+  </div>
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/Domains/Frontend/MiniProjects/PomodoroTimer/script.js b/Domains/Frontend/MiniProjects/PomodoroTimer/script.js
@@ -0,0 +1,57 @@
+const timerDisplay = document.getElementById('timer');
+const startBtn = document.getElementById('start');
+const pauseBtn = document.getElementById('pause');
+const resetBtn = document.getElementById('reset');
+const workLength = 25 * 60; // 25 minutes in seconds
+const breakLength = 5 * 60; // 5 minutes in seconds
+
+let isRunning = false;
+let isWorkSession = true;
+let timeLeft = workLength;
+let timerInterval;
+
+function updateTimerDisplay(seconds) {
+  const m = Math.floor(seconds / 60);
+  const s = seconds % 60;
+  timerDisplay.textContent = `${m.toString().padStart(2,'0')}:${s.toString().padStart(2,'0')}`;
+}
+
+function switchSession() {
+  isWorkSession = !isWorkSession;
+  timeLeft = isWorkSession ? workLength : breakLength;
+  updateTimerDisplay(timeLeft);
+  alert(isWorkSession ? "Work session started! Focus!" : "Break time! Relax!");
+}
+
+function tick() {
+  if (timeLeft > 0) {
+    timeLeft--;
+    updateTimerDisplay(timeLeft);
+  } else {
+    switchSession();
+  }
+}
+
+startBtn.addEventListener('click', () => {
+  if (!isRunning) {
+    isRunning = true;
+    timerInterval = setInterval(tick, 1000);
+  }
+});
+
+pauseBtn.addEventListener('click', () => {
+  if (isRunning) {
+    clearInterval(timerInterval);
+    isRunning = false;
+  }
+});
+
+resetBtn.addEventListener('click', () => {
+  clearInterval(timerInterval);
+  isRunning = false;
+  isWorkSession = true;
+  timeLeft = workLength;
+  updateTimerDisplay(timeLeft);
+});
+
+updateTimerDisplay(timeLeft);
diff --git a/Domains/Frontend/MiniProjects/PomodoroTimer/style.css b/Domains/Frontend/MiniProjects/PomodoroTimer/style.css
@@ -0,0 +1,52 @@
+body {
+  background: #fdf6e3;
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  margin: 0;
+  color: #333;
+}
+
+.container {
+  background: #fff;
+  padding: 30px 50px;
+  border-radius: 10px;
+  box-shadow: 0 0 15px rgba(0,0,0,0.1);
+  text-align: center;
+  width: 320px;
+}
+
+h1 {
+  margin-bottom: 20px;
+}
+
+.timer {
+  font-size: 4rem;
+  margin-bottom: 20px;
+  font-weight: bold;
+  color: #d95550;
+}
+
+.controls button {
+  padding: 10px 20px;
+  margin: 0 5px;
+  border: none;
+  background-color: #d95550;
+  color: white;
+  font-weight: bold;
+  font-size: 1rem;
+  border-radius: 5px;
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+}
+
+.controls button:hover {
+  background-color: #b94443;
+}
+
+.session-info p {
+  margin: 10px 0 0 0;
+  font-size: 1rem;
+}