Merge pull request #2 from burnshall-ui/ios-homescreen-f3bdc

Ios homescreen f3bdc

Author: burnshall-ui

app/layout.tsx

@@ -21,6 +21,22 @@ const orbitron = Orbitron({
 export const metadata: Metadata = {
   title: "ZIMZ – Agent Control",
   description: "ZIMZ: Multi-Agent Dashboard for OpenClaw",
+  manifest: "/manifest.json",
+  icons: {
+    icon: [
+      { url: "/favicon.svg", type: "image/svg+xml" },
+      { url: "/icon-512.png", sizes: "512x512", type: "image/png" },
+    ],
+    apple: "/apple-touch-icon.png",
+  },
+  appleWebApp: {
+    capable: true,
+    title: "ZIMZ",
+    statusBarStyle: "black-translucent",
+  },
+  other: {
+    "mobile-web-app-capable": "yes",
+  },
 };
 
 export default function RootLayout({

public/apple-touch-icon.png

@@ -0,0 +1,23 @@
+{
+  "name": "ZIMZ – Agent Control",
+  "short_name": "ZIMZ",
+  "description": "Multi-Agent Dashboard for OpenClaw",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#030712",
+  "theme_color": "#0891b2",
+  "icons": [
+    {
+      "src": "/icon-512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/apple-touch-icon.png",
+      "sizes": "180x180",
+      "type": "image/png",
+      "purpose": "any"
+    }
+  ]
+}

public/favicon.svg

@@ -547,7 +547,7 @@ export default function TasksView({ agents }: TasksViewProps) {
           exit={{ opacity: 0, y: -8, scale: 0.97 }}
           transition={{ duration: 0.24, ease: "easeOut" }}
         >
-          <div className="relative w-full max-w-2xl rounded-2xl border border-cyan-300/35 bg-slate-950/95 p-6 shadow-[0_14px_50px_rgba(4,12,28,0.85)] backdrop-blur">
+          <div className="relative w-full max-w-2xl rounded-2xl border border-cyan-300/35 bg-slate-950/95 p-4 shadow-[0_14px_50px_rgba(4,12,28,0.85)] backdrop-blur md:p-6">
             <div className="mb-5 flex items-center justify-between">
               <div className="flex items-center gap-2">
                 <CalendarClock className="h-4 w-4 text-cyan-300" />
@@ -580,7 +580,7 @@ export default function TasksView({ agents }: TasksViewProps) {
                 )}
               </label>
 
-              <div className="grid gap-3 md:grid-cols-2">
+              <div className="grid grid-cols-2 gap-3">
                 <label className="block text-xs text-slate-300">
                   Cron Expression
                   <div className="mt-1 flex gap-2">
@@ -635,15 +635,15 @@ export default function TasksView({ agents }: TasksViewProps) {
                 </label>
               </div>
 
-              <div className="grid gap-3 md:grid-cols-3">
+              <div className="grid grid-cols-3 gap-2 md:gap-3">
                 <label className="block text-xs text-slate-300">
                   Session Target
                   <select
                     value={form.sessionTarget}
                     onChange={(event) =>
                       onChange({ sessionTarget: event.target.value as OpenClawSessionTarget })
                     }
-                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-3 py-2 text-sm text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40"
+                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-2 py-2 text-xs text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40 md:px-3 md:text-sm"
                   >
                     <option value="isolated">isolated</option>
                     <option value="main">main</option>
@@ -657,7 +657,7 @@ export default function TasksView({ agents }: TasksViewProps) {
                     onChange={(event) =>
                       onChange({ wakeMode: event.target.value as OpenClawWakeMode })
                     }
-                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-3 py-2 text-sm text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40"
+                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-2 py-2 text-xs text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40 md:px-3 md:text-sm"
                   >
                     <option value="next-heartbeat">next-heartbeat</option>
                     <option value="now">now</option>
@@ -669,7 +669,7 @@ export default function TasksView({ agents }: TasksViewProps) {
                   <select
                     value={form.agentId}
                     onChange={(event) => onChange({ agentId: event.target.value })}
-                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-3 py-2 text-sm text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40"
+                    className="mt-1 w-full rounded-lg border border-slate-700 bg-slate-900/80 px-2 py-2 text-xs text-slate-100 outline-none focus:border-cyan-500/60 focus:ring-1 focus:ring-cyan-500/40 md:px-3 md:text-sm"
                   >
                     {agents.map((agent) => (
                       <option key={agent.id} value={agent.id}>