Poki Games

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Student Registration Form</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background: #f2f2f2;
    }
    .container {
      width: 300px;
      margin: 100px auto;
      padding: 20px;
      background: white;
      text-align: center;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    h2 {
      margin-bottom: 20px;
    }
    input, select {
      width: 90%;
      padding: 8px;
      margin: 8px 0;
      border-radius: 5px;
      border: 1px solid #ccc;
    }
    input:focus, select:focus {
      border-color: blue;
      outline: none;
    }
    button {
      padding: 10px;
      width: 95%;
      background: green;
      color: white;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
    button:hover {
      background: darkgreen;
    }
  </style>
</head>
<body>
  <div class="container">
    <h2>Student Registration Form</h2>
    <form id="form" onsubmit="return validateForm()">
      <input type="text" id="name" placeholder="Full Name"><br>
      <input type="email" id="email" placeholder="Email"><br>
      <input type="text" id="phone" placeholder="Phone Number"><br>
      <select id="course">
        <option value="">Select Course</option>
        <option>BCA</option>
        <option>BSc</option>
        <option>BCom</option>
      </select><br>
      <button type="submit">Register</button>
    </form>
  </div>
  <script>
    function validateForm() {
      let name = document.getElementById("name").value.trim();
      let email = document.getElementById("email").value.trim();
      let phone = document.getElementById("phone").value.trim();
      let course = document.getElementById("course").value;
      let emailPattern = /^[^ ]+@[^ ]+\.[a-z]{2,3}$/;
      let phonePattern = /^[0-9]{10}$/;
      if (name === "" || email === "" || phone === "" || course === "") {
        alert("All fields are required!");
        return false;
      }
      if (!emailPattern.test(email)) {
        alert("Enter a valid email address!");
        return false;
      }
      if (!phonePattern.test(phone)) {
        alert("Enter a valid 10-digit phone number!");
        return false;
      }
      alert("Registration Successful! Welcome, " + name + "!");
      document.getElementById("form").reset();
      return false;
    }
  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <title>To-Do List App</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background: #f2f2f2;
    }
    .container {
      width: 300px;
      margin: 100px auto;
      padding: 20px;
      background: white;
      text-align: center;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    }
    h2 {
      margin-bottom: 20px;
    }
    input {
      width: 70%;
      padding: 8px;
      border-radius: 5px;
      border: 1px solid #ccc;
    }
    button {
      padding: 8px;
      background: blue;
      color: white;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }
    button:hover {
      background: darkblue;
    }
    ul {
      margin-top: 15px;
      padding: 0;
    }
    li {
      list-style: none;
      padding: 8px;
      margin: 5px 0;
      background: #e6e6e6;
      border-radius: 5px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      cursor: pointer;
    }
    li.completed {
      text-decoration: line-through;
      color: gray;
    }
    .delete-btn {
      background: red;
      color: white;
      border: none;
      padding: 5px;
      border-radius: 3px;
    }
  </style>
</head>
<body>
  <div class="container">
    <h2>To-Do List</h2>
    <input type="text" id="taskInput" placeholder="Enter a task">
    <button onclick="addTask()">Add Task</button>
    <ul id="taskList"></ul>
  </div>
  <script>
    function addTask() {
      let taskInput = document.getElementById("taskInput");
      let taskValue = taskInput.value.trim();
      if (taskValue === "") {
        alert("Please enter a task!");
        return;
      }
      let li = document.createElement("li");
      li.innerText = taskValue;
      li.onclick = function () { li.classList.toggle("completed"); };
      let delBtn = document.createElement("button");
      delBtn.innerText = "X";
      delBtn.className = "delete-btn";
      delBtn.onclick = function (e) { e.stopPropagation(); li.remove(); };
      li.appendChild(delBtn);
      document.getElementById("taskList").appendChild(li);
      taskInput.value = "";
    }
  </script>
</body>
</html>