Skip to content

Refine Flows headline typography and workflow copy #70

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
willwashburn merged 3 commits into from
Sep 14, 2026
Merged

Refine Flows headline typography and workflow copy #70

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
c86116c
Refine Flows headline typography and workflow copy
willwashburn Sep 14, 2026
96c99e9
Keep Flows navigation sticky while scrolling
willwashburn Sep 14, 2026
89cbab5
Show Docs and Blog links in Flows navigation
willwashburn Sep 14, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 7 additions & 4 deletions web/app/flows/flows.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@
--flows-band-dark: #0b1c2a;
--flows-band-deep: #081723;
min-height: 100vh;
overflow-x: hidden;
/* Clip decoration without creating a scroll container for the sticky nav. */
overflow-x: clip;
background: linear-gradient(180deg, #10273a 0%, #0d2638 38%, #0b1c2a 100%);
color: var(--flows-text);
}
Expand Down Expand Up @@ -88,9 +89,11 @@

.hero h1 {
max-width: 22ch;
font-size: clamp(2.25rem, 4.5vw, 3.8rem);
line-height: 1.12;
letter-spacing: -0.035em;
font-size: clamp(2.25rem, 4.5vw, 4.2rem);
font-weight: 500;
line-height: 1.05;
letter-spacing: -0.03em;
opacity: 1;
}

.headlineLine {
Expand Down
6 changes: 3 additions & 3 deletions web/app/flows/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ export default function FlowsPage() {

return (
<div className={s.page}>
<SiteNav actions={navGetStartedLink} mobileMenuContent={mobileGetStartedLink} hideLinks />
<SiteNav actions={navGetStartedLink} mobileMenuContent={mobileGetStartedLink} />

<main className={s.main}>
<section className={s.hero}>
Expand Down Expand Up @@ -147,9 +147,9 @@ export default function FlowsPage() {

<WaveBreak />

<section className={s.workflowSection} aria-label="Skills make suggestions. Flows enforce steps.">
<section className={s.workflowSection} aria-label="Agents can ignore instructions. Flows can’t.">
<MessagingFeature
title="Skills make suggestions. Flows enforce steps."
title={<>Agents can ignore instructions.<br />Flows can’t.</>}
preview={<FlowGatePreview />}
items={[
'Require files, run scripts, and check results before the next step starts.',
Expand Down
2 changes: 1 addition & 1 deletion web/components/home/MessagingFeature.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export function MessagingFeature({
items = DEFAULT_ITEMS,
description,
preview,
}: { title?: string; items?: readonly string[]; description?: string; preview?: ReactNode } = {}) {
}: { title?: ReactNode; items?: readonly string[]; description?: string; preview?: ReactNode } = {}) {
return (
<FadeIn direction="up" delay={0} className={`${s.featureCol} ${s.messagingFeature}`}>
<div className={s.featurePreview}>
Expand Down
Loading