From 9440946af9e14f207c8661a3152be3fe78d04661 Mon Sep 17 00:00:00 2001 From: Brian O'Kelley Date: Wed, 7 Jan 2026 06:31:54 -0800 Subject: [PATCH] feat: tighten homepage layout and move Go Agentic up MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Remove 3 value prop points from hero section (index.html) - Move Go Agentic section immediately after release banner - Remove gray mission statement band (org-index.html) - Tighten hero padding and typography on both pages - Update Go Agentic prompts to be more actionable - Add focus states for accessibility - Standardize prompt hint styling across both pages 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 --- .changeset/sparkly-camels-dream.md | 4 ++ server/public/index.html | 98 ++++++++++++++++-------------- server/public/org-index.html | 62 +++++++------------ 3 files changed, 76 insertions(+), 88 deletions(-) create mode 100644 .changeset/sparkly-camels-dream.md diff --git a/.changeset/sparkly-camels-dream.md b/.changeset/sparkly-camels-dream.md new file mode 100644 index 0000000000..648b907b34 --- /dev/null +++ b/.changeset/sparkly-camels-dream.md @@ -0,0 +1,4 @@ +--- +--- + +Homepage layout refinement: tightened hero sections, moved Go Agentic section to prominent position after release banner, updated prompts to be more actionable, and removed mission statement band from org-index.html. diff --git a/server/public/index.html b/server/public/index.html index ce42a805c1..b4efab6f1e 100644 --- a/server/public/index.html +++ b/server/public/index.html @@ -253,27 +253,40 @@ background-color: rgba(26, 54, 180, 0.1) !important; } + /* Compact Hero */ + .heroBanner_compact { + padding-top: 3rem; + padding-bottom: 2.5rem; + } + .heroBanner_compact .heroTitle_qg2I { + font-size: 2.25rem; + margin-bottom: 0.75rem; + } + .heroBanner_compact .heroSubtitle_jFu1 { + margin-bottom: 1.5rem; + } + /* Go Agentic Section */ .goAgenticSection_AdCP { - padding: 3rem 0; + padding: 2rem 0; background: white; border-top: 1px solid var(--ifm-color-emphasis-200, #e5e7eb); } .goAgenticCard_AdCP { background: linear-gradient(135deg, var(--color-primary-50, #eef2ff) 0%, var(--color-primary-100, #e0e7ff) 100%); border-radius: 12px; - padding: 2.5rem; + padding: 2rem; text-align: center; } .goAgenticCard_AdCP h3 { - font-size: 1.75rem; + font-size: 1.5rem; margin-bottom: 0.5rem; color: var(--ifm-heading-color); } .goAgenticCard_AdCP .subtitle { - font-size: 1.1rem; + font-size: 1rem; color: var(--ifm-color-emphasis-700); - margin-bottom: 2rem; + margin-bottom: 1.5rem; } .promptHints_AdCP { display: flex; @@ -287,11 +300,11 @@ align-items: center; gap: 0.5rem; background: white; - border: 1px solid var(--ifm-color-emphasis-300, #d1d5db); + border: 1px solid var(--color-border, #d1d5db); border-radius: 24px; - padding: 0.625rem 1.25rem; - font-size: 0.9rem; - color: var(--ifm-color-emphasis-800); + padding: 0.75rem 1.5rem; + font-size: 0.95rem; + color: var(--color-text-heading, #2d3748); text-decoration: none; transition: all 0.2s; cursor: pointer; @@ -300,8 +313,13 @@ background: var(--color-brand, #1a36b4); color: white; border-color: var(--color-brand, #1a36b4); - transform: translateY(-1px); - box-shadow: 0 4px 12px rgba(26, 54, 180, 0.2); + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(26, 54, 180, 0.25); + } + .promptHint_AdCP:focus, + .promptHint_AdCP:focus-visible { + outline: 2px solid var(--color-brand, #1a36b4); + outline-offset: 2px; } .promptHint_AdCP::before { content: '→'; @@ -346,26 +364,12 @@
-
+

AdCP: The Open Standard for Agentic Advertising

From brief to buy, helping agents advertise anywhere: from CTV to chat, from tiny blog to the World Cup.

-
-
-
🎯
-
Built for outcomes
Buy the way you want to grow
-
-
-
🤖
-
Built for agents
Supports MCP and A2A protocols
-
-
-
🌍
-
Built for everyone
A diverse ecosystem of tech and content
-
-
Start Building Test with Addie @@ -388,6 +392,27 @@

AdCP: The Open Standard for Agentic Advertising

+ +
+
+
+
+
+

Go Agentic

+

Tell Addie what you're looking for. She'll help you find the right partners and resources.

+
+ Build a buyer agent for my campaigns + Find a sales agent for my inventory + Set up adagents.json for my site + What can I do with AdCP? +
+

Or browse all members to see what's possible

+
+
+
+
+
+
@@ -445,27 +470,6 @@

Managed by Agentic Advertising

- -
-
-
-
-
-

Go Agentic

-

Tell Addie what you're looking for. She'll help you find the right partners and resources.

-
- Find someone to run a sales agent for me - Help me set up adagents.json - Find publishers I can buy from - Build a buyer agent for my campaigns -
-

Or browse all members to see what's possible

-
-
-
-
-
-
diff --git a/server/public/org-index.html b/server/public/org-index.html index 01e3166fff..a9cdf86b6b 100644 --- a/server/public/org-index.html +++ b/server/public/org-index.html @@ -43,7 +43,7 @@ .hero { background: linear-gradient(135deg, var(--color-brand) 0%, var(--color-primary-500) 100%); color: white; - padding: 5rem 2rem 4rem; + padding: 3.5rem 2rem 3rem; text-align: center; position: relative; overflow: hidden; @@ -69,23 +69,23 @@ z-index: 1; } .hero-logo { - margin-bottom: 2rem; + margin-bottom: 1.25rem; } .aao-logo { - height: 80px; + height: 64px; width: auto; filter: drop-shadow(0 4px 12px rgba(0,0,0,0.15)); } .hero h1 { - font-size: 2.75rem; + font-size: 2.5rem; font-weight: 700; - margin-bottom: 1.25rem; + margin-bottom: 1rem; line-height: 1.15; } .hero-subtitle { - font-size: 1.25rem; + font-size: 1.15rem; opacity: 0.95; - margin-bottom: 2.5rem; + margin-bottom: 2rem; line-height: 1.6; max-width: 600px; margin-left: auto; @@ -125,22 +125,6 @@ border-color: white; } - /* Mission Statement */ - .mission { - padding: 4rem 2rem; - background: var(--color-bg-subtle); - text-align: center; - } - .mission-container { - max-width: 700px; - margin: 0 auto; - } - .mission p { - font-size: 1.25rem; - color: var(--color-text-heading); - line-height: 1.8; - } - /* Projects Section */ .projects { padding: 5rem 2rem; @@ -300,7 +284,7 @@ /* Go Agentic Section */ .go-agentic { - padding: 4rem 2rem; + padding: 2.5rem 2rem; background: linear-gradient(135deg, var(--color-primary-50, #eef2ff) 0%, var(--color-primary-100, #e0e7ff) 100%); } .go-agentic-container { @@ -309,15 +293,15 @@ text-align: center; } .go-agentic h2 { - font-size: 2rem; + font-size: 1.5rem; font-weight: 700; color: var(--color-text-heading); - margin-bottom: 0.75rem; + margin-bottom: 0.5rem; } .go-agentic-subtitle { - font-size: 1.15rem; + font-size: 1rem; color: var(--color-text-muted); - margin-bottom: 2rem; + margin-bottom: 1.5rem; } .prompt-hints { display: flex; @@ -347,6 +331,11 @@ transform: translateY(-2px); box-shadow: 0 4px 12px rgba(26, 54, 180, 0.25); } + .prompt-hint:focus, + .prompt-hint:focus-visible { + outline: 2px solid var(--color-brand); + outline-offset: 2px; + } .prompt-hint::before { content: '→'; font-weight: bold; @@ -365,7 +354,7 @@ } @media (max-width: 768px) { .go-agentic { - padding: 3rem 1.5rem; + padding: 2rem 1.5rem; } .prompt-hints { flex-direction: column; @@ -454,25 +443,16 @@

Advancing AI-Powered Advertising Together

- -
-
-

- We bring together brands, agencies, publishers, and technology providers to ensure AI advertising develops as shared infrastructure that benefits the entire ecosystem. -

-
-
-

Go Agentic

Tell Addie what you're looking for. She'll help you find the right partners and resources.

- Find someone to run a sales agent for me - Help me set up adagents.json - Find publishers I can buy from Build a buyer agent for my campaigns + Find a sales agent for my inventory + Set up adagents.json for my site + What can I do with AdCP?

Or browse all members to see what's possible