drjones/AetherForge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Redesign dashboard with steampunk neon theme and live gauges.

Browse Source 
Ambient background, 3D neon cards, brass HUD styling, glowing charts, gauge rings, and refreshed Command Deck, Fleet Roster, Forge, and Calibrate pages.
This commit is contained in:
drjones
2026-05-27 00:43:34 -07:00
parent 6db9a33a20
commit 9d223b8137
20 changed files with 1638 additions and 307 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
server/web/src/pages/SettingsPage.tsx
View File

@@ -2,6 +2,7 @@ import { useState, useEffect } from 'react';
import { api } from '../api/client';
import type { ServerConfig } from '../types';
import { HelpTip } from '../components/HelpTip';
import NeonCard from '../components/NeonCard/NeonCard';
import './Pages.css';
export default function SettingsPage() {
@@ -47,9 +48,14 @@ export default function SettingsPage() {
if (loading) {
return (
<div className="page fade-in">
<div className="page-header"><h1>Settings</h1></div>
<div className="card"><p>Loading settings...</p></div>
<div className="page fade-in command-deck">
<header className="deck-hero">
<div className="deck-hero-text">
<p className="deck-eyebrow font-tech">CALIBRATION</p>
<h1>System Calibrate</h1>
</div>
</header>
<NeonCard accent="brass"><p>Loading settings...</p></NeonCard>
</div>
);
}
@@ -64,13 +70,17 @@ export default function SettingsPage() {
}
return (
<div className="page fade-in">
<div className="page-header">
<h1>Settings</h1>
<div className="page fade-in command-deck">
<header className="deck-hero">
<div className="deck-hero-text">
<p className="deck-eyebrow font-tech">CALIBRATION</p>
<h1>System Calibrate</h1>
<p className="page-subtitle">Pool, wallet, defaults, and install paths for the forge.</p>
</div>
<button className="btn btn-primary" onClick={handleSave} disabled={saving}>
{saving ? '💾 Saving...' : '💾 Save Settings'}
{saving ? 'Saving...' : 'Save Settings'}
</button>
</div>
</header>
{saveMessage && (
<div className={`save-message ${saveMessage.includes('✅') ? 'success' : 'error'}`}>