Files
edh-stats/frontend/public/index.html

83 lines
2.4 KiB
HTML

<!doctype html>
<html lang="en" class="h-full bg-gray-50">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>EDH Stats Tracker</title>
<meta
name="description"
content="Track your Magic: The Gathering EDH/Commander games and statistics"
/>
<link rel="stylesheet" href="/css/styles.css" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
</head>
<body
class="h-full flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8"
>
<div class="max-w-md w-full space-y-8 text-center" x-data="indexApp()">
<h1 class="text-4xl font-bold font-mtg text-edh-primary mb-4">
EDH Stats
</h1>
<p class="text-xl text-gray-600 mb-8">
Track your Commander games and statistics
</p>
<div class="space-y-4">
<a href="/login.html" class="btn btn-primary w-full">
🎮 Login to Track Games
</a>
<a
x-show="allowRegistration"
href="/register.html"
class="btn btn-secondary w-full"
>
📝 Create New Account
</a>
</div>
<div class="text-sm text-gray-500">
<p>Built with Fastify, SQLite, and Alpine.js</p>
<p>Ready to track your Commander victories!</p>
</div>
</div>
<script src="https://cdn.tailwindcss.com"></script>
<script
defer
src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"
></script>
<script>
function indexApp() {
return {
allowRegistration: true,
async init() {
await this.checkRegistrationConfig()
},
async checkRegistrationConfig() {
try {
const response = await fetch('/api/auth/config')
if (response.ok) {
const data = await response.json()
this.allowRegistration = data.allowRegistration
} else {
// Default to true if endpoint fails
this.allowRegistration = true
}
} catch (error) {
console.error('Failed to check registration config:', error)
// Default to true if request fails
this.allowRegistration = true
}
}
}
}
document.addEventListener('alpine:init', () => {
Alpine.data('indexApp', indexApp)
})
</script>
</body>
</html>