Skip to content

Size the landing page to the studio composer - #317

Merged
bashybaranaba merged 1 commit into
mainfrom
agent/landing-composer-sizing-main
Aug 23, 2026
Merged

Size the landing page to the studio composer#317
bashybaranaba merged 1 commit into
mainfrom
agent/landing-composer-sizing-main

Conversation

@bashybaranaba

Copy link
Copy Markdown
Member

Fourth round of review notes on the landing page, following #315 / #316.

What changed

The composer matches the in-app one. HeroComposer now tracks ChatInputBox exactly: same rounded-2xl chrome, same border-stone-300, same h-16 input area, same compact rounded-lg icon footer. The box a visitor sees on the way in is the box they get once they are inside.

Both the composer and the carousel take the studio's own measure, max-w-[46rem], the same width app/studio/[tab]/page.tsx gives the launcher. Down from 52rem.

The main view steps down a notch with it: headline 2rem to 1.8rem, card 300px to 276px, headline and body inside the card trimmed to suit the narrower copy pane.

The card's call to action reads "Get started".

The model picker shows a current flagship per provider:

Was Now
OpenAI gpt-5.4-mini GPT-5.5
Anthropic claude-sonnet-4-6 Claude Opus 5
Google gemini-2.0-flash Gemini 3 Pro
Mistral mistral-large-latest Mistral Large

The CLI slide advertises gpt-5.5 to match.

One thing to follow up

The backend model registry at apps/commons-api/src/modules/model-provider/model-registry.ts still lists Claude Opus 4.6 and Gemini 2.5 Pro as its newest Anthropic and Google entries. GPT-5.5 is already there, and the Google provider already branches on gemini-3, but the registry needs Opus 5 and Gemini 3 Pro added for the landing page to match what an agent can actually be set to and priced at. Happy to do that as a separate change.

Verified

tsc --noEmit clean, production build clean. Every slide and all three viewports captured and reviewed from the production build, with no scrolling in either axis:

Viewport scrollW/clientW scrollH/clientH
1440 x 900 1440 / 1440 900 / 900
1280 x 720 1280 / 1280 720 / 720
390 x 844 390 / 390 844 / 844

🤖 Generated with Claude Code

The composer now matches ChatInputBox exactly: same rounded-2xl chrome, same
stone-300 border, same h-16 input area and compact icon footer. The box a
visitor sees on the way in is the box they get once they are inside.

Both the composer and the carousel take the studio's own max-w-[46rem]
measure, down from 52rem, and the headline, card and copy all step down a
notch with them, so the main view reads a little tighter.

The model picker moves to a current flagship per provider: GPT-5.5, Claude
Opus 5, Gemini 3 Pro, Mistral Large. The CLI slide advertises gpt-5.5 to
match. Note that the backend model registry still lists Claude Opus 4.6 and
Gemini 2.5 Pro as its newest Anthropic and Google entries, so it needs the
same update for the page to match what an agent can actually be set to.

The card's call to action reads "Get started".

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
@vercel

vercel Bot commented Aug 23, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
agent-commons Ready Ready Preview Aug 23, 2026 8:09pm
agent-commons-commons-docs Ready Ready Preview Aug 23, 2026 8:09pm
commons-courses Ready Ready Preview Aug 23, 2026 8:09pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant