mop-agent 0.1.4 → 0.1.5

package/apps/web/app/layout.tsx

@@ -1,8 +1,10 @@
 import type { ReactNode } from "react";
+import "./globals.css";
 
 export const metadata = {
   title: "MOP-AGENT",
   description: "Self-hosted AI assistant with persistent, cross-project memory.",
+  icons: { icon: "/icon.svg" },
 };
 
 export default function RootLayout({ children }: { children: ReactNode }) {
@@ -13,8 +15,8 @@ export default function RootLayout({ children }: { children: ReactNode }) {
           margin: 0,
           fontFamily:
             "ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif",
-          background: "#0b0f17",
-          color: "#e6edf3",
+          background: "#fef9e1",
+          color: "#2d4a3e",
         }}
       >
         {children}

package/apps/web/app/settings/page.tsx

@@ -33,10 +33,10 @@ export default function SettingsPage() {
 
   return (
     <main style={{ maxWidth: 520, margin: "0 auto", padding: "48px 24px" }}>
-      <a href="/assistant" style={{ color: "#7aa2ff" }}>← Assistant</a>
+      <a href="/assistant" style={{ color: "#742220" }}>← Assistant</a>
       <h1 style={{ fontSize: 24 }}>⚙️ Provider settings</h1>
 
-      <div style={{ border: "1px solid #1f2a3a", borderRadius: 8, padding: 14, margin: "12px 0", opacity: 0.9 }}>
+      <div style={{ border: "1px solid rgba(45,74,62,.28)", borderRadius: 8, padding: 14, margin: "12px 0", opacity: 0.9, background: "#fffdf2" }}>
         {config.configured
           ? <>Active: <strong>{config.provider}</strong>{config.model ? ` · ${config.model}` : ""} · key {config.keyHint}</>
           : "No provider key saved yet — chat uses the offline echo provider."}
@@ -59,5 +59,5 @@ export default function SettingsPage() {
   );
 }
 
-const inp: React.CSSProperties = { padding: "10px 12px", borderRadius: 8, border: "1px solid #1f2a3a", background: "#111824", color: "#e6edf3" };
-const btn: React.CSSProperties = { padding: "10px 12px", borderRadius: 8, border: "1px solid #2b5cff", background: "#2b5cff", color: "white", cursor: "pointer" };
+const inp: React.CSSProperties = { padding: "10px 12px", borderRadius: 8, border: "1px solid rgba(45,74,62,.32)", background: "#fffdf2", color: "#2d4a3e" };
+const btn: React.CSSProperties = { padding: "10px 12px", borderRadius: 8, border: "1px solid #742220", background: "#742220", color: "#fef9e1", cursor: "pointer" };

package/apps/web/app/setup/page.tsx

@@ -13,12 +13,10 @@ export default function SetupPage() {
   const [mode, setMode] = useState<"signup" | "signin">("signup");
 
   useEffect(() => {
-    Promise.all([
-      fetch("/api/setup/status").then((r) => r.json()) as Promise<{ ownerExists: boolean }>,
-      fetch("/api/me"),
-    ])
-      .then(([status, me]) => {
-        if (me.ok) {
+    fetch("/api/setup/status")
+      .then((r) => r.json() as Promise<{ ownerExists: boolean; authenticated: boolean }>)
+      .then((status) => {
+        if (status.authenticated) {
           window.location.replace("/assistant");
           return;
         }
@@ -57,10 +55,12 @@ export default function SetupPage() {
   const loading = ownerExists === null && !msg;
 
   return (
-    <main style={shell}>
-      <section style={brandPanel} aria-hidden="true" />
+    <main className="mop-setup-shell" style={shell}>
+      <section className="mop-setup-brand" style={brandPanel}>
+        <img src="/icon.svg" alt="MOP-AGENT" style={heroLogo} />
+      </section>
 
-      <section style={formWrap}>
+      <section className="mop-setup-form" style={formWrap}>
         <div style={formCard}>
           <p style={eyebrow}>{mode === "signup" ? "FIRST-RUN SETUP" : "WELCOME BACK"}</p>
           <h2 style={{ fontSize: 27, margin: "8px 0" }}>
@@ -91,7 +91,7 @@ export default function SetupPage() {
             </form>
           )}
 
-          {msg && <p role="alert" style={{ marginTop: 16, color: "#ff9b9b" }}>{msg}</p>}
+          {msg && <p role="alert" style={{ marginTop: 16, color: "#742220" }}>{msg}</p>}
 
           {!loading && (
             <p style={{ marginTop: 22, fontSize: 13, color: "#7f8da2" }}>
@@ -107,12 +107,13 @@ export default function SetupPage() {
   );
 }
 
-const shell: React.CSSProperties = { minHeight: "100vh", display: "grid", gridTemplateColumns: "minmax(0, 1.25fr) minmax(380px, .75fr)", background: "radial-gradient(circle at 18% 12%, #17233c 0, #0b0f17 36%, #080b11 100%)" };
-const brandPanel: React.CSSProperties = { padding: "clamp(48px, 8vw, 110px)", display: "flex", flexDirection: "column", justifyContent: "center" };
-const formWrap: React.CSSProperties = { display: "flex", alignItems: "center", justifyContent: "center", padding: 28, background: "rgba(5, 8, 13, .58)", borderLeft: "1px solid #1b2637" };
-const formCard: React.CSSProperties = { width: "min(100%, 430px)", padding: "38px 34px", border: "1px solid #243149", borderRadius: 18, background: "rgba(13, 19, 30, .94)", boxShadow: "0 24px 80px rgba(0,0,0,.35)" };
-const eyebrow: React.CSSProperties = { margin: "20px 0 0", color: "#7d9dff", fontSize: 12, fontWeight: 800, letterSpacing: ".16em" };
-const label: React.CSSProperties = { display: "grid", gap: 7, color: "#bac6d8", fontSize: 13, fontWeight: 650 };
-const inputStyle: React.CSSProperties = { padding: "12px 13px", borderRadius: 9, border: "1px solid #2a3951", outline: "none", background: "#0c121d", color: "#eef3fa", fontSize: 15 };
-const buttonStyle: React.CSSProperties = { marginTop: 4, padding: "12px 14px", borderRadius: 9, border: "1px solid #5278ff", background: "linear-gradient(135deg, #416cff, #6d54e8)", color: "white", fontWeight: 750, fontSize: 15, cursor: "pointer" };
-const textButton: React.CSSProperties = { padding: 0, border: 0, background: "none", color: "#85a1ff", cursor: "pointer" };
+const shell: React.CSSProperties = { minHeight: "100vh", display: "grid", gridTemplateColumns: "minmax(0, 1.25fr) minmax(380px, .75fr)", background: "#fef9e1" };
+const brandPanel: React.CSSProperties = { padding: "clamp(48px, 8vw, 110px)", display: "flex", alignItems: "center", justifyContent: "center", overflow: "hidden", background: "radial-gradient(circle at 50% 45%, #49685c 0, #2d4a3e 58%, #21382f 100%)" };
+const heroLogo: React.CSSProperties = { display: "block", width: "min(72%, 560px)", height: "auto", maxHeight: "72vh", objectFit: "contain", filter: "drop-shadow(0 24px 34px rgba(0,0,0,.28))" };
+const formWrap: React.CSSProperties = { display: "flex", alignItems: "center", justifyContent: "center", padding: 28, background: "#fef9e1", borderLeft: "1px solid #2d4a3e" };
+const formCard: React.CSSProperties = { width: "min(100%, 430px)", padding: "38px 34px", border: "1px solid rgba(45,74,62,.45)", borderRadius: 18, background: "#fffdf2", boxShadow: "0 24px 70px rgba(45,74,62,.14)" };
+const eyebrow: React.CSSProperties = { margin: "20px 0 0", color: "#742220", fontSize: 12, fontWeight: 800, letterSpacing: ".16em" };
+const label: React.CSSProperties = { display: "grid", gap: 7, color: "#2d4a3e", fontSize: 13, fontWeight: 650 };
+const inputStyle: React.CSSProperties = { padding: "12px 13px", borderRadius: 9, border: "1px solid rgba(45,74,62,.42)", outline: "none", background: "#fef9e1", color: "#2d4a3e", fontSize: 15 };
+const buttonStyle: React.CSSProperties = { marginTop: 4, padding: "12px 14px", borderRadius: 9, border: "1px solid #742220", background: "#742220", color: "#fef9e1", fontWeight: 750, fontSize: 15, cursor: "pointer" };
+const textButton: React.CSSProperties = { padding: 0, border: 0, background: "none", color: "#742220", cursor: "pointer" };

package/apps/web/app/team/page.tsx

@@ -39,7 +39,7 @@ export default function TeamPage() {
 
   return (
     <main style={{ maxWidth: 640, margin: "0 auto", padding: "40px 24px" }}>
-      <a href="/brain" style={{ color: "#7aa2ff" }}>← Brain</a>
+      <a href="/brain" style={{ color: "#742220" }}>← Brain</a>
       <h1 style={{ fontSize: 24 }}>👥 Team</h1>
       <p style={{ opacity: 0.7 }}>You are <strong>{me?.user.email}</strong> · role <strong>{me?.role}</strong></p>
 
@@ -69,7 +69,7 @@ export default function TeamPage() {
             {invites.filter((i) => !i.usedAt).map((i) => (
               <li key={i.email} style={row}>
                 ✉️ {i.email} <span style={{ opacity: 0.5 }}>· {i.role}</span>
-                <button onClick={() => revoke(i.email)} style={{ float: "right", ...btn, background: "#7f1a1a", borderColor: "#7f1a1a", padding: "2px 10px" }}>revoke</button>
+                <button onClick={() => revoke(i.email)} style={{ float: "right", ...btn, background: "#742220", borderColor: "#742220", padding: "2px 10px" }}>revoke</button>
               </li>
             ))}
             {invites.filter((i) => !i.usedAt).length === 0 && <p style={{ opacity: 0.5 }}>None.</p>}
@@ -81,6 +81,6 @@ export default function TeamPage() {
   );
 }
 
-const row: React.CSSProperties = { border: "1px solid #1f2a3a", borderRadius: 8, padding: "8px 12px", marginBottom: 6 };
-const inp: React.CSSProperties = { padding: "8px 10px", borderRadius: 8, border: "1px solid #1f2a3a", background: "#111824", color: "#e6edf3" };
-const btn: React.CSSProperties = { padding: "8px 14px", borderRadius: 8, border: "1px solid #2b5cff", background: "#2b5cff", color: "white", cursor: "pointer" };
+const row: React.CSSProperties = { border: "1px solid rgba(45,74,62,.28)", borderRadius: 8, padding: "8px 12px", marginBottom: 6, background: "#fffdf2" };
+const inp: React.CSSProperties = { padding: "8px 10px", borderRadius: 8, border: "1px solid rgba(45,74,62,.32)", background: "#fffdf2", color: "#2d4a3e" };
+const btn: React.CSSProperties = { padding: "8px 14px", borderRadius: 8, border: "1px solid #742220", background: "#742220", color: "#fef9e1", cursor: "pointer" };

package/npm-shrinkwrap.json

@@ -1,12 +1,12 @@
 {
   "name": "mop-agent",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "mop-agent",
-      "version": "0.1.4",
+      "version": "0.1.5",
       "license": "UNLICENSED",
       "workspaces": [
         "packages/*",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mop-agent",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Self-hosted AI assistant with persistent cross-project memory, installed with npx mop-agent.",
   "author": "BURHANDEV ENTERPRISE",
   "license": "UNLICENSED",