diff --git a/site/src/landing/app.jsx b/site/src/landing/app.jsx index 168464db..c02d3de8 100644 --- a/site/src/landing/app.jsx +++ b/site/src/landing/app.jsx @@ -2,7 +2,7 @@ import { CixAscii } from '../shared/ascii.jsx'; import { Foot } from '../shared/foot.jsx'; import { SERVER_VERSION, CLI_VERSION, GITHUB_URL } from '../shared/versions.js'; import { HeroTerminal } from './terminal.jsx'; -import { Why, Features, Playground, Workspaces, Agent, CaseStudy, QuickStart, FAQ } from './sections.jsx'; +import { Fit, Why, Features, Playground, Workspaces, Agent, CaseStudy, QuickStart, FAQ } from './sections.jsx'; export function App() { return ( @@ -11,6 +11,7 @@ export function App() {
+ diff --git a/site/src/landing/sections.jsx b/site/src/landing/sections.jsx index cc103731..f7447ce6 100644 --- a/site/src/landing/sections.jsx +++ b/site/src/landing/sections.jsx @@ -3,6 +3,44 @@ import { WorkspaceDemo } from './workspace-demo.jsx'; import { GITHUB_URL, PLUGIN_VERSION } from '../shared/versions.js'; import { TeamDiagram } from '../shared/team-diagram.jsx'; +const FIT = [ + { title: 'Your agent should already know the codebase.', + body: <>No pasted file paths, no “read these first”. Hooks nudge Claude toward the index and the skills teach it the five search modes — context arrives with the question instead of after three rounds of prompting. }, + { title: 'You research code you didn’t write.', + body: <>Large, unfamiliar, half-remembered — the kind of repo where nobody agrees what a thing is called. Ask in plain language, get ranked file:line answers back. }, + { title: 'You are writing the spec before the code.', + body: <>Scoping work means knowing what already exists, where the new thing plugs in and what it breaks. Find the touchpoints, walk the references, and write the ticket against the codebase instead of against memory. }, + { title: 'You are doing a security pass.', + body: <>cix does not scan for CVEs — it finds everything worth scanning. Where input is parsed, where secrets are read, which callsites actually reach the function you are worried about. }, + { title: 'Your system is a dozen services in a dozen repos.', + body: <>Group them into a workspace and search the union: hybrid BM25 + dense ranking surfaces the services involved, then defs and refs drill into the one that owns the answer. }, + { title: 'Your team is spread out. So are its agents.', + body: <>One shared server rather than a per-seat sidecar: the same index for every developer, terminal and agent, with roles, view-groups and per-user API keys deciding who sees what. }, +]; + +export function Fit() { + return ( +
+
+
+ Who it's for +

If any of this is your week,
cix was built for it.

+

Six situations it was made for — and one server behind all of them.

+
+
+ {FIT.map(({ title, body }) => ( +
+ +

{title}

+

{body}

+
+ ))} +
+
+
+ ); +} + export function Why() { return (
diff --git a/site/src/styles.css b/site/src/styles.css index 4f633c97..f5604af0 100644 --- a/site/src/styles.css +++ b/site/src/styles.css @@ -681,6 +681,20 @@ h3 { font-size: clamp(20px, 2vw, 24px); } .why-card h3 { font-size: 22px; margin-bottom: 8px; } .why-card p { color: var(--ink-soft); margin: 0; font-size: 15px; } +/* Who it's for — same grid as Why, quieter marker so the two sections + don't read as one long numbered list. */ +.fit-card { padding: 28px; } +.fit-card .mark { + font-family: var(--font-display); + font-size: 30px; + color: var(--red); + line-height: 1; + display: block; + margin-bottom: 12px; +} +.fit-card h3 { font-size: 20px; margin-bottom: 8px; } +.fit-card p { color: var(--ink-soft); margin: 0; font-size: 15px; } + /* Features grid */ .feat-grid { display: grid;