added wide mode to desktop editor

frontend/src/layouts/AdminLayout.astro

@@ -3,12 +3,13 @@ import Layout from './Layout.astro';
 
 interface Props {
     title: string;
+    wide?: boolean;
 }
 
-const { title } = Astro.props;
+const { title, wide = false } = Astro.props;
 ---
 
-<Layout title={title}>
+<Layout title={title} wide={wide}>
     <div class="glass p-6 md:p-12 mb-12" id="admin-content" style="display: none;">
         <header class="mb-8 md:mb-12 border-b border-white/5 pb-8 md:pb-12 flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
             <div>

frontend/src/layouts/Layout.astro

@@ -4,9 +4,10 @@ import ThemeSwitcher from '../components/react/ThemeSwitcher';
 
 interface Props {
 	title: string;
+	wide?: boolean;
 }
 
-const { title } = Astro.props;
+const { title, wide = false } = Astro.props;
 
 const API_URL = process.env.PUBLIC_API_URL || 'http://backend:3000';
 
@@ -63,12 +64,12 @@ try {
                 <div class="flex gap-3 md:gap-4 items-center text-sm md:text-base w-full md:w-auto justify-center md:justify-end">
                     <a href="/" class="text-subtext0 hover:text-text transition-colors">Home</a>
                     <a href="/admin" class="text-subtext0 hover:text-mauve transition-colors">Admin</a>
-                    <ThemeSwitcher client:load defaultTheme={siteConfig.theme} />
+                    <ThemeSwitcher client:only="react" defaultTheme={siteConfig.theme} />
                 </div>
             </header>
         </nav>
 
-        <main class="max-w-6xl mx-auto px-4 md:px-6 py-4 md:py-8">
+        <main class={`mx-auto px-4 md:px-6 py-4 md:py-8 ${wide ? 'max-w-[95vw]' : 'max-w-6xl'}`}>
 		    <slot />
         </main>
 

frontend/src/pages/admin/assets.astro

@@ -5,5 +5,5 @@ import AssetManager from '../../components/react/admin/AssetManager';
 
 <AdminLayout title="Asset Library">
     <p slot="header-subtitle" class="mt-2 text-sm md:text-base" style="color: var(--text) !important;">Manage your uploaded images and files.</p>
-    <AssetManager client:load mode="manage" />
+    <AssetManager client:only="react" mode="manage" />
 </AdminLayout>

frontend/src/pages/admin/editor.astro

@@ -5,7 +5,7 @@ import Editor from '../../components/react/admin/Editor';
 const editSlug = Astro.url.searchParams.get('edit') || undefined;
 ---
 
-<AdminLayout title="Write Post">
+<AdminLayout title="Write Post" wide>
     <p slot="header-subtitle" class="mt-2 text-sm md:text-base" style="color: var(--text) !important;">Create/Edit post.</p>
-    <Editor client:load editSlug={editSlug} />
+    <Editor client:only="react" editSlug={editSlug} />
 </AdminLayout>

frontend/src/pages/admin/index.astro

@@ -4,5 +4,5 @@ import Dashboard from '../../components/react/admin/Dashboard';
 ---
 
 <AdminLayout title="Admin Dashboard">
-    <Dashboard client:load />
+    <Dashboard client:only="react" />
 </AdminLayout>

frontend/src/pages/admin/login.astro

@@ -4,5 +4,5 @@ import Login from '../../components/react/admin/Login';
 ---
 
 <Layout title="Admin Login">
-    <Login client:load />
+    <Login client:only="react" />
 </Layout>

frontend/src/pages/admin/settings.astro

@@ -5,5 +5,5 @@ import Settings from '../../components/react/admin/Settings';
 
 <AdminLayout title="Site Settings">
     <p slot="header-subtitle" class="mt-2 text-sm md:text-base" style="color: var(--text) !important;">Configure how your blog looks and feels globally.</p>
-    <Settings client:load />
+    <Settings client:only="react" />
 </AdminLayout>