zwitschi/linearvoid
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 9 Wiki Activity

Refactor frontend: Enhance chat UI and player initialization

Browse Source 
- Updated main.ts to streamline player and chat initialization, removing Alpine.js dependency.
- Improved message rendering with new CSS classes for better styling and layout.
- Added a function to simulate "now playing" titles at regular intervals.
- Revamped style.css with a new design system using CSS variables for better maintainability.
- Removed tailwind.config.js as Tailwind CSS is no longer used.
This commit is contained in:
zwitschi committed 2026-08-04 19:36:11 +02:00
1 parent 7cfddfc7ef
commit fca4286d87
10 files changed
+1831 -1525
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/admin/index.html
+295 -879
View File
File diff suppressed because it is too large. Load diff
frontend/admin/login/index.html
+19 -22
View File
@@ -5,30 +5,27 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Linear Void Admin Login</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="../../src/style.css" />
</head>
<body class="min-h-screen bg-slate-950 text-slate-100 flex items-center justify-center px-6">
<main class="w-full max-w-md bg-slate-900 border border-slate-800 rounded-[2rem] shadow-2xl p-8">
<div class="mb-8">
<div class="text-xs uppercase tracking-[0.3em] text-slate-500 mb-3">Linear Void</div>
<h1 class="text-4xl font-semibold text-white mb-2">Admin Login</h1>
<p class="text-sm text-slate-400">Authenticate to access protected admin controls.</p>
</div>
<body class="auth-body">
<main class="auth-shell" aria-label="Admin authentication">
<section class="auth-card" aria-labelledby="auth-title">
<p class="auth-kicker">Linear Void</p>
<h1 id="auth-title">Admin Login</h1>
<p class="auth-subtitle">Authenticate to access protected admin controls.</p>
<form id="login-form" class="space-y-4">
<label class="block text-sm">
<span class="block text-slate-400 mb-2">Username</span>
<input id="username" type="text" class="w-full bg-slate-950 border border-slate-700 rounded-xl px-4 py-3 focus:outline-none focus:border-blue-500" autocomplete="username" required />
</label>
<label class="block text-sm">
<span class="block text-slate-400 mb-2">Password</span>
<input id="password" type="password" class="w-full bg-slate-950 border border-slate-700 rounded-xl px-4 py-3 focus:outline-none focus:border-blue-500" autocomplete="current-password" required />
</label>
<button id="submit" type="submit" class="w-full bg-blue-600 hover:bg-blue-500 px-4 py-3 rounded-xl font-medium text-white">Sign in</button>
<div id="status" class="text-sm text-slate-400 min-h-6"></div>
</form>
<form id="login-form" class="form-stack" novalidate>
<label for="username">Username</label>
<input id="username" type="text" class="text-input" autocomplete="username" required />
<label for="password">Password</label>
<input id="password" type="password" class="text-input" autocomplete="current-password" required />
<button id="submit" type="submit" class="btn btn-primary btn-block">Sign in</button>
<p id="status" class="status-line" aria-live="polite"></p>
</form>
</section>
</main>
<script>
@@ -42,7 +39,7 @@
event.preventDefault();
submit.disabled = true;
status.textContent = 'Signing in...';
status.className = 'text-sm text-slate-400 min-h-6';
status.className = 'status-line';
try {
const response = await fetch('/api/admin/login', {
@@ -59,7 +56,7 @@
} catch (error) {
console.error('Failed to sign in', error);
status.textContent = 'Login failed. Check your credentials.';
status.className = 'text-sm text-rose-400 min-h-6';
status.className = 'status-line status-error';
} finally {
submit.disabled = false;
}