46 lines
No EOL
1.5 KiB
HTML
46 lines
No EOL
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>FumbleUpon</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="logo">FumbleUpon</div>
|
|
<div class="header-buttons">
|
|
<button id="darkModeToggle">🌙</button>
|
|
<button id="fumbleButton">Fumble!</button>
|
|
</div>
|
|
</header>
|
|
<main>
|
|
<iframe id="contentFrame" src="about:blank" title="Content"></iframe>
|
|
</main>
|
|
|
|
<script>
|
|
document.getElementById('fumbleButton').addEventListener('click', async () => {
|
|
const frame = document.getElementById('contentFrame');
|
|
// Open wiby.me/surprise directly in the iframe
|
|
frame.src = 'https://wiby.me/surprise/';
|
|
});
|
|
|
|
// Dark mode toggle
|
|
const darkModeToggle = document.getElementById('darkModeToggle');
|
|
const body = document.body;
|
|
|
|
// Check for saved preference
|
|
if (localStorage.getItem('darkMode') === 'true') {
|
|
body.classList.add('dark-mode');
|
|
darkModeToggle.textContent = '☀️';
|
|
}
|
|
|
|
darkModeToggle.addEventListener('click', () => {
|
|
body.classList.toggle('dark-mode');
|
|
const isDark = body.classList.contains('dark-mode');
|
|
darkModeToggle.textContent = isDark ? '☀️' : '🌙';
|
|
localStorage.setItem('darkMode', isDark);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |