2025-06-14 01:38:32 +02:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Playground - Feature Showcase< / title >
< link rel = "stylesheet" href = "styles.css" >
2025-06-14 04:09:18 +02:00
< script >
// Apply dark mode immediately to prevent flash
if (localStorage.getItem('theme') === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark');
}
< / script >
2025-06-14 01:38:32 +02:00
< / head >
< body >
2025-06-14 04:02:10 +02:00
< button class = "dark-mode-toggle" onclick = "toggleDarkMode()" > 🌙< / button >
2025-06-14 01:38:32 +02:00
< h1 > Playground - Feature Showcase< / h1 >
< p > Welcome to the development playground! Click on any feature below to test it:< / p >
< ul class = "feature-list" >
< li >
< a href = "random.html" > Random Number Generator< / a >
< div class = "description" > Displays a random number and allows you to generate new ones with a button click.< / div >
< / li >
< li >
< a href = "ajax.html" > AJAX Demo< / a >
< div class = "description" > Demonstrates asynchronous loading with immediate UI and delayed API response (1 second delay).< / div >
< / li >
< li >
< a href = "echo-test.html" > Echo Test< / a >
< div class = "description" > Text input form that sends data to the /echo API endpoint and displays the response.< / div >
< / li >
< li >
< a href = "items.html" > Items Management< / a >
< div class = "description" > Full CRUD demo with SQLite database - create, view, and delete items with persistent storage.< / div >
< / li >
2025-06-14 01:56:00 +02:00
< li >
< a href = "account.html" > Account Information< / a >
< div class = "description" > Authentication test page - displays user info and headers from Authelia (requires authentication).< / div >
< / li >
2025-06-14 03:29:29 +02:00
< li >
< a href = "mining.html" > Mining Resources< / a >
< div class = "description" > Background resource production demo - displays live-calculated mining values with automatic database updates every minute.< / div >
< / li >
2025-06-14 01:38:32 +02:00
< / ul >
2025-06-14 04:02:10 +02:00
< script src = "dark-mode.js" > < / script >
2025-06-14 01:38:32 +02:00
< / body >
< / html >
