<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ervasu'ya Küçük Bir Dünya ♡</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;1,600&display=swap" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.6.0/dist/confetti.browser.min.js"></script>
<style>
:root {
--bg: #fff5f6;
--card-bg: rgba(255, 255, 255, 0.85);
--primary: #f26a8d;
--primary-hover: #e04b73;
--secondary: #ffb3c6;
--accent: #ffe3e8;
--text: #4a3b40;
--text-muted: #8c7a80;
--radius: 24px;
--shadow: 0 10px 30px rgba(242, 106, 141, 0.12);
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
-webkit-tap-highlight-color: transparent;
}
body {
font-family: 'Plus Jakarta Sans', sans-serif;
background: linear-gradient(135deg, #ffeef2 0%, #fff6ed 50%, #f6f0ff 100%);
color: var(--text);
min-height: 100vh;
display: flex;
justify-content: center;
padding: 20px 14px 60px;
}
.container {
width: 100%;
max-width: 520px;
display: flex;
flex-direction: column;
gap: 22px;
}
/* Üst Bilgi */
.top-badge {
display: flex;
justify-content: space-between;
font-size: 0.85rem;
font-weight: 600;
color: var(--primary);
padding: 0 4px;
}
header {
text-align: center;
background: var(--card-bg);
backdrop-filter: blur(12px);
border-radius: var(--radius);
padding: 30px 22px;
box-shadow: var(--shadow);
border: 1px solid rgba(255, 255, 255, 0.9);
}
.heart-icon {
font-size: 2.2rem;
display: inline-block;
animation: float 2.6s ease-in-out infinite;
}
@keyframes float {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-7px) scale(1.08); }
}
.subtitle {
font-size: 0.82rem;
text-transform: uppercase;
letter-spacing: 2px;
color: var(--primary);
margin-top: 8px;
font-weight: 700;
}
h1 {
font-family: 'Playfair Display', serif;
font-size: 2rem;
color: #3b282e;
margin: 10px 0;
line-height: 1.25;
}
p.lead {
font-size: 0.93rem;
color: var(--text-muted);
line-height: 1.5;
}
/* Kart Yapıları */
.card {
background: var(--card-bg);
backdrop-filter: blur(12px);
border-radius: var(--radius);
padding: 24px 20px;
box-shadow: var(--shadow);
border: 1px solid rgba(255, 255, 255, 0.85);
}
.card h2 {
font-size: 1.2rem;
color: #3b282e;
margin-bottom: 6px;
display: flex;
align-items: center;
gap: 8px;
}
.card p.desc {
font-size: 0.88rem;
color: var(--text-muted);
margin-bottom: 16px;
}
/* Butonlar */
.btn {
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
border: none;
padding: 12px 18px;
border-radius: 16px;
font-size: 0.92rem;
font-weight: 600;
cursor: pointer;
box-shadow: 0 4px 14px rgba(242, 106, 141, 0.28);
transition: all 0.2s ease;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
width: 100%;
}
.btn:active {
transform: scale(0.97);
}
.btn-secondary {
background: var(--accent);
color: var(--primary);
box-shadow: none;
}
/* MOD SEÇİMİ */
.mood-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
.mood-btn {
background: #fff;
border: 1.5px solid #ffe1e8;
border-radius: 16px;
padding: 14px 10px;
font-size: 0.88rem;
font-weight: 600;
color: var(--text);
cursor: pointer;
transition: 0.2s;
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
}
.mood-btn span {
font-size: 1.4rem;
}
.mood-btn:active, .mood-btn.active {
background: #fff0f4;
border-color: var(--primary);
color: var(--primary);
}
.mood-message {
margin-top: 14px;
padding: 14px;
background: #fff0f3;
border-radius: 14px;
font-size: 0.9rem;
text-align: center;
color: #92344f;
display: none;
line-height: 1.45;
animation: fadeIn 0.3s ease;
}
/* MOTİVASYON KURABİYESİ */
.cookie-box {
text-align: center;
padding: 10px 0;
}
.cookie-icon {
font-size: 3.5rem;
cursor: pointer;
display: inline-block;
transition: transform 0.2s;
user-select: none;
}
.cookie-icon:active {
transform: scale(0.88) rotate(-10deg);
}
.fortune-result {
margin-top: 14px;
font-size: 0.95rem;
font-weight: 600;
color: var(--primary);
min-height: 48px;
display: flex;
align-items: center;
justify-content: center;
padding: 12px;
background: #fff;
border-radius: 14px;
border: 1px dashed var(--secondary);
}
/* TAB MENÜ (OYUNLAR) */
.game-tabs {
display: flex;
gap: 6px;
background: rgba(255, 255, 255, 0.7);
padding: 5px;
border-radius: 18px;
margin-bottom: 14px;
overflow-x: auto;
}
.tab-btn {
flex: 1;
min-width: 75px;
background: transparent;
border: none;
padding: 8px 10px;
border-radius: 12px;
font-size: 0.78rem;
font-weight: 600;
color: var(--text-muted);
cursor: pointer;
white-space: nowrap;
transition: 0.2s;
}
.tab-btn.active {
background: white;
color: var(--primary);
box-shadow: 0 3px 8px rgba(0,0,0,0.06);
}
.game-screen {
display: none;
background: #fff;
border-radius: 18px;
padding: 18px;
border: 1px solid #ffebf0;
text-align: center;
}
.game-screen.active {
display: block;
animation: fadeIn 0.3s ease;
}
/* OYUN 1: Kalp Yakalama */
.catcher-area {
height: 220px;
background: #fff7f9;
border-radius: 16px;
position: relative;
overflow: hidden;
margin: 12px 0;
border: 2px dashed #ffd5df;
}
.falling-heart {
position: absolute;
font-size: 1.8rem;
cursor: pointer;
user-select: none;
transition: transform 0.1s;
}
/* OYUN 2: Hafıza Kartları */
.memory-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 8px;
margin: 14px 0;
}
.memory-card {
aspect-ratio: 1;
background: #fff1f4;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
cursor: pointer;
border: 2px solid #ffd4df;
transition: transform 0.2s, background-color 0.2s;
user-select: none;
}
.memory-card.flipped {
background: #ffffff;
border-color: var(--primary);
transform: scale(0.96);
}
/* OYUN 3: Papatya Falı */
.daisy-container {
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
padding: 10px 0;
}
.daisy-center {
width: 70px;
height: 70px;
background: #ffd166;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.6rem;
box-shadow: 0 4px 10px rgba(255, 209, 102, 0.4);
}
.petal-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
max-width: 260px;
}
.petal {
background: #fff;
border: 1.5px solid #ffccd7;
padding: 8px 12px;
border-radius: 20px;
font-size: 0.8rem;
font-weight: 600;
cursor: pointer;
color: var(--text);
transition: 0.2s;
}
.petal.plucked {
opacity: 0;
pointer-events: none;
transform: translateY(15px) scale(0.6);
}
/* OYUN 4: XOX */
.tictac-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
max-width: 220px;
margin: 14px auto;
}
.tictac-cell {
aspect-ratio: 1;
background: #fff3f6;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.7rem;
font-weight: bold;
cursor: pointer;
border: 1.5px solid #ffccd7;
}
/* NEFES EGZERSİZİ */
.breath-box {
display: flex;
flex-direction: column;
align-items: center;
padding: 10px 0;
}
.breath-circle {
width: 120px;
height: 120px;
border-radius: 50%;
background: linear-gradient(135deg, #ffccd7, #ffd8c4);
display: flex;
align-items: center;
justify-content: center;
font-size: 0.9rem;
font-weight: 700;
color: #703347;
margin: 15px 0;
transition: transform 4s ease-in-out;
box-shadow: 0 6px 20px rgba(242, 106, 141, 0.25);
}
.breath-circle.expand {
transform: scale(1.6);
}
/* FOOTER */
footer {
text-align: center;
font-size: 0.85rem;
color: var(--text-muted);
line-height: 1.6;
padding: 10px 14px;
}
footer strong {
color: var(--primary);
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(6px); }
to { opacity: 1; transform: translateY(0); }
}
</style>
</head>
<body>
<div class="container">
<!-- Üst Bar -->
<div class="top-badge">
<span>♡ Sana özel bir köşe</span>
<span>Bugün de ışıl ışılsın ✨</span>
</div>
<!-- Başlık / Karşılama -->
<header>
<div class="heart-icon">💖</div>
<div class="subtitle">Biraz neşe · biraz huzur · bolca sevgi</div>
<h1>Ervasu'ya<br>Küçük Bir Dünya</h1>
<p class="lead">Burası dünyanın telaşına kısa bir mola vermen, gülümsemen ve kendini harika hissetmen için hazırlandı.</p>
</header>
<!-- Hızlı Sevgi / Sarılma Butonu -->
<button class="btn" onclick="sendHug()" style="padding: 16px; font-size: 1.05rem;">
🤗 Kocaman Sımsıkı Sarıl! (Dokun)
</button>
<!-- Bugün Neye İhtiyacın Var? -->
<section class="card">
<h2>🌸 Bugün neye ihtiyacın var?</h2>
<p class="desc">İçinden geleni seç, burada yanlış seçim yok.</p>
<div class="mood-grid">
<button class="mood-btn" onclick="showMood('dinlen')">
<span>☕</span> Dinlenmeye
</button>
<button class="mood-btn" onclick="showMood('gulumse')">
<span>🥰</span> Gülümsemeye
</button>
<button class="mood-btn" onclick="showMood('guclen')">
<span>💪</span> Güç Toplamaya
</button>
<button class="mood-btn" onclick="showMood('saril')">
<span>🧸</span> Şefkate
</button>
</div>
<div id="moodMessage" class="mood-message"></div>
</section>
<!-- Motivasyon / Şans Kurabiyesi -->
<section class="card">
<h2>🥠 Günün Motivasyon Kurabiyesi</h2>
<p class="desc">Kurabiyeye dokun, içindeki tatlı mesajı ve enerjiyi al.</p>
<div class="cookie-box">
<div class="cookie-icon" onclick="breakCookie()">🥠</div>
<div class="fortune-result" id="cookieResult">Dokun ve kurabiyeni kır! ✨</div>
</div>
</section>
<!-- EĞLENCE & OYUN DÜNYASI -->
<section class="card">
<h2>🎮 Minik Neşe Oyunları</h2>
<p class="desc">Canın hangisini isterse ona geç. Hepsi telefon için hazırlandı.</p>
<!-- Oyun Sekmeleri -->
<div class="game-tabs">
<button class="tab-btn active" onclick="switchGame('catcher')">🎈 Kalp Avı</button>
<button class="tab-btn" onclick="switchGame('memory')">🃏 Hafıza</button>
<button class="tab-btn" onclick="switchGame('daisy')">🌼 Papatya</button>
<button class="tab-btn" onclick="switchGame('xox')">⭐ XOX</button>
</div>
<!-- OYUN 1: KALP YAKALAMA -->
<div id="game-catcher" class="game-screen active">
<div style="display:flex; justify-content:space-between; font-weight:600; font-size:0.85rem; margin-bottom:6px;">
<span>Skor: <b id="catcherScore" style="color:var(--primary);">0</b></span>
<span>Süre: <b id="catcherTime">20</b>s</span>
</div>
<div class="catcher-area" id="catcherArea">
<p id="catcherStartText" style="position:absolute; top:42%; width:100%; font-size:0.88rem; color:var(--text-muted);">
Aşağıdaki butona bas ve yakalamaya başla!
</p>
</div>
<button class="btn" id="startCatcherBtn" onclick="startCatcherGame()">Oyunu Başlat 🎯</button>
</div>
<!-- OYUN 2: HAFIZA KARTLARI -->
<div id="game-memory" class="game-screen">
<div style="font-size:0.85rem; color:var(--text-muted); margin-bottom:8px;">İki eşleşen simgeyi bul:</div>
<div class="memory-grid" id="memoryGrid"></div>
<button class="btn btn-secondary" onclick="initMemoryGame()">Yeniden Karıştır 🔄</button>
</div>
<!-- OYUN 3: PAPATYA FALI -->
<div id="game-daisy" class="game-screen">
<div class="daisy-container">
<div class="daisy-center">🌼</div>
<p id="daisyStatus" style="font-size:0.9rem; font-weight:600; color:var(--primary);">Yapraklara tek tek dokun...</p>
<div class="petal-list" id="petalList"></div>
</div>
</div>
<!-- OYUN 4: XOX -->
<div id="game-xox" class="game-screen">
<div id="xoxStatus" style="font-size:0.88rem; font-weight:600; margin-bottom:8px; color:var(--primary);">Sen: 💖 | Sıra sende!</div>
<div class="tictac-grid" id="tictacGrid"></div>
<button class="btn btn-secondary" onclick="resetXOX()">Temizle ve Yeniden Oyna 🔄</button>
</div>
</section>
<!-- DERİN NEFES ALMA (STRES GİDERİCİ) -->
<section class="card">
<h2>🌿 Sakinleşme & Derin Nefes</h2>
<p class="desc">Gözlerini 1 dakika rahatlat. Balon genişledikçe nefes al, küçüldükçe yavaşça bırak.</p>
<div class="breath-box">
<div class="breath-circle" id="breathCircle">Hazır mısın?</div>
<button class="btn btn-secondary" id="breathBtn" onclick="toggleBreathing()">Nefes Egzersizini Başlat 🍃</button>
</div>
</section>
<!-- GÜNÜN HATIRLATMASI -->
<section class="card" style="background: linear-gradient(135deg, #fff2f5, #fff8f4);">
<h2>🤍 Günün Hatırlatması</h2>
<p style="font-size: 0.95rem; line-height: 1.55; color: #5c3f47; margin-top: 8px;">
"Her şeyi bugün çözmek zorunda değilsin. Bazen durup nefes almak da en büyük adımdır. Ne kadar değerli, özel ve güzel olduğunu sakın unutma."
</p>
</section>
<!-- FOOTER -->
<footer>
Bu küçük dünya Ervasu'ya şunu hatırlatmak için var:<br>
<strong>Senin dinlenmeye, kahkaha atmaya ve şımartılmaya her zaman hakkın var. ♡</strong><br>
Her an seninle.
</footer>
</div>
<script>
/* 1. SANAL SARILMA */
function sendHug() {
confetti({
particleCount: 70,
spread: 60,
origin: { y: 0.8 },
colors: ['#f26a8d', '#ffb3c6', '#ffe3e8', '#ffd166']
});
const messages = [
"Sımsıkı sarıldım! İçin sıcacık olsun ♡",
"Kocaman bir sarılma gönderildi! Asla yalnız değilsin.",
"Dünyanın en tatlı sarılması şu an seninle ✨",
"Bugün harika bir gün olacak, unutma!"
];
alert(messages[Math.floor(Math.random() * messages.length)]);
}
/* 2. MOD SEÇİMİ */
const moodTexts = {
dinlen: "Omuzlarını serbest bırak, derin bir nefes al. Bugün dünyayı kurtarmak zorunda değilsin. Biraz dinlenmek senin en doğal hakkın. ☕🤍",
gulumse: "Şu an aynaya bakacak olsan dünyanın en güzel gülüşünü görürsün. Gülümsemek sana inanılmaz yakışıyor! 🥰✨",
guclen: "Bugüne kadar nelerin üstesinden geldiğini hatırla. İçindeki güç sandığından çok daha büyük, sen başarırsın! 💪🌸",
saril: "Kollarımı açtım ve sana kocaman sarılıyorum. Ne olursa olsun arkanda seni çok seven ve destekleyen biri var. 🧸💖"
};
function showMood(type) {
const msgBox = document.getElementById('moodMessage');
msgBox.innerHTML = moodTexts[type];
msgBox.style.display = 'block';
}
/* 3. MOTİVASYON KURABİYESİ */
const fortunes = [
"Bugün karşına çıkacak her şeyde bir güzellik bulacaksın. ✨",
"Gülüşün birinin gününü aydınlatacak kadar değerli! 🌸",
"Kendine haksızlık etme; harika bir iş çıkarıyorsun. 💖",
"Beklediğin o güzel haber yakında seni bulacak. 💌",
"Sen başkalarına değil, kendi kalbine iyi geldiğin sürece çok güçlüsün. 🌷",
"Bugün canın ne istiyorsa kendine onu hediye etmeyi unutma! 🍰"
];
function breakCookie() {
confetti({ particleCount: 30, spread: 40 });
const randomIndex = Math.floor(Math.random() * fortunes.length);
document.getElementById('cookieResult').innerText = fortunes[randomIndex];
}
/* 4. OYUN SEKMELERİ */
function switchGame(tabName) {
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
document.querySelectorAll('.game-screen').forEach(scr => scr.classList.remove('active'));
event.target.classList.add('active');
document.getElementById('game-' + tabName).classList.add('active');
}
/* OYUN 1: KALP AVCISI */
let catcherInterval, timerInterval, catcherScore = 0, catcherTime = 20, isPlaying = false;
function startCatcherGame() {
if(isPlaying) return;
isPlaying = true;
catcherScore = 0;
catcherTime = 20;
document.getElementById('catcherScore').innerText = catcherScore;
document.getElementById('catcherTime').innerText = catcherTime;
document.getElementById('catcherStartText').style.display = 'none';
document.getElementById('startCatcherBtn').disabled = true;
const area = document.getElementById('catcherArea');
area.querySelectorAll('.falling-heart').forEach(h => h.remove());
catcherInterval = setInterval(() => {
spawnHeart();
}, 700);
timerInterval = setInterval(() => {
catcherTime--;
document.getElementById('catcherTime').innerText = catcherTime;
if(catcherTime <= 0) {
endCatcherGame();
}
}, 1000);
}
function spawnHeart() {
const area = document.getElementById('catcherArea');
const heart = document.createElement('div');
heart.className = 'falling-heart';
const emojis = ['💖', '✨', '🌸', '🍓', '⭐'];
heart.innerText = emojis[Math.floor(Math.random() * emojis.length)];
const x = Math.random() * (area.clientWidth - 40);
const y = Math.random() * (area.clientHeight - 40);
heart.style.left = `${x}px`;
heart.style.top = `${y}px`;
heart.onclick = () => {
catcherScore++;
document.getElementById('catcherScore').innerText = catcherScore;
heart.remove();
};
area.appendChild(heart);
setTimeout(() => {
if(heart.parentElement) heart.remove();
}, 1400);
}
function endCatcherGame() {
clearInterval(catcherInterval);
clearInterval(timerInterval);
isPlaying = false;
document.getElementById('startCatcherBtn').disabled = false;
confetti({ particleCount: 50 });
alert(`Süre doldu! Ervasu tam ${catcherScore} sevgi puanı topladı! 🏆💕`);
}
/* OYUN 2: HAFIZA KARTLARI */
const icons = ['🐱', '🌸', '🍓', '🌙', '🧁', '💖'];
let cards = [...icons, ...icons];
let flippedCards = [];
let matchedPairs = 0;
function initMemoryGame() {
const grid = document.getElementById('memoryGrid');
grid.innerHTML = '';
flippedCards = [];
matchedPairs = 0;
cards.sort(() => 0.5 - Math.random());
cards.forEach((icon, index) => {
const card = document.createElement('div');
card.className = 'memory-card';
card.dataset.icon = icon;
card.dataset.index = index;
card.innerText = '❓';
card.onclick = () => flipCard(card);
grid.appendChild(card);
});
}
function flipCard(card) {
if (flippedCards.length === 2 || card.classList.contains('flipped')) return;
card.innerText = card.dataset.icon;
card.classList.add('flipped');
flippedCards.push(card);
if (flippedCards.length === 2) {
if (flippedCards[0].dataset.icon === flippedCards[1].dataset.icon) {
flippedCards = [];
matchedPairs++;
if (matchedPairs === icons.length) {
setTimeout(() => {
confetti({ particleCount: 80 });
alert("Harikasın! Bütün kartları eşleştirdin! 🎉✨");
}, 300);
}
} else {
setTimeout(() => {
flippedCards.forEach(c => {
c.innerText = '❓';
c.classList.remove('flipped');
});
flippedCards = [];
}, 800);
}
}
}
/* OYUN 3: PAPATYA FALI */
const petalTexts = [
"Seviyor ♡", "Çok Seviyor ♡", "Gözünün içine bakıyor ♡",
"Dünyalar kadar seviyor ♡", "Hep aklındasın ♡", "Canından çok seviyor ♡"
];
function initDaisy() {
const list = document.getElementById('petalList');
list.innerHTML = '';
document.getElementById('daisyStatus').innerText = "Yapraklara dokun...";
petalTexts.forEach((text, i) => {
const petal = document.createElement('div');
petal.className = 'petal';
petal.innerText = `Yaprak ${i+1}`;
petal.onclick = () => {
petal.classList.add('plucked');
document.getElementById('daisyStatus').innerText = text;
if(document.querySelectorAll('.petal:not(.plucked)').length === 0) {
confetti({ particleCount: 60 });
document.getElementById('daisyStatus').innerText = "Sonuç belli: Dünyadaki her şeyden çok seviyor! 💖";
}
};
list.appendChild(petal);
});
}
/* OYUN 4: XOX */
let xoxBoard = Array(9).fill(null);
let xoxActive = true;
function renderXOX() {
const grid = document.getElementById('tictacGrid');
grid.innerHTML = '';
xoxBoard.forEach((val, idx) => {
const cell = document.createElement('div');
cell.className = 'tictac-cell';
cell.innerText = val ? val : '';
cell.onclick = () => userMove(idx);
grid.appendChild(cell);
});
}
function userMove(i) {
if(!xoxActive || xoxBoard[i]) return;
xoxBoard[i] = '💖';
renderXOX();
if(checkWinner('💖')) {
document.getElementById('xoxStatus').innerText = "Tebrikler! Sen kazandın! 🎉";
confetti();
xoxActive = false;
return;
}
if(xoxBoard.every(x => x !== null)) {
document.getElementById('xoxStatus').innerText = "Dostluk kazandı! 💕";
xoxActive = false;
return;
}
setTimeout(botMove, 400);
}
function botMove() {
if(!xoxActive) return;
const empties = xoxBoard.map((v, i) => v === null ? i : null).filter(v => v !== null);
if(empties.length > 0) {
const choice = empties[Math.floor(Math.random() * empties.length)];
xoxBoard[choice] = '⭐';
renderXOX();
if(checkWinner('⭐')) {
document.getElementById('xoxStatus').innerText = "Yıldız kazandı ama kalbimizin şampiyonu sensin! ✨";
xoxActive = false;
}
}
}
function checkWinner(mark) {
const wins = [
[0,1,2],[3,4,5],[6,7,8],
[0,3,6],[1,4,7],[2,5,8],
[0,4,8],[2,4,6]
];
return wins.some(([a,b,c]) => xoxBoard[a]===mark && xoxBoard[b]===mark && xoxBoard[c]===mark);
}
function resetXOX() {
xoxBoard = Array(9).fill(null);
xoxActive = true;
document.getElementById('xoxStatus').innerText = "Sen: 💖 | Sıra sende!";
renderXOX();
}
/* NEFES ALMA */
let breathing = false;
let breathInterval;
function toggleBreathing() {
const circle = document.getElementById('breathCircle');
const btn = document.getElementById('breathBtn');
if(!breathing) {
breathing = true;
btn.innerText = "Durdur ⏹";
runBreathCycle(circle);
breathInterval = setInterval(() => runBreathCycle(circle), 8000);
} else {
breathing = false;
btn.innerText = "Nefes Egzersizini Başlat 🍃";
clearInterval(breathInterval);
circle.classList.remove('expand');
circle.innerText = "Hazır mısın?";
}
}
function runBreathCycle(circle) {
circle.innerText = "Nefes Al... 🌬️";
circle.classList.add('expand');
setTimeout(() => {
if(breathing) {
circle.innerText = "Yavaşça Bırak... 🌸";
circle.classList.remove('expand');
}
}, 4000);
}
// Başlangıç Kurulumları
initMemoryGame();
initDaisy();
renderXOX();
</script>
</body>
</html>