@morphika/andami 0.5.0 → 0.5.2

package/app/admin/navigation/page.tsx

@@ -1,255 +1,255 @@
-"use client";
-
-import { useState, useEffect, useCallback } from "react";
-import { csrfHeaders } from "../../../lib/csrf-client";
-import { NavBuilder } from "../../../components/admin/nav-builder";
-import NavMobileSettings from "../../../components/admin/nav-builder/NavMobileSettings";
-import { revalidateSite } from "../../../lib/revalidate";
-import type { NavItem, NavDesign, MobileNavDesign, SiteSettings } from "../../../lib/sanity/types";
-
-/**
- * /admin/navigation — Navigation editing.
- * Session 129: Footer tab removed — footers are now custom sections placed freely by the user.
- * Session 158: Added "Mobile Menu" tab for independent mobile menu styles.
- */
-
-type NavTabId = "desktop" | "mobile";
-
-const TABS: { id: NavTabId; label: string }[] = [
-  { id: "desktop", label: "Desktop" },
-  { id: "mobile", label: "Mobile Menu" },
-];
-
-export default function AdminNavigationPage() {
-  const [settings, setSettings] = useState<SiteSettings | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [activeTab, setActiveTab] = useState<NavTabId>("desktop");
-  const [savingNav, setSavingNav] = useState(false);
-  const [savingMobile, setSavingMobile] = useState(false);
-  const [mobileDesign, setMobileDesign] = useState<MobileNavDesign>({});
-  const [mobileHasChanges, setMobileHasChanges] = useState(false);
-  const [message, setMessage] = useState<{
-    type: "success" | "error";
-    text: string;
-  } | null>(null);
-
-  // ── Load settings ──
-  const fetchSettings = useCallback(async () => {
-    try {
-      const res = await fetch("/api/admin/settings");
-      if (res.ok) {
-        const data = await res.json();
-        setSettings(data.settings || null);
-      }
-    } catch {
-      setMessage({ type: "error", text: "Failed to load navigation" });
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    fetchSettings();
-  }, [fetchSettings]);
-
-  // Sync mobile design from loaded settings
-  useEffect(() => {
-    if (settings?.nav_mobile_design) {
-      setMobileDesign(settings.nav_mobile_design);
-    }
-  }, [settings]);
-
-  // ── Auto-dismiss messages ──
-  useEffect(() => {
-    if (!message) return;
-    const timer = setTimeout(() => setMessage(null), 5000);
-    return () => clearTimeout(timer);
-  }, [message]);
-
-  // ── Save handlers ──
-  const handleSaveNavBuilder = async (navItems: NavItem[], navDesign: NavDesign) => {
-    setSavingNav(true);
-    setMessage(null);
-    try {
-      // Sanitize items for Sanity
-      const sanitizedItems = navItems.map((item) => ({
-        _key: item._key,
-        type: item.type || "menu-item",
-        label: item.label,
-        ...(item.logo_image ? { logo_image: item.logo_image } : {}),
-        link_type: item.link_type,
-        ...(item.link_type === "internal" && item.internal_page
-          ? { internal_page: { _ref: item.internal_page._id } }
-          : {}),
-        ...(item.link_type === "external"
-          ? { external_url: item.external_url }
-          : {}),
-        ...(item.link_type === "content" ? {
-          ...(item.content_type ? { content_type: item.content_type } : {}),
-          ...(item.content_asset ? { content_asset: item.content_asset } : {}),
-          ...(item.content_url ? { content_url: item.content_url } : {}),
-        } : {}),
-        visible: item.visible,
-        grid_column: item.grid_column,
-        column_span: item.column_span || 1,
-        ...(item.style_overrides && Object.keys(item.style_overrides).length > 0
-          ? { style_overrides: item.style_overrides }
-          : {}),
-      }));
-
-      // Save nav items
-      const navRes = await fetch("/api/admin/settings", {
-        method: "POST",
-        headers: { "Content-Type": "application/json", ...csrfHeaders() },
-        body: JSON.stringify({ section: "navigation", data: { nav_items: sanitizedItems } }),
-      });
-      if (!navRes.ok) {
-        const errData = await navRes.json();
-        throw new Error(errData.error || "Save items failed");
-      }
-
-      // Save nav design
-      const designRes = await fetch("/api/admin/settings", {
-        method: "POST",
-        headers: { "Content-Type": "application/json", ...csrfHeaders() },
-        body: JSON.stringify({ section: "nav_design", data: { nav_design: navDesign } }),
-      });
-      if (!designRes.ok) {
-        const errData = await designRes.json();
-        throw new Error(errData.error || "Save design failed");
-      }
-
-      setMessage({ type: "success", text: "Navigation saved" });
-
-      // Refresh settings
-      const settingsRes = await fetch("/api/admin/settings");
-      if (settingsRes.ok) {
-        const settingsData = await settingsRes.json();
-        setSettings(settingsData.settings || null);
-      }
-      revalidateSite();
-    } catch (err) {
-      setMessage({
-        type: "error",
-        text: err instanceof Error ? err.message : "Save failed",
-      });
-    } finally {
-      setSavingNav(false);
-    }
-  };
-
-  // ── Mobile menu design handlers ──
-  const handleMobileDesignChange = useCallback((newDesign: MobileNavDesign) => {
-    setMobileDesign(newDesign);
-    setMobileHasChanges(true);
-  }, []);
-
-  const handleSaveMobileDesign = useCallback(async () => {
-    setSavingMobile(true);
-    setMessage(null);
-    try {
-      const res = await fetch("/api/admin/settings", {
-        method: "POST",
-        headers: { "Content-Type": "application/json", ...csrfHeaders() },
-        body: JSON.stringify({
-          section: "nav_mobile_design",
-          data: { nav_mobile_design: mobileDesign },
-        }),
-      });
-      if (!res.ok) {
-        const errData = await res.json();
-        throw new Error(errData.error || "Save mobile design failed");
-      }
-      setMobileHasChanges(false);
-      setMessage({ type: "success", text: "Mobile menu saved" });
-
-      // Refresh settings
-      const settingsRes = await fetch("/api/admin/settings");
-      if (settingsRes.ok) {
-        const settingsData = await settingsRes.json();
-        setSettings(settingsData.settings || null);
-      }
-      revalidateSite();
-    } catch (err) {
-      setMessage({
-        type: "error",
-        text: err instanceof Error ? err.message : "Save failed",
-      });
-    } finally {
-      setSavingMobile(false);
-    }
-  }, [mobileDesign]);
-
-  if (loading) {
-    return (
-      <div className="flex items-center justify-center py-20">
-        <span className="text-sm text-neutral-400 animate-pulse">
-          Loading navigation...
-        </span>
-      </div>
-    );
-  }
-
-  return (
-    <div className="space-y-6">
-      <h1 className="text-2xl font-semibold text-neutral-900">
-        Navigation
-      </h1>
-
-      {/* Tab navigation — matches admin Customize style */}
-      <div className="flex items-center gap-1 border-b border-neutral-200">
-        {TABS.map((tab) => {
-          const isActive = activeTab === tab.id;
-          return (
-            <button
-              key={tab.id}
-              onClick={() => setActiveTab(tab.id)}
-              className={`flex items-center gap-1.5 px-4 py-2.5 text-[13px] font-medium transition-colors border-b-2 -mb-px ${
-                isActive
-                  ? "text-neutral-900 border-[#076bff]"
-                  : "text-neutral-400 border-transparent hover:text-neutral-600"
-              }`}
-            >
-              {tab.label}
-            </button>
-          );
-        })}
-      </div>
-
-      {/* Toast message */}
-      {message && (
-        <div
-          className={`p-3 rounded-xl border transition-opacity ${
-            message.type === "success"
-              ? "border-green-200 bg-green-50 text-green-700"
-              : "border-red-200 bg-red-50 text-red-700"
-          }`}
-        >
-          <p className="text-sm">{message.text}</p>
-        </div>
-      )}
-
-      {/* Tab content */}
-      {activeTab === "desktop" && (
-        <NavBuilder
-          initialItems={settings?.nav_items || []}
-          initialDesign={settings?.nav_design || {}}
-          onSave={handleSaveNavBuilder}
-          saving={savingNav}
-        />
-      )}
-
-      {activeTab === "mobile" && (
-        <NavMobileSettings
-          design={mobileDesign}
-          desktopDesign={settings?.nav_design || {}}
-          items={settings?.nav_items || []}
-          onChange={handleMobileDesignChange}
-          onSave={handleSaveMobileDesign}
-          saving={savingMobile}
-          hasChanges={mobileHasChanges}
-        />
-      )}
-    </div>
-  );
-}
+"use client";
+
+import { useState, useEffect, useCallback } from "react";
+import { csrfHeaders } from "../../../lib/csrf-client";
+import { NavBuilder } from "../../../components/admin/nav-builder";
+import NavMobileSettings from "../../../components/admin/nav-builder/NavMobileSettings";
+import { revalidateSite } from "../../../lib/revalidate";
+import type { NavItem, NavDesign, MobileNavDesign, SiteSettings } from "../../../lib/sanity/types";
+
+/**
+ * /admin/navigation — Navigation editing.
+ * Session 129: Footer tab removed — footers are now custom sections placed freely by the user.
+ * Session 158: Added "Mobile Menu" tab for independent mobile menu styles.
+ */
+
+type NavTabId = "desktop" | "mobile";
+
+const TABS: { id: NavTabId; label: string }[] = [
+  { id: "desktop", label: "Desktop" },
+  { id: "mobile", label: "Mobile Menu" },
+];
+
+export default function AdminNavigationPage() {
+  const [settings, setSettings] = useState<SiteSettings | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [activeTab, setActiveTab] = useState<NavTabId>("desktop");
+  const [savingNav, setSavingNav] = useState(false);
+  const [savingMobile, setSavingMobile] = useState(false);
+  const [mobileDesign, setMobileDesign] = useState<MobileNavDesign>({});
+  const [mobileHasChanges, setMobileHasChanges] = useState(false);
+  const [message, setMessage] = useState<{
+    type: "success" | "error";
+    text: string;
+  } | null>(null);
+
+  // ── Load settings ──
+  const fetchSettings = useCallback(async () => {
+    try {
+      const res = await fetch("/api/admin/settings");
+      if (res.ok) {
+        const data = await res.json();
+        setSettings(data.settings || null);
+      }
+    } catch {
+      setMessage({ type: "error", text: "Failed to load navigation" });
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchSettings();
+  }, [fetchSettings]);
+
+  // Sync mobile design from loaded settings
+  useEffect(() => {
+    if (settings?.nav_mobile_design) {
+      setMobileDesign(settings.nav_mobile_design);
+    }
+  }, [settings]);
+
+  // ── Auto-dismiss messages ──
+  useEffect(() => {
+    if (!message) return;
+    const timer = setTimeout(() => setMessage(null), 5000);
+    return () => clearTimeout(timer);
+  }, [message]);
+
+  // ── Save handlers ──
+  const handleSaveNavBuilder = async (navItems: NavItem[], navDesign: NavDesign) => {
+    setSavingNav(true);
+    setMessage(null);
+    try {
+      // Sanitize items for Sanity
+      const sanitizedItems = navItems.map((item) => ({
+        _key: item._key,
+        type: item.type || "menu-item",
+        label: item.label,
+        ...(item.logo_image ? { logo_image: item.logo_image } : {}),
+        link_type: item.link_type,
+        ...(item.link_type === "internal" && item.internal_page
+          ? { internal_page: { _ref: item.internal_page._id } }
+          : {}),
+        ...(item.link_type === "external"
+          ? { external_url: item.external_url }
+          : {}),
+        ...(item.link_type === "content" ? {
+          ...(item.content_type ? { content_type: item.content_type } : {}),
+          ...(item.content_asset ? { content_asset: item.content_asset } : {}),
+          ...(item.content_url ? { content_url: item.content_url } : {}),
+        } : {}),
+        visible: item.visible,
+        grid_column: item.grid_column,
+        column_span: item.column_span || 1,
+        ...(item.style_overrides && Object.keys(item.style_overrides).length > 0
+          ? { style_overrides: item.style_overrides }
+          : {}),
+      }));
+
+      // Save nav items
+      const navRes = await fetch("/api/admin/settings", {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...csrfHeaders() },
+        body: JSON.stringify({ section: "navigation", data: { nav_items: sanitizedItems } }),
+      });
+      if (!navRes.ok) {
+        const errData = await navRes.json();
+        throw new Error(errData.error || "Save items failed");
+      }
+
+      // Save nav design
+      const designRes = await fetch("/api/admin/settings", {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...csrfHeaders() },
+        body: JSON.stringify({ section: "nav_design", data: { nav_design: navDesign } }),
+      });
+      if (!designRes.ok) {
+        const errData = await designRes.json();
+        throw new Error(errData.error || "Save design failed");
+      }
+
+      setMessage({ type: "success", text: "Navigation saved" });
+
+      // Refresh settings
+      const settingsRes = await fetch("/api/admin/settings");
+      if (settingsRes.ok) {
+        const settingsData = await settingsRes.json();
+        setSettings(settingsData.settings || null);
+      }
+      revalidateSite();
+    } catch (err) {
+      setMessage({
+        type: "error",
+        text: err instanceof Error ? err.message : "Save failed",
+      });
+    } finally {
+      setSavingNav(false);
+    }
+  };
+
+  // ── Mobile menu design handlers ──
+  const handleMobileDesignChange = useCallback((newDesign: MobileNavDesign) => {
+    setMobileDesign(newDesign);
+    setMobileHasChanges(true);
+  }, []);
+
+  const handleSaveMobileDesign = useCallback(async () => {
+    setSavingMobile(true);
+    setMessage(null);
+    try {
+      const res = await fetch("/api/admin/settings", {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...csrfHeaders() },
+        body: JSON.stringify({
+          section: "nav_mobile_design",
+          data: { nav_mobile_design: mobileDesign },
+        }),
+      });
+      if (!res.ok) {
+        const errData = await res.json();
+        throw new Error(errData.error || "Save mobile design failed");
+      }
+      setMobileHasChanges(false);
+      setMessage({ type: "success", text: "Mobile menu saved" });
+
+      // Refresh settings
+      const settingsRes = await fetch("/api/admin/settings");
+      if (settingsRes.ok) {
+        const settingsData = await settingsRes.json();
+        setSettings(settingsData.settings || null);
+      }
+      revalidateSite();
+    } catch (err) {
+      setMessage({
+        type: "error",
+        text: err instanceof Error ? err.message : "Save failed",
+      });
+    } finally {
+      setSavingMobile(false);
+    }
+  }, [mobileDesign]);
+
+  if (loading) {
+    return (
+      <div className="flex items-center justify-center py-20">
+        <span className="text-sm text-neutral-400 animate-pulse">
+          Loading navigation...
+        </span>
+      </div>
+    );
+  }
+
+  return (
+    <div className="space-y-6">
+      <h1 className="text-2xl font-semibold text-neutral-900">
+        Navigation
+      </h1>
+
+      {/* Tab navigation — matches admin Customize style */}
+      <div className="flex items-center gap-1 border-b border-neutral-200">
+        {TABS.map((tab) => {
+          const isActive = activeTab === tab.id;
+          return (
+            <button
+              key={tab.id}
+              onClick={() => setActiveTab(tab.id)}
+              className={`flex items-center gap-1.5 px-4 py-2.5 text-[13px] font-medium transition-colors border-b-2 -mb-px ${
+                isActive
+                  ? "text-neutral-900 border-[#3580f9]"
+                  : "text-neutral-400 border-transparent hover:text-neutral-600"
+              }`}
+            >
+              {tab.label}
+            </button>
+          );
+        })}
+      </div>
+
+      {/* Toast message */}
+      {message && (
+        <div
+          className={`p-3 rounded-xl border transition-opacity ${
+            message.type === "success"
+              ? "border-green-200 bg-green-50 text-green-700"
+              : "border-red-200 bg-red-50 text-red-700"
+          }`}
+        >
+          <p className="text-sm">{message.text}</p>
+        </div>
+      )}
+
+      {/* Tab content */}
+      {activeTab === "desktop" && (
+        <NavBuilder
+          initialItems={settings?.nav_items || []}
+          initialDesign={settings?.nav_design || {}}
+          onSave={handleSaveNavBuilder}
+          saving={savingNav}
+        />
+      )}
+
+      {activeTab === "mobile" && (
+        <NavMobileSettings
+          design={mobileDesign}
+          desktopDesign={settings?.nav_design || {}}
+          items={settings?.nav_items || []}
+          onChange={handleMobileDesignChange}
+          onSave={handleSaveMobileDesign}
+          saving={savingMobile}
+          hasChanges={mobileHasChanges}
+        />
+      )}
+    </div>
+  );
+}

package/app/admin/pages/[slug]/page.tsx

@@ -23,7 +23,7 @@ import { isPageSectionV2, isCustomSectionInstance, isParallaxGroup, isCoverSecti
 import SectionEditorBar from "../../../../components/builder/SectionEditorBar";
 import CustomSectionInstanceCard from "../../../../components/builder/CustomSectionInstanceCard";
 import { ColumnDragProvider } from "../../../../components/builder/ColumnDragContext";
-import type { BlockType } from "../../../../lib/builder/types";
+import type { BlockType, SectionBlockType } from "../../../../lib/builder/types";
 import { findGaps } from "../../../../lib/builder/cascade";
 import { isSectionBlockType } from "../../../../lib/builder/types";
 import BlockLivePreview from "../../../../components/builder/BlockLivePreview";
@@ -415,10 +415,10 @@ export default function PageEditorPage() {
     [store]
   );
 
-  // Handle add page section (project grid / project carousel)
+  // Handle add page section (project grid / project carousel / marquee)
   // afterRowKey=null → always appends to end of page (bottom "Add Section" button)
   const handleAddSection = useCallback(
-    (blockType: "projectGridBlock" | "projectCarouselBlock") => {
+    (blockType: SectionBlockType) => {
       store.addSection(blockType, null);
       setShowSectionPicker(false);
     },
@@ -610,7 +610,7 @@ export default function PageEditorPage() {
           <button
             onClick={handleSave}
             disabled={store.isSaving || !store.isDirty}
-            className="rounded-lg bg-[#076bff] px-5 py-1.5 text-sm font-medium text-white hover:bg-[#0559d4] transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
+            className="rounded-lg bg-[#3580f9] px-5 py-1.5 text-sm font-medium text-white hover:bg-[#2d6dd4] transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
           >
             {store.isSaving ? "Saving..." : "Save"}
           </button>
@@ -652,7 +652,7 @@ export default function PageEditorPage() {
                       e.stopPropagation();
                       setShowSectionPicker(true);
                     }}
-                    className="rounded-lg bg-[#076bff] px-4 py-2 text-xs text-white hover:bg-[#0559d4] transition-colors"
+                    className="rounded-lg bg-[#3580f9] px-4 py-2 text-xs text-white hover:bg-[#2d6dd4] transition-colors"
                   >
                     + Add First Section
                   </button>
@@ -818,7 +818,7 @@ export default function PageEditorPage() {
                           padding: "5px 16px",
                           background: "#e0daff",
                           color: "#7500d5",
-                          border: "1px dashed #7500d5",
+                          border: "1.5px dashed #7500d5",
                         }}
                       >
                         + Add Section

package/app/admin/pages/page.tsx

@@ -123,7 +123,7 @@ function CreatePageModal({
                 value={title}
                 onChange={(e) => setTitle(e.target.value)}
                 placeholder="Page title"
-                className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#076bff] focus:outline-none focus:ring-2 focus:ring-[#076bff]/10"
+                className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#3580f9] focus:outline-none focus:ring-2 focus:ring-[#3580f9]/10"
                 autoFocus
               />
             </div>
@@ -136,7 +136,7 @@ function CreatePageModal({
                 value={slug}
                 onChange={(e) => { setSlug(e.target.value); setAutoSlug(false); }}
                 placeholder="page-slug"
-                className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#076bff] focus:outline-none focus:ring-2 focus:ring-[#076bff]/10"
+                className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#3580f9] focus:outline-none focus:ring-2 focus:ring-[#3580f9]/10"
               />
               <p className="text-xs text-neutral-400 mt-1">URL: /{slug || "page-slug"}</p>
             </div>
@@ -152,7 +152,7 @@ function CreatePageModal({
               <button
                 type="submit"
                 disabled={creating}
-                className="rounded-lg bg-[#076bff] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#0559d4] transition-colors disabled:opacity-50"
+                className="rounded-lg bg-[#3580f9] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#2d6dd4] transition-colors disabled:opacity-50"
               >
                 {creating ? "Creating..." : "Create"}
               </button>
@@ -297,7 +297,7 @@ function EditPageModal({
               type="text"
               value={title}
               onChange={(e) => setTitle(e.target.value)}
-              className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#076bff] focus:outline-none focus:ring-2 focus:ring-[#076bff]/10"
+              className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#3580f9] focus:outline-none focus:ring-2 focus:ring-[#3580f9]/10"
               autoFocus
             />
           </div>
@@ -307,14 +307,14 @@ function EditPageModal({
               type="text"
               value={slug}
               onChange={(e) => setSlug(e.target.value.toLowerCase().replace(/[^a-z0-9-]/g, ""))}
-              className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#076bff] focus:outline-none focus:ring-2 focus:ring-[#076bff]/10"
+              className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#3580f9] focus:outline-none focus:ring-2 focus:ring-[#3580f9]/10"
             />
             <p className="text-xs text-neutral-400 mt-1">URL: /{slug || "page-slug"}</p>
           </div>
           {error && <p className="text-xs text-[var(--admin-error)]">{error}</p>}
           <div className="flex gap-3 justify-end pt-2">
             <button type="button" onClick={onClose} className="rounded-lg border border-neutral-200 px-5 py-2.5 text-sm text-neutral-500 hover:text-neutral-800 hover:border-neutral-300 transition-colors">Cancel</button>
-            <button type="submit" disabled={saving} className="rounded-lg bg-[#076bff] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#0559d4] transition-colors disabled:opacity-50">{saving ? "Saving..." : "Save"}</button>
+            <button type="submit" disabled={saving} className="rounded-lg bg-[#3580f9] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#2d6dd4] transition-colors disabled:opacity-50">{saving ? "Saving..." : "Save"}</button>
           </div>
         </form>
       </div>
@@ -381,7 +381,7 @@ function HomeConfirmModal({
         {error && <p className="text-xs text-[var(--admin-error)] mb-4">{error}</p>}
         <div className="flex gap-3 justify-end">
           <button onClick={onClose} className="rounded-lg border border-neutral-200 px-5 py-2.5 text-sm text-neutral-500 hover:text-neutral-800 hover:border-neutral-300 transition-colors">Cancel</button>
-          <button onClick={handleConfirm} disabled={setting} className="rounded-lg bg-[#076bff] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#0559d4] transition-colors disabled:opacity-50">{setting ? "Setting..." : "Set as Home"}</button>
+          <button onClick={handleConfirm} disabled={setting} className="rounded-lg bg-[#3580f9] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#2d6dd4] transition-colors disabled:opacity-50">{setting ? "Setting..." : "Set as Home"}</button>
         </div>
       </div>
     </div>
@@ -456,7 +456,7 @@ export default function AdminPagesPage() {
         </h1>
         <button
           onClick={() => setShowCreate(true)}
-          className="rounded-lg bg-[#076bff] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#0559d4] transition-colors"
+          className="rounded-lg bg-[#3580f9] px-5 py-2.5 text-sm font-medium text-white hover:bg-[#2d6dd4] transition-colors"
         >
           + New Page
         </button>
@@ -469,7 +469,7 @@ export default function AdminPagesPage() {
           value={search}
           onChange={(e) => setSearch(e.target.value)}
           placeholder="Search by title or slug..."
-          className="w-full max-w-md rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#076bff] focus:outline-none focus:ring-2 focus:ring-[#076bff]/10 shadow-sm"
+          className="w-full max-w-md rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 placeholder:text-neutral-400 focus:border-[#3580f9] focus:outline-none focus:ring-2 focus:ring-[#3580f9]/10 shadow-sm"
         />
       </div>
 
@@ -484,7 +484,7 @@ export default function AdminPagesPage() {
             {pages.length === 0 ? "No pages yet" : "No pages match your search"}
           </p>
           {pages.length === 0 && (
-            <button onClick={() => setShowCreate(true)} className="text-xs text-[#076bff] hover:underline">
+            <button onClick={() => setShowCreate(true)} className="text-xs text-[#3580f9] hover:underline">
               Create your first page
             </button>
           )}
@@ -507,7 +507,7 @@ export default function AdminPagesPage() {
             >
               {/* Title */}
               <div className="cursor-pointer" onClick={() => router.push(`/admin/pages/${page.slug.current}`)}>
-                <p className="text-sm text-neutral-900 group-hover:text-[#076bff] transition-colors">
+                <p className="text-sm text-neutral-900 group-hover:text-[#3580f9] transition-colors">
                   {page.title}
                 </p>
                 <p className="text-xs text-neutral-400">/{page.slug.current}</p>