Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 12

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tic-Tac-Toe</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
background: #f3f8fc;
margin: 0;
padding: 50px 0;
}

h1 {
font-size: 2rem;
margin-bottom: 20px;
}

.board {
display: grid;
grid-template-columns: repeat(3, 100px);
grid-gap: 5px;
justify-content: center;
margin: 0 auto 20px;
}

.cell {
width: 100px;
height: 100px;
font-size: 2.5rem;
display: flex;
align-items: center;
justify-content: center;
background: #fff;
border: 2px solid #000;
cursor: pointer;
transition: background 0.2s;
}

.cell.taken {
pointer-events: none;
background: #e0e0e0;
}

#status {
font-size: 1.2rem;
margin-bottom: 15px;
}

button {
padding: 10px 20px;
font-size: 1rem;
background: #28a745;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}

button:hover {
background: #218838;
}
</style>
</head>
<body>
<h1>🎮 Tic-Tac-Toe</h1>

<div class="board">
<div class="cell" data-index="0"></div>
<div class="cell" data-index="1"></div>
<div class="cell" data-index="2"></div>
<div class="cell" data-index="3"></div>
<div class="cell" data-index="4"></div>
<div class="cell" data-index="5"></div>
<div class="cell" data-index="6"></div>
<div class="cell" data-index="7"></div>
<div class="cell" data-index="8"></div>
</div>

<p id="status"></p>
<button id="restart">Restart Game</button>

<script>
const cells = document.querySelectorAll('.cell');
const status = document.getElementById('status');
const restartBtn = document.getElementById('restart');

let currentPlayer = 'X';
let gameActive = true;
let gameState = ["", "", "", "", "", "", "", "", ""];

const winningConditions = [
[0,1,2],[3,4,5],[6,7,8], // rows
[0,3,6],[1,4,7],[2,5,8], // columns
[0,4,8],[2,4,6] // diagonals
];

function handleCellClick(e) {
const index = e.target.dataset.index;

if(gameState[index] !== "" || !gameActive) return;

gameState[index] = currentPlayer;
e.target.textContent = currentPlayer;
e.target.classList.add("taken");

if(checkWinner()) {
status.textContent = `🎉 Player ${currentPlayer} Wins!`;
gameActive = false;
return;
}

if(!gameState.includes("")) {
status.textContent = "🤝 It's a Draw!";
gameActive = false;
return;
}

currentPlayer = currentPlayer === "X" ? "O" : "X";
status.textContent = `Player ${currentPlayer}'s Turn`;
}

function checkWinner() {
return winningConditions.some(condition => {
return condition.every(index => gameState[index] === currentPlayer);
});
}

function restartGame() {
currentPlayer = 'X';
gameActive = true;
gameState = ["", "", "", "", "", "", "", "", ""];
status.textContent = '';
cells.forEach(cell => {
cell.textContent = '';
cell.classList.remove('taken');
});
}

cells.forEach(cell => cell.addEventListener('click', handleCellClick));
restartBtn.addEventListener('click', restartGame);
</script>
</body>
</html>

1 day ago | [YT] | 0

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 11

<!DOCTYPE html>
<html>
<head>
<title>Simple Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
background: #f2f2f2;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.calculator {
background: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px #aaa;
width: 220px;
}
#result {
width: 100%;
height: 40px;
font-size: 18px;
margin-bottom: 10px;
text-align: right;
}
button {
width: 45px;
height: 45px;
margin: 3px;
font-size: 16px;
cursor: pointer;
}
</style>
</head>
<body>

<div class="calculator">
<input type="text" id="result" disabled>

<div>
<button onclick="clearResult()">C</button>
<button onclick="deleteLast()">⌫</button>
<button onclick="appendValue('/')">/</button>
<button onclick="appendValue('*')">*</button>
</div>

<div>
<button onclick="appendValue('7')">7</button>
<button onclick="appendValue('8')">8</button>
<button onclick="appendValue('9')">9</button>
<button onclick="appendValue('-')">-</button>
</div>

<div>
<button onclick="appendValue('4')">4</button>
<button onclick="appendValue('5')">5</button>
<button onclick="appendValue('6')">6</button>
<button onclick="appendValue('+')">+</button>
</div>

<div>
<button onclick="appendValue('1')">1</button>
<button onclick="appendValue('2')">2</button>
<button onclick="appendValue('3')">3</button>
<button onclick="calculate()">=</button>
</div>

<div>
<button onclick="appendValue('0')">0</button>
<button onclick="appendValue('.')">.</button>
</div>
</div>

<script>
let result = document.getElementById("result");

function appendValue(value) {
result.value += value;
}

function clearResult() {
result.value = "";
}

function deleteLast() {
result.value = result.value.slice(0, -1);
}

function calculate() {
try {
result.value = eval(result.value);
} catch {
result.value = "Error";
}
}
</script>

</body>
</html>

1 day ago | [YT] | 0

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 10
Link :https://claude.ai/public/artifacts/1ecc4478-e640-4526-a96a-45deed15f626

The Reminder App helps you stay organized and never miss an important task. You can easily set reminders for meetings, homework, events, and daily activities. With simple notifications and an easy-to-use interface, this app makes managing your time stress-free and efficient. Stay on track, stay productive, and let the Reminder App handle your schedule.

#ReminderApp #StayOrganized #TimeManagement #DailyReminders #ProductivityTools #TaskManager #NeverForget #SmartReminders

2 days ago | [YT] | 1

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 9
Link :https://claude.ai/public/artifacts/47c7bde4-eb19-47e5-bd4f-45efe23eaf70

A Calendar App is a useful digital tool that helps users keep track of dates, days, months, and important events. With this app, you can easily schedule meetings, set reminders, and plan your daily tasks. It sends notifications so you never forget important work, exams, or special occasions. A Calendar App makes time management simple and helps people stay organized in their busy lives.

#CalendarApp #TimeManagement #SmartPlanning #DigitalCalendar

2 days ago | [YT] | 1

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 8
Link :https://claude.ai/public/artifacts/4ccdd8de-7c6f-4959-85f2-66c1f97751a0

An alarm is a useful tool that helps us manage our time and stay punctual. It reminds us to wake up on time, take medicine, attend meetings, and complete important tasks. By using an alarm, we can stay organized, avoid forgetting things, and make our daily routine more productive.

#Alarm #TimeManagement #DailyRoutine #BeOnTime #smartlifelenses

4 days ago | [YT] | 1

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 7
Link:https://claude.ai/public/artifacts/6e4f984f-689a-4e9d-92fc-67297008e39f

A stopwatch is a simple tool used to measure time accurately. It helps in tracking seconds, minutes, and hours during activities like sports, studying, workouts, and experiments.

#Stopwatch #TimeTracking #TimerApp #Productivity #TechTools

5 days ago | [YT] | 0

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 6
Link : https://claude.ai/public/artifacts/0ed169a4-754b-45e9-863c-1d0402d7e87e

The Currency Converter App is a user-friendly mobile application designed to provide instant and accurate currency conversion for travelers, businesses, and global users. By leveraging real-time exchange rates from trusted financial sources, it allows seamless conversion between multiple currencies worldwide. The app ensures convenience, speed, and reliability, making international transactions and financial planning easier than ever. Its intuitive interface, offline mode for recent rates, and support for multiple currencies make it an essential tool for anyone dealing with foreign exchange.
Our Currency Converter App simplifies international finance by offering a fast and precise way to convert currencies. Users can select from hundreds of currencies, view live exchange rates, and perform conversions instantly. The app features a clean and intuitive interface, historical rate charts, and the ability to save favorite currencies for quick access. Whether you are traveling abroad, shopping online, or managing global business transactions, this app ensures you always have the most accurate conversion at your fingertips. Its lightweight design, offline mode, and real-time updates make it a reliable companion for daily currency needs.

#CurrencyConverter #ForexApp #MoneyMatters #TravelSmart #FinanceApp #ExchangeRates #GlobalTransactions #CurrencyConversion

6 days ago | [YT] | 0

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 5
Link : https://claude.ai/public/artifacts/59083e47-e8bd-47f7-a78f-c25e6fa7a503

Stay updated with real-time weather forecasts, temperature, humidity, wind speed, and severe weather alerts. Plan your day better with accurate hourly and weekly predictions, all in a simple and user-friendly interface.

#WeatherApp #RealTimeForecast #StayPrepared #WeatherUpdates #DailyForecast #WeatherAlert #TemperatureUpdate

6 days ago | [YT] | 1

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Roll No #RSLC 05
Coding task 4
Link :https://claude.ai/public/artifacts/014988c9-5216-4472-aa09-b11b3798bb2f

Multi-Trial Quiz Game is an exciting and interactive game that challenges players to test their knowledge across multiple rounds. Each trial gives you a new chance to answer fun and tricky questions, helping you improve your skills, boost your confidence, and learn something new every time you play. With a simple design and engaging gameplay, this quiz game is perfect for students, learners, and anyone who loves smart challenges. Play, retry, and master every level!

Hashtags:
#MultiTrialQuizGame #QuizGame #LearningThroughFun #BrainBoost #KnowledgeChallenge #EducationalGame #PlayAndLearn #SmartGaming #QuizTime

1 week ago | [YT] | 0

View 0 replies

Mujtaba Adnan 𝑻𝒆𝒄𝒉𝒏𝒐𝒍𝒐𝒈𝒚 𝒘𝒂𝒍𝒂

Coding task 3
Make a To do list app
Link :https://claude.ai/public/artifacts/0f34b7d6-7cf8-44ea-91b6-8618b34149f0

A To-Do List App helps you organize your daily tasks, set priorities, and stay productive throughout the day. With an easy-to-use interface, you can add, edit, and complete tasks in just a few taps. Whether it’s for school, work, or personal goals, this app keeps everything in one place so you never forget what matters most.

#ToDoListApp #TaskManager #ProductivityTools #DailyTasks #StayOrganized #SmartPlanning #TimeManagement #GetThingsDone #TaskTracker #FocusOnGoals

1 week ago | [YT] | 1

View 0 replies