Add admin dashboard header

src/components/layout/AdminHeader.tsx

@@ -0,0 +1,40 @@
+import { Shield, ArrowLeft, Settings } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Link } from 'react-router-dom';
+import { ThemeToggle } from '@/components/theme/ThemeToggle';
+import { AuthButtons } from '@/components/auth/AuthButtons';
+
+export function AdminHeader() {
+  return (
+    <header className="sticky top-0 z-50 w-full border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="container flex h-16 items-center justify-between px-4">
+        {/* Left Section - Back to main site */}
+        <div className="flex items-center gap-4">
+          <Button variant="ghost" size="sm" asChild>
+            <Link to="/" className="flex items-center gap-2">
+              <ArrowLeft className="w-4 h-4" />
+              <span className="hidden sm:inline">Back to ThrillWiki</span>
+            </Link>
+          </Button>
+          
+          <div className="h-6 w-px bg-border hidden sm:block" />
+          
+          <div className="flex items-center gap-2">
+            <Shield className="w-6 h-6 text-primary" />
+            <h1 className="text-lg font-semibold">Admin Dashboard</h1>
+          </div>
+        </div>
+
+        {/* Right Section - Admin actions */}
+        <div className="flex items-center gap-2">
+          <Button variant="ghost" size="sm">
+            <Settings className="w-4 h-4" />
+            <span className="hidden sm:ml-2 sm:inline">Settings</span>
+          </Button>
+          <ThemeToggle />
+          <AuthButtons />
+        </div>
+      </div>
+    </header>
+  );
+}

src/pages/Admin.tsx

@@ -10,6 +10,7 @@ import { ModerationQueue } from '@/components/moderation/ModerationQueue';
 import { ReportsQueue } from '@/components/moderation/ReportsQueue';
 import { UserRoleManager } from '@/components/moderation/UserRoleManager';
 import { ProfileManager } from '@/components/moderation/ProfileManager';
+import { AdminHeader } from '@/components/layout/AdminHeader';
 
 export default function Admin() {
   const { user, loading: authLoading } = useAuth();
@@ -48,16 +49,14 @@ export default function Admin() {
   }
 
   return (
-    <div className="container mx-auto px-4 py-8">
+    <>
-      <div className="mb-8">
+      <AdminHeader />
-        <div className="flex items-center gap-3 mb-2">
+      <div className="container mx-auto px-4 py-8">
-          <Shield className="w-8 h-8 text-primary" />
+        <div className="mb-8">
-          <h1 className="text-3xl font-bold">Admin Dashboard</h1>
+          <p className="text-muted-foreground">
+            Manage content moderation and user roles
+          </p>
         </div>
-        <p className="text-muted-foreground">
-          Manage content moderation and user roles
-        </p>
-      </div>
 
       <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
         <Card>
@@ -176,6 +175,7 @@ export default function Admin() {
           </Card>
         </TabsContent>
       </Tabs>
-    </div>
+      </div>
+    </>
   );
 }