feat: Implement new settings pages and refactor application layout and navigation with new components and hooks.

This commit is contained in:
syntaxbullet
2026-01-16 12:49:17 +01:00
parent 2f73f38877
commit 2a72beb0ef
33 changed files with 2584 additions and 1863 deletions

View File

@@ -1,58 +1,20 @@
import React from "react";
import { Link } from "react-router-dom";
import { QuestForm } from "../components/quest-form";
import { Badge } from "../components/ui/badge";
import { SectionHeader } from "../components/section-header";
import { SettingsDrawer } from "../components/settings-drawer";
import { ChevronLeft } from "lucide-react";
export function AdminQuests() {
return (
<div className="min-h-screen bg-aurora-page text-foreground font-outfit overflow-x-hidden">
{/* Navigation */}
<nav className="sticky top-0 z-50 glass-card border-b border-border/50 py-4 px-8 flex justify-between items-center">
<div className="flex items-center gap-3">
<div className="w-8 h-8 rounded-full bg-aurora sun-flare shadow-sm" />
<span className="text-xl font-bold tracking-tight text-primary">Aurora Admin</span>
</div>
<main className="pt-8 px-8 pb-12 max-w-7xl mx-auto space-y-12">
<SectionHeader
badge="Quest Management"
title="Quests"
description="Create and manage quests for the Aurora RPG students."
/>
<div className="flex items-center gap-6">
<Link to="/" className="text-step--1 font-medium text-muted-foreground hover:text-primary transition-colors">
Home
</Link>
<Link to="/dashboard" className="text-step--1 font-medium text-muted-foreground hover:text-primary transition-colors">
Dashboard
</Link>
<Link to="/design-system" className="text-step--1 font-medium text-muted-foreground hover:text-primary transition-colors">
Design System
</Link>
<div className="h-4 w-px bg-border/50" />
<SettingsDrawer />
</div>
</nav>
<main className="pt-12 px-8 pb-12 max-w-7xl mx-auto space-y-12">
<div className="space-y-4">
<Link
to="/dashboard"
className="flex items-center gap-2 text-muted-foreground hover:text-primary transition-colors w-fit"
>
<ChevronLeft className="w-4 h-4" />
<span className="text-sm font-medium">Back to Dashboard</span>
</Link>
<SectionHeader
badge="Quest Management"
title="Administrative Tools"
description="Create and manage quests for the Aurora RPG students."
/>
</div>
<div className="animate-in fade-in slide-up duration-700">
<QuestForm />
</div>
</main>
</div>
<div className="animate-in fade-in slide-up duration-700">
<QuestForm />
</div>
</main>
);
}