@morphika/andami 0.5.1 → 0.5.2

package/app/admin/projects/page.tsx

@@ -135,7 +135,7 @@ function MediaPicker({
         <button
           type="button"
           onClick={() => openBrowser()}
-          className="w-full aspect-[4/3] rounded-lg border border-dashed border-neutral-300 flex flex-col items-center justify-center gap-2 hover:border-[#076bff] hover:bg-neutral-50 transition-colors cursor-pointer"
+          className="w-full aspect-[4/3] rounded-lg border border-dashed border-neutral-300 flex flex-col items-center justify-center gap-2 hover:border-[#3580f9] hover:bg-neutral-50 transition-colors cursor-pointer"
         >
           {activeTab === "image" ? (
             <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" className="text-neutral-400">
@@ -240,13 +240,13 @@ function CreateProjectModal({
         <form onSubmit={handleSubmit} className="space-y-4">
           <div>
             <label className="block text-xs text-neutral-500 mb-1">Project Title</label>
-            <input type="text" value={title} onChange={(e) => setTitle(e.target.value)} placeholder="My Project" 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" autoFocus />
+            <input type="text" value={title} onChange={(e) => setTitle(e.target.value)} placeholder="My Project" 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" autoFocus />
           </div>
           <div>
             <label className="block text-xs text-neutral-500 mb-1">URL Slug</label>
             <div className="flex items-center gap-1">
               <span className="text-xs text-neutral-400">/work/</span>
-              <input type="text" value={slug} onChange={(e) => { setSlug(e.target.value); setAutoSlug(false); }} placeholder="my-project" className="flex-1 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" />
+              <input type="text" value={slug} onChange={(e) => { setSlug(e.target.value); setAutoSlug(false); }} placeholder="my-project" className="flex-1 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" />
             </div>
           </div>
           <MediaPicker
@@ -259,7 +259,7 @@ function CreateProjectModal({
           {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={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">{creating ? "Creating..." : "Create"}</button>
+            <button type="submit" disabled={creating} 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>
           </div>
         </form>
       </div>
@@ -344,13 +344,13 @@ function EditProjectModal({
         <form onSubmit={handleSave} className="space-y-4">
           <div>
             <label className="block text-xs text-neutral-500 mb-1">Project Title</label>
-            <input 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" autoFocus />
+            <input 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-[#3580f9] focus:outline-none" autoFocus />
           </div>
           <div>
             <label className="block text-xs text-neutral-500 mb-1">URL Slug</label>
             <div className="flex items-center gap-1">
               <span className="text-xs text-neutral-400">/work/</span>
-              <input type="text" value={slug} onChange={(e) => setSlug(e.target.value)} className="flex-1 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" />
+              <input type="text" value={slug} onChange={(e) => setSlug(e.target.value)} className="flex-1 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" />
             </div>
           </div>
           <MediaPicker
@@ -363,7 +363,7 @@ function EditProjectModal({
           {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>
@@ -494,7 +494,7 @@ export default function AdminProjectsPage() {
             <select
               value={viewMode === "thumb" ? "Thumb View" : "List View"}
               onChange={(e) => setViewMode(e.target.value === "Thumb View" ? "thumb" : "list")}
-              className="appearance-none rounded-lg border border-neutral-200 bg-white px-3 py-2.5 pr-8 text-sm text-neutral-700 focus:border-[#076bff] focus:outline-none cursor-pointer"
+              className="appearance-none rounded-lg border border-neutral-200 bg-white px-3 py-2.5 pr-8 text-sm text-neutral-700 focus:border-[#3580f9] focus:outline-none cursor-pointer"
             >
               <option>List View</option>
               <option>Thumb View</option>
@@ -505,7 +505,7 @@ export default function AdminProjectsPage() {
           </div>
           <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 Project
           </button>
@@ -519,7 +519,7 @@ export default function AdminProjectsPage() {
           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>
 
@@ -534,7 +534,7 @@ export default function AdminProjectsPage() {
             {projects.length === 0 ? "No projects yet" : "No projects match your search"}
           </p>
           {projects.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 project
             </button>
           )}
@@ -557,7 +557,7 @@ export default function AdminProjectsPage() {
                 className="group grid grid-cols-[1fr_120px_140px_180px] gap-4 items-center rounded-lg bg-white px-5 py-4 hover:shadow-md transition-all cursor-pointer border border-transparent hover:border-neutral-200"
                 onClick={() => router.push(`/admin/projects/${project.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">
                   {project.title}
                 </p>
 
@@ -601,7 +601,7 @@ export default function AdminProjectsPage() {
             <div key={project._id} className="group relative">
               {/* Thumbnail card */}
               <div
-                className="relative aspect-[4/3] rounded-xl overflow-hidden bg-neutral-200 cursor-pointer border border-neutral-200/80 hover:shadow-md hover:shadow-[#076bff]/5 transition-all"
+                className="relative aspect-[4/3] rounded-xl overflow-hidden bg-neutral-200 cursor-pointer border border-neutral-200/80 hover:shadow-md hover:shadow-[#3580f9]/5 transition-all"
                 onClick={() => router.push(`/admin/projects/${project.slug.current}`)}
               >
                 {project.thumbnail_path ? (
@@ -628,7 +628,7 @@ export default function AdminProjectsPage() {
                 {/* Hover overlay with actions */}
                 <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors flex items-start justify-end p-2 opacity-0 group-hover:opacity-100">
                   <div className="flex gap-1" onClick={(e) => e.stopPropagation()}>
-                    <button onClick={() => setEditingProject(project)} className="p-1.5 rounded bg-white/90 text-neutral-600 hover:text-[#076bff] transition-colors shadow-sm" title="Edit">
+                    <button onClick={() => setEditingProject(project)} className="p-1.5 rounded bg-white/90 text-neutral-600 hover:text-[#3580f9] transition-colors shadow-sm" title="Edit">
                       <EditIcon />
                     </button>
                     <button onClick={() => handleDuplicate(project)} disabled={duplicating === project._id} className="p-1.5 rounded bg-white/90 text-neutral-600 hover:text-neutral-900 transition-colors shadow-sm" title="Duplicate">

package/app/admin/setup/page.tsx

@@ -53,7 +53,7 @@ export default function SetupPage() {
         style={{ fontFamily: "Inter, system-ui, sans-serif" }}
       >
         <div className="text-center">
-          <div className="w-6 h-6 border-2 border-[#076bff] border-t-transparent rounded-full animate-spin mx-auto mb-3" />
+          <div className="w-6 h-6 border-2 border-[#3580f9] border-t-transparent rounded-full animate-spin mx-auto mb-3" />
           <p className="text-xs text-[#999]">Checking setup status...</p>
         </div>
       </div>

package/app/admin/styles/page.tsx

@@ -172,7 +172,7 @@ export default function AdminStylesPage() {
               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-900 border-[#3580f9]"
                   : "text-neutral-400 border-transparent hover:text-neutral-600"
               }`}
             >

package/components/admin/MetadataEditor.tsx

@@ -71,7 +71,7 @@ export default function MetadataEditor({
           value={title}
           onChange={(e) => setTitle(e.target.value)}
           placeholder={getSiteConfig().defaults.metaTitle}
-          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#076bff] focus:outline-none"
+          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#3580f9] focus:outline-none"
         />
         <p className="text-xs text-neutral-400">
           Shown in browser tabs and search results when no page-specific title is
@@ -89,7 +89,7 @@ export default function MetadataEditor({
           onChange={(e) => setDescription(e.target.value)}
           placeholder="Motion graphics studio based in Barcelona..."
           rows={3}
-          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#076bff] focus:outline-none resize-none"
+          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#3580f9] focus:outline-none resize-none"
         />
         <div className="flex justify-between">
           <p className="text-xs text-neutral-400">
@@ -115,7 +115,7 @@ export default function MetadataEditor({
           value={ogImage}
           onChange={(e) => setOgImage(e.target.value)}
           placeholder="meta/og-image.jpg"
-          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#076bff] focus:outline-none"
+          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#3580f9] focus:outline-none"
         />
         <p className="text-xs text-neutral-400">
           Relative path to the default image shown when sharing on social media.
@@ -133,7 +133,7 @@ export default function MetadataEditor({
           value={favicon}
           onChange={(e) => setFavicon(e.target.value)}
           placeholder="meta/favicon.ico"
-          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#076bff] focus:outline-none"
+          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#3580f9] focus:outline-none"
         />
         <p className="text-xs text-neutral-400">
           Relative path to the favicon. Resolved via the asset seed URL.
@@ -150,7 +150,7 @@ export default function MetadataEditor({
           value={analyticsId}
           onChange={(e) => setAnalyticsId(e.target.value)}
           placeholder="G-XXXXXXXXXX or plausible domain"
-          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#076bff] focus:outline-none"
+          className="w-full rounded-lg border border-neutral-200 bg-white px-3 py-2.5 text-sm text-neutral-900 focus:border-[#3580f9] focus:outline-none"
         />
         <p className="text-xs text-neutral-400">
           Google Analytics measurement ID or Plausible domain. Leave empty to
@@ -163,7 +163,7 @@ export default function MetadataEditor({
         <button
           onClick={handleSave}
           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"
+          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 Metadata"}
         </button>

package/components/admin/nav-builder/NavBuilder.tsx

@@ -220,7 +220,7 @@ export default function NavBuilder({
             className={`px-4 py-1.5 text-[11px] font-medium rounded-lg transition-all ${
               saving || !hasChanges
                 ? "bg-white/40 text-neutral-400 cursor-not-allowed"
-                : "bg-white text-[#076bff] shadow-sm hover:shadow-md"
+                : "bg-white text-[#3580f9] shadow-sm hover:shadow-md"
             }`}
           >
             {saving ? "Saving..." : "Save"}

package/components/admin/nav-builder/NavBuilderGrid.tsx

@@ -87,7 +87,7 @@ function DroppableCell({
     <div ref={setNodeRef} style={{ gridColumn: column, gridRow: 1 }}>
       <NavGridCell column={column} onAddItem={onAddItem} />
       {isDragOver && (
-        <div className="absolute inset-0 rounded-lg ring-2 ring-[#076bff] bg-[#076bff]/10 pointer-events-none" />
+        <div className="absolute inset-0 rounded-lg ring-2 ring-[#3580f9] bg-[#3580f9]/10 pointer-events-none" />
       )}
     </div>
   );
@@ -286,7 +286,7 @@ export default function NavBuilderGrid({
           {/* Helper hints */}
           <div className="mt-4 flex gap-4 text-[10px] text-neutral-400">
             <span>
-              <span className="text-[#076bff]">+</span> Click empty column to add
+              <span className="text-[#3580f9]">+</span> Click empty column to add
             </span>
             <span>
               <span className="text-neutral-500">&#x2807;</span> Drag to move
@@ -301,7 +301,7 @@ export default function NavBuilderGrid({
         <DragOverlay>
           {activeItem ? (
             <div
-              className="h-14 flex items-center px-3 gap-2 rounded-lg ring-2 ring-[#076bff] bg-white shadow-xl"
+              className="h-14 flex items-center px-3 gap-2 rounded-lg ring-2 ring-[#3580f9] bg-white shadow-xl"
               style={{ width: 120, opacity: 0.9 }}
             >
               <div className="text-xs font-mono text-neutral-900 uppercase tracking-wider truncate">

package/components/admin/nav-builder/NavGridCell.tsx

@@ -1,48 +1,48 @@
-"use client";
-
-import { useState } from "react";
-
-interface NavGridCellProps {
-  column: number;
-  onAddItem: (column: number) => void;
-}
-
-export default function NavGridCell({ column, onAddItem }: NavGridCellProps) {
-  const [hovered, setHovered] = useState(false);
-
-  return (
-    <div
-      onMouseEnter={() => setHovered(true)}
-      onMouseLeave={() => setHovered(false)}
-      onClick={(e) => {
-        e.stopPropagation();
-        onAddItem(column);
-      }}
-      className={`h-14 flex items-center justify-center cursor-pointer transition-all rounded-lg border border-dashed ${
-        hovered
-          ? "border-[#076bff]/50 bg-[#076bff]/[0.03]"
-          : "border-neutral-200 bg-transparent"
-      }`}
-      data-nav-cell={column}
-    >
-      <div
-        className={`flex flex-col items-center gap-0.5 transition-all ${
-          hovered ? "text-[#076bff]" : "text-neutral-300"
-        }`}
-        style={{
-          opacity: hovered ? 1 : 0.5,
-          transform: hovered ? "scale(1)" : "scale(0.9)",
-        }}
-      >
-        <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
-          <path
-            d="M8 3v10M3 8h10"
-            stroke="currentColor"
-            strokeWidth="1.5"
-            strokeLinecap="round"
-          />
-        </svg>
-      </div>
-    </div>
-  );
-}
+"use client";
+
+import { useState } from "react";
+
+interface NavGridCellProps {
+  column: number;
+  onAddItem: (column: number) => void;
+}
+
+export default function NavGridCell({ column, onAddItem }: NavGridCellProps) {
+  const [hovered, setHovered] = useState(false);
+
+  return (
+    <div
+      onMouseEnter={() => setHovered(true)}
+      onMouseLeave={() => setHovered(false)}
+      onClick={(e) => {
+        e.stopPropagation();
+        onAddItem(column);
+      }}
+      className={`h-14 flex items-center justify-center cursor-pointer transition-all rounded-lg border border-dashed ${
+        hovered
+          ? "border-[#3580f9]/50 bg-[#3580f9]/[0.03]"
+          : "border-neutral-200 bg-transparent"
+      }`}
+      data-nav-cell={column}
+    >
+      <div
+        className={`flex flex-col items-center gap-0.5 transition-all ${
+          hovered ? "text-[#3580f9]" : "text-neutral-300"
+        }`}
+        style={{
+          opacity: hovered ? 1 : 0.5,
+          transform: hovered ? "scale(1)" : "scale(0.9)",
+        }}
+      >
+        <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
+          <path
+            d="M8 3v10M3 8h10"
+            stroke="currentColor"
+            strokeWidth="1.5"
+            strokeLinecap="round"
+          />
+        </svg>
+      </div>
+    </div>
+  );
+}

package/components/admin/nav-builder/NavGridItem.tsx

@@ -94,7 +94,7 @@ export default function NavGridItem({
       }}
       className={`h-14 relative flex items-center px-3 gap-2 cursor-pointer rounded-lg transition-all border ${
         isSelected
-          ? "border-[#076bff] bg-[#076bff]/5 shadow-sm"
+          ? "border-[#3580f9] bg-[#3580f9]/5 shadow-sm"
           : hovered
           ? "border-neutral-300 bg-neutral-50"
           : "border-neutral-200 bg-white"
@@ -141,7 +141,7 @@ export default function NavGridItem({
         <div
           className="absolute -top-2 -right-2 text-[9px] font-semibold px-1.5 py-0 rounded text-white"
           style={{
-            background: isSelected ? "#076bff" : "#a3a3a3",
+            background: isSelected ? "#3580f9" : "#a3a3a3",
           }}
         >
           {item.column_span}/{TOTAL_COLUMNS}
@@ -175,9 +175,9 @@ export default function NavGridItem({
         className="absolute -right-1 top-1/2 -translate-y-1/2 w-2 h-6 rounded cursor-col-resize transition-all"
         style={{
           background: resizing
-            ? "#076bff"
+            ? "#3580f9"
             : isSelected
-            ? "#076bff"
+            ? "#3580f9"
             : hovered
             ? "#a3a3a3"
             : "transparent",