From a42d3857a921e1c128a1362ec3d2ca1806630c8b Mon Sep 17 00:00:00 2001 From: Bharath Mohan <2254476+bharathm03@users.noreply.github.com> Date: Thu, 3 Sep 2026 13:46:41 +0800 Subject: [PATCH] Site: drop Mac App Store badge, add Antigravity/Kilo Code marks (#86) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Site: drop the Mac App Store badge — the app can't run sandboxed The macOS App Store requires the app sandbox entitlement; antgrid's process/PTY spawning and filesystem access can't run inside it. The iOS App Store and Google Play badges stay, since those apps ship as mobile companions, not the desktop agent. * Site: give Antigravity and Kilo Code their own marks Neither ships in the installed simple-icons set, so both fell back to the single-letter placeholder chip. Added their marks as local astro-icon SVGs (MIT-licensed, from lobehub/lobe-icons) alongside the seven pulled from simple-icons. * Site: give every agent mark its brand color, drop the Handler-supervision split Most of the roster's brands are officially black wordmarks, so only Claude Code, Mistral and Antigravity actually gain a hue here — the rest fall back to the same neutral they always used. Antigravity now uses the real thesvg-color mark (a soft gradient inside the flame silhouette) instead of the flat lobehub glyph, which read as a stray tile against the rest of the row. Dropped the supervised/unsupervised split and its dot marker — this row no longer needs to carry which three agents Handler drives; that distinction belongs wherever Handler itself gets explained, not here. * Site: drop the stray flex/line-height style from the local icon SVGs Copied verbatim from lobehub's React wrapper markup; it does nothing for a plain inlined SVG here and astro-icon's sanitizer strips it on every load, logging a warning each time. * Site: fix Antigravity's mark filling only a corner of its box The thesvg-color flame silhouette's mask only covers a ~15.6x14.4 sub-region of the nominal 24x24 viewBox, so at the row's icon size it rendered small and shifted toward the top-left next to full-bleed siblings. Tightened the viewBox to the mask's actual content bounds (measured via getBBox) so it fills its chip like every other mark. * Site: stop letterboxing Claude Code and Mistral's landscape marks Both logos are wider than tall (24x15 and 24x17.1 in their native viewBox) but were forced into the same square 14x14 slot as the square marks, padding them small. Pulled them in as local icons with a tightened viewBox and let them render at their natural aspect ratio instead of a fixed square. * Site: actually pin the drawer footer and command tray to the window edge The prior fix added mt-auto to the drawer's sign-in row, but .appwin-rail's display:block media-query rule lives outside any @layer, so it silently outranked Rail.astro's own flex/flex-col utility classes (those sit in Tailwind's layered utilities) and flattened the column back to block, making mt-auto inert. Switched the rule to display:flex. The agent pane's test/lint tray had the same symptom for a different reason: nothing made the pane a flex column at all, so it just sat under the transcript with the grid row's leftover height as dead space beneath it. Made the pane a flex column with the transcript taking flex-1, so the tray sits flush at the bottom like the drawer's footer. --- site/astro.config.mjs | 9 ++- site/src/components/sections/ClosingCta.astro | 1 - site/src/components/sections/Compat.astro | 73 +++++-------------- site/src/components/shell/AgentPane.astro | 8 +- site/src/icons/antigravity-color.svg | 1 + site/src/icons/claudecode.svg | 1 + site/src/icons/kilocode.svg | 1 + site/src/icons/mistralai.svg | 1 + site/src/styles/global.css | 6 +- 9 files changed, 38 insertions(+), 63 deletions(-) create mode 100644 site/src/icons/antigravity-color.svg create mode 100644 site/src/icons/claudecode.svg create mode 100644 site/src/icons/kilocode.svg create mode 100644 site/src/icons/mistralai.svg diff --git a/site/astro.config.mjs b/site/astro.config.mjs index 2c9a4e72..39dd662d 100644 --- a/site/astro.config.mjs +++ b/site/astro.config.mjs @@ -84,18 +84,19 @@ export default defineConfig({ integrations: [ // simple-icons is named explicitly because astro-icon otherwise assigns an // installed collection `["*"]` and inlines the whole pack into the build's - // virtual module — 3,700 icons and ~4.7MB of source, to draw seven brand - // marks in Compat.astro. Collections left unnamed (tabler) keep `*`. + // virtual module — 3,700 icons and ~4.7MB of source, to draw five brand + // marks in Compat.astro. (Claude Code and Mistral AI moved to src/icons/ + // with a tightened viewBox — the simple-icons originals letterbox short of + // the full 24x24, so they render smaller than their siblings.) Collections + // left unnamed (tabler) keep `*`. icon({ include: { "simple-icons": [ - "claudecode", "openai", "opencode", "cursor", "githubcopilot", "kimi", - "mistralai", ], }, }), diff --git a/site/src/components/sections/ClosingCta.astro b/site/src/components/sections/ClosingCta.astro index 5097d81d..04c84486 100644 --- a/site/src/components/sections/ClosingCta.astro +++ b/site/src/components/sections/ClosingCta.astro @@ -8,7 +8,6 @@ import { BETA_FREE, FREE_WORKERS, PRO_WORKERS, YEARLY_OFFER_USD } from "../../da const stores = [ { icon: "tabler:brand-apple", label: "App Store" }, { icon: "tabler:brand-google-play", label: "Google Play" }, - { icon: "tabler:brand-apple", label: "Mac App Store" }, ]; ---
diff --git a/site/src/components/sections/Compat.astro b/site/src/components/sections/Compat.astro index e51f2e7f..bf86f8ec 100644 --- a/site/src/components/sections/Compat.astro +++ b/site/src/components/sections/Compat.astro @@ -3,72 +3,39 @@ import { Icon } from "astro-icon/components"; import Chip from "../ui/Chip.astro"; import Eyebrow from "../ui/Eyebrow.astro"; -// Keep in lockstep with bridge/src/agents/registry.ts. `handler: true` is what -// `handlerObservable` answers true for — a terminal session needs the agent's -// integration to POST /handler-event, a chat session needs a driver, and only -// these three clear either bar. -// -// They are also the only three that get signal. In this palette the accent means -// the system is doing something (see .live-cells in global.css, and the note in -// Eyebrow.astro on why section labels gave the colour up), so a row where all -// ten marks glow would promise the paid feature to six agents that cannot run -// it. The sentence below names the three in words too: colour reinforces here, -// it never carries alone. const agents = [ - { name: "Claude Code", icon: "simple-icons:claudecode", handler: true }, - { name: "Codex", icon: "simple-icons:openai", handler: true }, - { name: "opencode", icon: "simple-icons:opencode", handler: true }, + { name: "Claude Code", icon: "claudecode", color: "#D97757", w: 22 }, + { name: "Codex", icon: "simple-icons:openai" }, + { name: "opencode", icon: "simple-icons:opencode" }, { name: "Cursor", icon: "simple-icons:cursor" }, { name: "GitHub Copilot", icon: "simple-icons:githubcopilot" }, - { name: "Antigravity" }, - { name: "Kilo" }, + { name: "Antigravity", icon: "antigravity-color" }, + { name: "Kilo", icon: "kilocode" }, { name: "Kimi", icon: "simple-icons:kimi" }, - { name: "Mistral Vibe", icon: "simple-icons:mistralai" }, + { name: "Mistral Vibe", icon: "mistralai", color: "#FA520F", w: 20 }, ]; - -// Two rows rather than one that wraps: the chips are ~100px wider than the shell -// at every desktop width, so a single flex row breaks 9 + 1 and strands the -// dashed chip alone on the second line. Splitting on the distinction the row -// already encodes costs no words and fixes the orphan. -const supervised = agents.filter((a) => a.handler); -const unsupervised = agents.filter((a) => !a.handler); - -// Built from the same array the chips are, so the sentence cannot go on naming -// three while a fourth chip lights up. -const supervisedNames = supervised.map((a) => a.name); ---
The agent you already run -
-
- {supervised.map((a) => ( - - {a.icon - ? - : } - {a.name} - - ))} -
-
- {unsupervised.map((a) => ( - - {a.icon - ? - : } - {a.name} - - ))} - any terminal agent -
+
+ {agents.map((a) => ( + + {a.icon + ? /* w overrides the default square slot for marks whose real + aspect ratio is landscape (Claude Code, Mistral) — forcing + those into 14x14 just letterboxes them small again. */ + + : } + {a.name} + + ))} + any terminal agent

- Handler supervises {supervisedNames.map((name, i) => ( - <>{i === 0 ? "" : i === supervisedNames.length - 1 ? " and " : ", "}{name} - ))} today. Every other agent runs as a named session — terminal, files, git and alerts. + Run any of them through antgrid — terminal, files, git and alerts, no workflow change.

diff --git a/site/src/components/shell/AgentPane.astro b/site/src/components/shell/AgentPane.astro index 12a8b4c6..d1484840 100644 --- a/site/src/components/shell/AgentPane.astro +++ b/site/src/components/shell/AgentPane.astro @@ -27,8 +27,8 @@ const trail = [ { call: "Write(tests/checkout.test.ts)", result: "41 lines" }, ]; --- -
-
+
+