|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Tab Cookie Garden</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@keyframes pulse { |
|
|
0% { transform: scale(1); } |
|
|
50% { transform: scale(1.1); } |
|
|
100% { transform: scale(1); } |
|
|
} |
|
|
|
|
|
@keyframes spin { |
|
|
0% { transform: rotate(0deg); } |
|
|
100% { transform: rotate(360deg); } |
|
|
} |
|
|
|
|
|
.cookie-pulse { |
|
|
animation: pulse 2s infinite; |
|
|
} |
|
|
|
|
|
.flower-grow { |
|
|
transition: all 0.5s ease-out; |
|
|
} |
|
|
|
|
|
.slot-spin { |
|
|
animation: spin 0.5s ease-out; |
|
|
} |
|
|
|
|
|
.sidebar { |
|
|
transition: transform 0.3s ease-in-out; |
|
|
} |
|
|
|
|
|
.domain-news { |
|
|
background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%); |
|
|
} |
|
|
|
|
|
.domain-social { |
|
|
background: linear-gradient(135deg, #f472b6 0%, #ec4899 100%); |
|
|
} |
|
|
|
|
|
.domain-shopping { |
|
|
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); |
|
|
} |
|
|
|
|
|
.domain-entertainment { |
|
|
background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%); |
|
|
} |
|
|
|
|
|
.domain-other { |
|
|
background: linear-gradient(135deg, #34d399 0%, #10b981 100%); |
|
|
} |
|
|
|
|
|
.tooltip { |
|
|
visibility: hidden; |
|
|
opacity: 0; |
|
|
transition: opacity 0.3s; |
|
|
} |
|
|
|
|
|
.cookie-container:hover .tooltip { |
|
|
visibility: visible; |
|
|
opacity: 1; |
|
|
} |
|
|
|
|
|
@media (max-width: 768px) { |
|
|
.sidebar { |
|
|
width: 100%; |
|
|
height: auto; |
|
|
bottom: 0; |
|
|
left: 0; |
|
|
transform: translateY(100%); |
|
|
} |
|
|
|
|
|
.sidebar.open { |
|
|
transform: translateY(0); |
|
|
} |
|
|
|
|
|
.cookie-bar { |
|
|
flex-direction: column; |
|
|
align-items: flex-start; |
|
|
padding: 0.5rem; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-100 font-sans"> |
|
|
|
|
|
<div class="max-w-6xl mx-auto p-4"> |
|
|
<div class="bg-white rounded-lg shadow-lg overflow-hidden"> |
|
|
|
|
|
<div class="bg-gray-800 text-white p-3 flex items-center justify-between"> |
|
|
<div class="flex items-center space-x-2"> |
|
|
<button class="p-1 rounded hover:bg-gray-700"> |
|
|
<i class="fas fa-arrow-left"></i> |
|
|
</button> |
|
|
<button class="p-1 rounded hover:bg-gray-700"> |
|
|
<i class="fas fa-arrow-right"></i> |
|
|
</button> |
|
|
<button class="p-1 rounded hover:bg-gray-700"> |
|
|
<i class="fas fa-redo"></i> |
|
|
</button> |
|
|
</div> |
|
|
<div class="flex-1 mx-4"> |
|
|
<input type="text" class="w-full bg-gray-700 rounded-full py-1 px-4 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Search or enter address"> |
|
|
</div> |
|
|
<div class="flex items-center space-x-2"> |
|
|
<button class="p-1 rounded hover:bg-gray-700"> |
|
|
<i class="fas fa-star"></i> |
|
|
</button> |
|
|
<button class="p-1 rounded hover:bg-gray-700"> |
|
|
<i class="fas fa-ellipsis-h"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-gray-100 border-b flex items-center justify-between px-4 py-2 cookie-bar"> |
|
|
<div class="flex items-center space-x-2 overflow-x-auto py-2"> |
|
|
|
|
|
</div> |
|
|
<button id="toggleSidebar" class="bg-blue-500 hover:bg-blue-600 text-white px-3 py-1 rounded-full text-sm flex items-center"> |
|
|
<i class="fas fa-gamepad mr-1"></i> Play |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="h-96 bg-white flex items-center justify-center"> |
|
|
<div class="text-center p-8"> |
|
|
<h1 class="text-3xl font-bold text-gray-800 mb-4">Welcome to Tab Cookie Garden</h1> |
|
|
<p class="text-gray-600 mb-6">Open new tabs to grow cookies that blossom into flowers!</p> |
|
|
<button id="simulateNewTab" class="bg-green-500 hover:bg-green-600 text-white font-medium py-2 px-6 rounded-full"> |
|
|
Simulate New Tab |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="sidebar" class="sidebar fixed top-0 right-0 h-full w-80 bg-white shadow-lg z-10 transform translate-x-full"> |
|
|
<div class="p-4 border-b flex justify-between items-center"> |
|
|
<h2 class="text-xl font-bold">Cookie Slots</h2> |
|
|
<button id="closeSidebar" class="text-gray-500 hover:text-gray-700"> |
|
|
<i class="fas fa-times"></i> |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="p-4"> |
|
|
<div class="bg-gray-100 rounded-lg p-4 mb-4"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="font-medium">Cookie Coins:</span> |
|
|
<span id="coinCount" class="font-bold text-blue-600">0</span> |
|
|
</div> |
|
|
<div class="flex justify-between items-center"> |
|
|
<span class="font-medium">Flowers Grown:</span> |
|
|
<span id="flowerCount" class="font-bold text-green-600">0</span> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-lg font-semibold mb-2">Slot Machine</h3> |
|
|
<div class="bg-gray-800 rounded-lg p-4"> |
|
|
<div class="flex justify-between mb-4"> |
|
|
<div id="slot1" class="slot w-16 h-16 bg-white rounded flex items-center justify-center text-3xl font-bold"> |
|
|
🍪 |
|
|
</div> |
|
|
<div id="slot2" class="slot w-16 h-16 bg-white rounded flex items-center justify-center text-3xl font-bold"> |
|
|
🌸 |
|
|
</div> |
|
|
<div id="slot3" class="slot w-16 h-16 bg-white rounded flex items-center justify-center text-3xl font-bold"> |
|
|
🎰 |
|
|
</div> |
|
|
</div> |
|
|
<button id="spinButton" class="w-full bg-yellow-500 hover:bg-yellow-600 text-white font-bold py-2 px-4 rounded"> |
|
|
Spin (Cost: 5 coins) |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-lg font-semibold mb-2">Global Garden</h3> |
|
|
<div class="grid grid-cols-3 gap-2" id="globalGarden"> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
|
|
|
const state = { |
|
|
cookies: [], |
|
|
coins: 0, |
|
|
flowers: 0, |
|
|
globalFlowers: [], |
|
|
slotItems: ['🍪', '🌸', '🌿', '🌻', '🌼', '🌺', '🌹', '🌷', '💐', '🎰'], |
|
|
domainCategories: { |
|
|
news: ['cnn.com', 'bbc.com', 'nytimes.com', 'theguardian.com'], |
|
|
social: ['facebook.com', 'twitter.com', 'instagram.com', 'reddit.com'], |
|
|
shopping: ['amazon.com', 'ebay.com', 'etsy.com', 'walmart.com'], |
|
|
entertainment: ['youtube.com', 'netflix.com', 'spotify.com', 'twitch.tv'], |
|
|
other: ['wikipedia.org', 'github.com', 'stackoverflow.com', 'medium.com'] |
|
|
}, |
|
|
activeUsers: {} |
|
|
}; |
|
|
|
|
|
|
|
|
const cookieBar = document.querySelector('.cookie-bar > div'); |
|
|
const sidebar = document.getElementById('sidebar'); |
|
|
const toggleSidebarBtn = document.getElementById('toggleSidebar'); |
|
|
const closeSidebarBtn = document.getElementById('closeSidebar'); |
|
|
const simulateNewTabBtn = document.getElementById('simulateNewTab'); |
|
|
const coinCountEl = document.getElementById('coinCount'); |
|
|
const flowerCountEl = document.getElementById('flowerCount'); |
|
|
const spinButton = document.getElementById('spinButton'); |
|
|
const slot1 = document.getElementById('slot1'); |
|
|
const slot2 = document.getElementById('slot2'); |
|
|
const slot3 = document.getElementById('slot3'); |
|
|
const globalGarden = document.getElementById('globalGarden'); |
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', () => { |
|
|
|
|
|
const savedState = localStorage.getItem('tabCookieGame'); |
|
|
if (savedState) { |
|
|
Object.assign(state, JSON.parse(savedState)); |
|
|
updateUI(); |
|
|
renderGlobalGarden(); |
|
|
} |
|
|
|
|
|
|
|
|
if (state.globalFlowers.length === 0) { |
|
|
state.globalFlowers = [ |
|
|
{ domain: 'news', type: '🌻', clicks: 42 }, |
|
|
{ domain: 'social', type: '🌺', clicks: 78 }, |
|
|
{ domain: 'shopping', type: '🌹', clicks: 35 }, |
|
|
{ domain: 'entertainment', type: '🌸', clicks: 120 } |
|
|
]; |
|
|
renderGlobalGarden(); |
|
|
} |
|
|
|
|
|
|
|
|
simulateActiveUsers(); |
|
|
}); |
|
|
|
|
|
|
|
|
toggleSidebarBtn.addEventListener('click', () => { |
|
|
sidebar.classList.toggle('translate-x-full'); |
|
|
sidebar.classList.toggle('translate-x-0'); |
|
|
}); |
|
|
|
|
|
closeSidebarBtn.addEventListener('click', () => { |
|
|
sidebar.classList.add('translate-x-full'); |
|
|
sidebar.classList.remove('translate-x-0'); |
|
|
}); |
|
|
|
|
|
|
|
|
simulateNewTabBtn.addEventListener('click', () => { |
|
|
const domains = [ |
|
|
'cnn.com', 'facebook.com', 'amazon.com', 'youtube.com', |
|
|
'wikipedia.org', 'twitter.com', 'nytimes.com', 'github.com', |
|
|
'reddit.com', 'netflix.com', 'bbc.com', 'stackoverflow.com' |
|
|
]; |
|
|
const randomDomain = domains[Math.floor(Math.random() * domains.length)]; |
|
|
createCookie(randomDomain); |
|
|
}); |
|
|
|
|
|
|
|
|
spinButton.addEventListener('click', () => { |
|
|
if (state.coins < 5) { |
|
|
alert("You need at least 5 coins to spin!"); |
|
|
return; |
|
|
} |
|
|
|
|
|
state.coins -= 5; |
|
|
updateUI(); |
|
|
|
|
|
|
|
|
spinButton.disabled = true; |
|
|
spinButton.classList.add('opacity-50'); |
|
|
|
|
|
|
|
|
const spins = 10 + Math.floor(Math.random() * 10); |
|
|
let spinCount = 0; |
|
|
|
|
|
const spinInterval = setInterval(() => { |
|
|
slot1.textContent = getRandomSlotItem(); |
|
|
slot2.textContent = getRandomSlotItem(); |
|
|
slot3.textContent = getRandomSlotItem(); |
|
|
|
|
|
spinCount++; |
|
|
if (spinCount >= spins) { |
|
|
clearInterval(spinInterval); |
|
|
finishSpin(); |
|
|
} |
|
|
}, 100); |
|
|
}); |
|
|
|
|
|
function finishSpin() { |
|
|
|
|
|
const val1 = getRandomSlotItem(); |
|
|
const val2 = getRandomSlotItem(); |
|
|
const val3 = getRandomSlotItem(); |
|
|
|
|
|
slot1.textContent = val1; |
|
|
slot2.textContent = val2; |
|
|
slot3.textContent = val3; |
|
|
|
|
|
|
|
|
slot1.classList.add('slot-spin'); |
|
|
slot2.classList.add('slot-spin'); |
|
|
slot3.classList.add('slot-spin'); |
|
|
|
|
|
setTimeout(() => { |
|
|
slot1.classList.remove('slot-spin'); |
|
|
slot2.classList.remove('slot-spin'); |
|
|
slot3.classList.remove('slot-spin'); |
|
|
|
|
|
|
|
|
if (val1 === val2 && val2 === val3) { |
|
|
|
|
|
const winAmount = val1 === '🎰' ? 50 : 20; |
|
|
state.coins += winAmount; |
|
|
alert(`JACKPOT! You won ${winAmount} coins!`); |
|
|
} else if (val1 === val2 || val2 === val3 || val1 === val3) { |
|
|
|
|
|
state.coins += 5; |
|
|
alert("You won 5 coins!"); |
|
|
} |
|
|
|
|
|
updateUI(); |
|
|
spinButton.disabled = false; |
|
|
spinButton.classList.remove('opacity-50'); |
|
|
saveGame(); |
|
|
}, 500); |
|
|
} |
|
|
|
|
|
function getRandomSlotItem() { |
|
|
return state.slotItems[Math.floor(Math.random() * state.slotItems.length)]; |
|
|
} |
|
|
|
|
|
function createCookie(domain) { |
|
|
|
|
|
let category = 'other'; |
|
|
for (const [cat, domains] of Object.entries(state.domainCategories)) { |
|
|
if (domains.some(d => domain.includes(d))) { |
|
|
category = cat; |
|
|
break; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
const existingCookie = state.cookies.find(c => c.domain === domain); |
|
|
if (existingCookie) { |
|
|
existingCookie.clicks++; |
|
|
animateCookie(existingCookie.id); |
|
|
return; |
|
|
} |
|
|
|
|
|
|
|
|
const cookieId = 'cookie-' + Date.now(); |
|
|
const newCookie = { |
|
|
id: cookieId, |
|
|
domain, |
|
|
category, |
|
|
clicks: 1, |
|
|
growth: 0, |
|
|
type: null, |
|
|
activeUsers: Math.floor(Math.random() * 100) + 1 |
|
|
}; |
|
|
|
|
|
state.cookies.push(newCookie); |
|
|
state.activeUsers[domain] = newCookie.activeUsers; |
|
|
|
|
|
|
|
|
renderCookie(newCookie); |
|
|
|
|
|
|
|
|
startCookieGrowth(newCookie); |
|
|
|
|
|
|
|
|
saveGame(); |
|
|
} |
|
|
|
|
|
function renderCookie(cookie) { |
|
|
const cookieEl = document.createElement('div'); |
|
|
cookieEl.id = cookie.id; |
|
|
cookieEl.className = 'cookie-container relative'; |
|
|
|
|
|
const cookieIcon = document.createElement('div'); |
|
|
cookieIcon.className = 'w-10 h-10 rounded-full flex items-center justify-center text-white cursor-pointer shadow-md cookie-pulse'; |
|
|
cookieIcon.innerHTML = '<i class="fas fa-cookie-bite text-xl"></i>'; |
|
|
|
|
|
|
|
|
cookieIcon.classList.add(`domain-${cookie.category}`); |
|
|
|
|
|
|
|
|
const tooltip = document.createElement('div'); |
|
|
tooltip.className = 'tooltip absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 bg-gray-800 text-white text-xs rounded py-1 px-2 whitespace-nowrap z-20'; |
|
|
tooltip.innerHTML = ` |
|
|
<div class="font-bold">${cookie.domain}</div> |
|
|
<div>Visitors: ${cookie.activeUsers.toLocaleString()}</div> |
|
|
<div>Clicks: ${cookie.clicks}</div> |
|
|
`; |
|
|
|
|
|
|
|
|
const arrow = document.createElement('div'); |
|
|
arrow.className = 'absolute top-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-4 border-r-4 border-b-0 border-t-4 border-l-transparent border-r-transparent border-t-gray-800'; |
|
|
|
|
|
tooltip.appendChild(arrow); |
|
|
cookieEl.appendChild(cookieIcon); |
|
|
cookieEl.appendChild(tooltip); |
|
|
cookieBar.appendChild(cookieEl); |
|
|
|
|
|
|
|
|
cookieIcon.addEventListener('click', () => { |
|
|
handleCookieClick(cookie); |
|
|
}); |
|
|
} |
|
|
|
|
|
function handleCookieClick(cookie) { |
|
|
|
|
|
cookie.clicks++; |
|
|
|
|
|
|
|
|
state.coins++; |
|
|
updateUI(); |
|
|
|
|
|
|
|
|
animateCookie(cookie.id); |
|
|
|
|
|
|
|
|
const tooltip = document.querySelector(`#${cookie.id} .tooltip`); |
|
|
if (tooltip) { |
|
|
tooltip.innerHTML = ` |
|
|
<div class="font-bold">${cookie.domain}</div> |
|
|
<div>Visitors: ${cookie.activeUsers.toLocaleString()}</div> |
|
|
<div>Clicks: ${cookie.clicks}</div> |
|
|
`; |
|
|
tooltip.appendChild(document.createElement('div')).className = 'absolute top-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-4 border-r-4 border-b-0 border-t-4 border-l-transparent border-r-transparent border-t-gray-800'; |
|
|
} |
|
|
|
|
|
|
|
|
saveGame(); |
|
|
} |
|
|
|
|
|
function animateCookie(cookieId) { |
|
|
const cookieEl = document.getElementById(cookieId); |
|
|
if (!cookieEl) return; |
|
|
|
|
|
cookieEl.classList.add('animate-ping'); |
|
|
setTimeout(() => { |
|
|
cookieEl.classList.remove('animate-ping'); |
|
|
}, 1000); |
|
|
} |
|
|
|
|
|
function startCookieGrowth(cookie) { |
|
|
const growthInterval = setInterval(() => { |
|
|
cookie.growth += 5; |
|
|
|
|
|
|
|
|
if (cookie.growth >= 100) { |
|
|
clearInterval(growthInterval); |
|
|
cookieGrown(cookie); |
|
|
} |
|
|
}, 1000); |
|
|
} |
|
|
|
|
|
function cookieGrown(cookie) { |
|
|
|
|
|
const flowerTypes = { |
|
|
news: ['🌻', '📰', '🗞️'], |
|
|
social: ['🌺', '💬', '👥'], |
|
|
shopping: ['🌹', '🛍️', '💰'], |
|
|
entertainment: ['🌸', '🎬', '🎮'], |
|
|
other: ['🌼', '❓', '🔍'] |
|
|
}; |
|
|
|
|
|
|
|
|
const rarity = Math.min(Math.floor(cookie.clicks / 10), 2); |
|
|
cookie.type = flowerTypes[cookie.category][rarity]; |
|
|
|
|
|
|
|
|
state.flowers++; |
|
|
|
|
|
|
|
|
if (cookie.clicks >= 15) { |
|
|
state.globalFlowers.push({ |
|
|
domain: cookie.category, |
|
|
type: cookie.type, |
|
|
clicks: cookie.clicks |
|
|
}); |
|
|
renderGlobalGarden(); |
|
|
} |
|
|
|
|
|
|
|
|
const cookieEl = document.getElementById(cookie.id); |
|
|
if (cookieEl) { |
|
|
const cookieIcon = cookieEl.querySelector('div:first-child'); |
|
|
cookieIcon.innerHTML = `<span class="text-2xl">${cookie.type}</span>`; |
|
|
cookieIcon.classList.remove('cookie-pulse'); |
|
|
cookieIcon.classList.add('flower-grow'); |
|
|
|
|
|
|
|
|
const tooltip = cookieEl.querySelector('.tooltip'); |
|
|
if (tooltip) { |
|
|
tooltip.innerHTML = ` |
|
|
<div class="font-bold">${cookie.domain}</div> |
|
|
<div>Flower: ${cookie.type}</div> |
|
|
<div>Visitors: ${cookie.activeUsers.toLocaleString()}</div> |
|
|
<div>Clicks: ${cookie.clicks}</div> |
|
|
`; |
|
|
tooltip.appendChild(document.createElement('div')).className = 'absolute top-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-4 border-r-4 border-b-0 border-t-4 border-l-transparent border-r-transparent border-t-gray-800'; |
|
|
} |
|
|
} |
|
|
|
|
|
updateUI(); |
|
|
saveGame(); |
|
|
} |
|
|
|
|
|
function renderGlobalGarden() { |
|
|
globalGarden.innerHTML = ''; |
|
|
|
|
|
state.globalFlowers.forEach((flower, index) => { |
|
|
const flowerEl = document.createElement('div'); |
|
|
flowerEl.className = 'flex flex-col items-center p-2 bg-gray-100 rounded'; |
|
|
|
|
|
const flowerIcon = document.createElement('div'); |
|
|
flowerIcon.className = 'text-3xl mb-1'; |
|
|
flowerIcon.textContent = flower.type; |
|
|
|
|
|
const flowerText = document.createElement('div'); |
|
|
flowerText.className = 'text-xs text-center'; |
|
|
flowerText.textContent = `${flower.domain} (${flower.clicks})`; |
|
|
|
|
|
flowerEl.appendChild(flowerIcon); |
|
|
flowerEl.appendChild(flowerText); |
|
|
globalGarden.appendChild(flowerEl); |
|
|
}); |
|
|
} |
|
|
|
|
|
function updateUI() { |
|
|
coinCountEl.textContent = state.coins; |
|
|
flowerCountEl.textContent = state.flowers; |
|
|
|
|
|
|
|
|
spinButton.disabled = state.coins < 5; |
|
|
spinButton.classList.toggle('opacity-50', state.coins < 5); |
|
|
} |
|
|
|
|
|
function saveGame() { |
|
|
localStorage.setItem('tabCookieGame', JSON.stringify({ |
|
|
cookies: state.cookies, |
|
|
coins: state.coins, |
|
|
flowers: state.flowers, |
|
|
globalFlowers: state.globalFlowers |
|
|
})); |
|
|
} |
|
|
|
|
|
function simulateActiveUsers() { |
|
|
|
|
|
setInterval(() => { |
|
|
state.cookies.forEach(cookie => { |
|
|
const change = Math.floor(Math.random() * 10) - 3; |
|
|
cookie.activeUsers = Math.max(1, cookie.activeUsers + change); |
|
|
state.activeUsers[cookie.domain] = cookie.activeUsers; |
|
|
|
|
|
|
|
|
const tooltip = document.querySelector(`#${cookie.id} .tooltip`); |
|
|
if (tooltip) { |
|
|
tooltip.innerHTML = ` |
|
|
<div class="font-bold">${cookie.domain}</div> |
|
|
${cookie.type ? `<div>Flower: ${cookie.type}</div>` : ''} |
|
|
<div>Visitors: ${cookie.activeUsers.toLocaleString()}</div> |
|
|
<div>Clicks: ${cookie.clicks}</div> |
|
|
`; |
|
|
tooltip.appendChild(document.createElement('div')).className = 'absolute top-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-4 border-r-4 border-b-0 border-t-4 border-l-transparent border-r-transparent border-t-gray-800'; |
|
|
} |
|
|
}); |
|
|
}, 5000); |
|
|
} |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Juno360219/cookie-slot-browser-click" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
