feat: PURO AI landing + auth + docs redesign #1

Merged

purovps merged 20 commits from feat/design-landing-auth into main 2026-04-19 13:58:25 +00:00

Conversation 0 Commits 20 Files Changed 31 +13336 -64

purovps commented 2026-04-19 13:57:23 +00:00

Owner

Copy Link

Implements docs/superpowers/specs/2026-04-19-puro-ai-landing-auth-design.md

Plan: docs/superpowers/plans/2026-04-19-puro-ai-landing-auth.md

Scope (path B):

• Landing page at / (anonymous) with 6 sections + responsive nav/footer
• Split-layout Login and Register (PURO narrative on left, form on right)
• Public /docs page (curl + Codex + Claude Code examples)
• puro.css design system scoped to .puro-page, no conflict with admin styling

Not touched: admin pages, backend, auth logic (OAuth/Turnstile/2FA all preserved).

20 commits across Tasks 1-12 (subagent-driven-development).

Implements docs/superpowers/specs/2026-04-19-puro-ai-landing-auth-design.md Plan: docs/superpowers/plans/2026-04-19-puro-ai-landing-auth.md Scope (path B): - Landing page at `/` (anonymous) with 6 sections + responsive nav/footer - Split-layout Login and Register (PURO narrative on left, form on right) - Public /docs page (curl + Codex + Claude Code examples) - puro.css design system scoped to `.puro-page`, no conflict with admin styling Not touched: admin pages, backend, auth logic (OAuth/Turnstile/2FA all preserved). 20 commits across Tasks 1-12 (subagent-driven-development).

purovps added 20 commits 2026-04-19 13:57:23 +00:00

docs: PURO AI landing+auth redesign spec [CI SKIP] ... 332d46cde7

Stage 1 brainstorm 产出：
- 风格方向：暗黑科技（cyan/purple on slate-950）
- Landing 6 sections + 完整中文文案
- Auth 左右分栏 + "5→1" 数字对比叙事
- 给 claude.ai/design 的 brief（可直接复制）
- Stage 3 实施约束（Vue 3 + Tailwind + i18n 对齐）

下一步：user 拿 brief 到 claude.ai/design 出视觉稿（Stage 2）。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

docs: spec v2 + design drafts archive [CI SKIP] ... 02173c8d7e

Stage 2 完成（Claude Design 产出 10 页）后的 spec 更新：
- 范围决策：路径 B 分层交付（本期做 Landing/Login/Register/Docs 4 页 + puro.css 落地；二期换皮 Dashboard/API Keys；不做 Binding/Pricing）
- Landing 文案精修：剔除 Pricing/FAQ/CTA banner；Hero CTA 改「登录」+「联系咨询」；微文案对齐真实能力
- Footer 删掉「套餐（暂隐）」
- 新增 §4.5 Docs 页（公开 /docs，精简版）
- §5 brief 标记为历史存档（Stage 2 已完成）
- §5.5 Stage 2 产出清单（10 个文件 + 本期用/二期/不做）
- 归档 docs/design-drafts/v2/ 全部产出（含 puro.css、HANDOFF.md、10 个 HTML）

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

docs: archive Claude Design v2 output [CI SKIP] ... 3a16b3ecde

10 HTML pages + puro.css + HANDOFF.md + 2 images (~810KB total).
Reference artifacts for Stage 3 Vue 3 translation.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

docs: implementation plan for PURO AI landing+auth [CI SKIP] ... d941550bf6

13 tasks, ~4-6 hours total work. Each task has concrete file paths,
full code blocks, verification steps. Scope: Landing + AuthLayout split
+ LoginView/RegisterView restyle + public Docs + puro.css design system.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(design): scaffold PURO AI design system ... 1d7e75b82e

- Add puro.css (tokens + primitives) as global stylesheet
- Load Inter + JetBrains Mono via Google Fonts
- Extend tailwind.config with puro.* color namespace (no conflict with legacy primary/accent palettes)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(design): scope puro.css to .puro-page container ... 41664efede

Code review flagged two critical issues with the initial scaffold:
- html/body bg + universal reset applied globally, overriding admin Tailwind styles
- Shared class names (.btn, .card, .input, .badge, .divider) collided with style.css,
  breaking 25+ admin views

Fix: all non-:root rules now scoped under .puro-page descendant selector.
@keyframes and global box-sizing preserved. html/body props merged into .puro-page root.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(design): scope .bg-glow::before selector to .puro-page ... 064a4b7614

One missed prefix from the automated transform. Aligns with the
scoping contract established in 41664efe.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): LandingView scaffold with Nav + Hero ... 9dae8724e3

Temporary route /landing-preview added for dev iteration. Will flip /
to this view once all 6 sections are in place (Task 6).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): add Models wall + Features sections ... cfcdd988db

- Added Models section (② 模型墙) with 5 platform cards (Claude, GPT, Codex, Gemini, More)
- Added Features section (③ 三特性) with 3 feature cards (unified key, account pool failover, analytics dashboard)
- Implemented responsive grid layouts with scoped CSS rules
- Used existing design tokens and brand colors from puro.css

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(landing): resolve Task 3 CSS specificity issues ... 158f2a8d53

Code review flagged:
- .feature.card caused padding/background specificity race;
  .feature already defines all card properties, so drop .card
- model-card flex row misaligned name/meta (should stack in column);
  wrap in div to get dot | [name/meta] layout
- .container and .section-* scoped rules silently shadow puro.css defaults;
  add comment explaining intentional override

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): add Code Demo + Dashboard mockup sections ... c099cd5d97

Dashboard mockup is pure static (SVG chart + stats grid + log table).
No backend dependency. Reuses puro.css .log-table / .provider / .status-*
(scoped to .puro-page). Only adds component-local styles for .code-demo,
.dash-mock, .stat-row, .chart-card and friends.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): Footer + sticky Nav styles ... 4e675d70c1

- 4-column footer (brand/产品/资源/联系), responsive 2-col on mobile
- Nav sticky with blur background, border-bottom
- nav-links hidden on mobile (<640px)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(landing): Polish items from code review ... 4832534232

- Add noreferrer to all external rel attributes (4 anchors)
- Change 更新日志 link from /releases (may 404) to /commits/branch/main
- Remove dead CSS overridden by puro.css: .nav z-index:10, .nav-links gap:20px
- Document puro.css global dependency at top of scoped style block

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(router): mount Landing at / with auth-aware redirect ... 284b5129ac

- / (anonymous) → LandingView
- / (authenticated) → redirects to /dashboard via new meta.redirectIfAuth
- Remove temporary /landing-preview route (Task 2 helper)
- RouteMeta TS augmentation for redirectIfAuth
- LandingView brand link uses router-link (was <a href>, causing SPA reload)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

refactor(auth): AuthLayout supports optional narrative slot ... 9ee99d17fd

New slot 'narrative' enables split-screen layout (50/50 desktop, collapses
to single column on mobile <900px).

Backward compatibility:
- Pages that don't pass a narrative slot still render the original
  centered-card layout with siteName + logo + copyright
- ForgotPassword, ResetPassword, EmailVerify unaffected

To be used in Tasks 8 and 9 (LoginView, RegisterView).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(auth): LoginView with PURO narrative split layout ... 91b9ae7e21

- Left: ⬢ PURO AI brand + '5→1' headline + three-line value props
- Right: existing form (OAuth, Turnstile, 2FA all preserved unchanged)
- Heading changed from t('auth.welcomeBack') to '登录' — i18n key consolidation in Task 11

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(auth): RegisterView with PURO narrative split layout ... f17a88c171

Same split layout as LoginView: left narrative, right form.
Heading: '创建账户' + '5 分钟开始用 PURO AI'.
All form logic preserved (OAuth, Turnstile, email verify code, password fields).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(docs): public DocsView with Codex/Claude Code/curl quickstart ... 7dc8062988

Route /docs (no auth). Six sections: get key, codex CLI, claude code,
curl, supported models, feedback. Uses puro.css design system.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

chore(i18n): consolidate PURO auth heading keys into zh.ts ... 0fceb100e0

Login and Register heading strings moved from hardcoded Chinese to
auth.puroLoginTitle / puroLoginSub / puroRegisterTitle / puroRegisterSub.

Landing (LandingView) and Docs (DocsView) intentionally keep hardcoded
Chinese this cycle (see spec §6 note 5 — English version deferred).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

docs: tick local acceptance items [CI SKIP] ... 829f101100

11/12 checklist items verified via pnpm build + preview + curl.
Remaining: CI deploy + prod verification (Task 13).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

purovps added 16 commits 2026-04-19 13:57:24 +00:00

feat(design): scaffold PURO AI design system ... 1d7e75b82e

- Add puro.css (tokens + primitives) as global stylesheet
- Load Inter + JetBrains Mono via Google Fonts
- Extend tailwind.config with puro.* color namespace (no conflict with legacy primary/accent palettes)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(design): scope puro.css to .puro-page container ... 41664efede

Code review flagged two critical issues with the initial scaffold:
- html/body bg + universal reset applied globally, overriding admin Tailwind styles
- Shared class names (.btn, .card, .input, .badge, .divider) collided with style.css,
  breaking 25+ admin views

Fix: all non-:root rules now scoped under .puro-page descendant selector.
@keyframes and global box-sizing preserved. html/body props merged into .puro-page root.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(design): scope .bg-glow::before selector to .puro-page ... 064a4b7614

One missed prefix from the automated transform. Aligns with the
scoping contract established in 41664efe.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): LandingView scaffold with Nav + Hero ... 9dae8724e3

Temporary route /landing-preview added for dev iteration. Will flip /
to this view once all 6 sections are in place (Task 6).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): add Models wall + Features sections ... cfcdd988db

- Added Models section (② 模型墙) with 5 platform cards (Claude, GPT, Codex, Gemini, More)
- Added Features section (③ 三特性) with 3 feature cards (unified key, account pool failover, analytics dashboard)
- Implemented responsive grid layouts with scoped CSS rules
- Used existing design tokens and brand colors from puro.css

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(landing): resolve Task 3 CSS specificity issues ... 158f2a8d53

Code review flagged:
- .feature.card caused padding/background specificity race;
  .feature already defines all card properties, so drop .card
- model-card flex row misaligned name/meta (should stack in column);
  wrap in div to get dot | [name/meta] layout
- .container and .section-* scoped rules silently shadow puro.css defaults;
  add comment explaining intentional override

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): add Code Demo + Dashboard mockup sections ... c099cd5d97

Dashboard mockup is pure static (SVG chart + stats grid + log table).
No backend dependency. Reuses puro.css .log-table / .provider / .status-*
(scoped to .puro-page). Only adds component-local styles for .code-demo,
.dash-mock, .stat-row, .chart-card and friends.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(landing): Footer + sticky Nav styles ... 4e675d70c1

- 4-column footer (brand/产品/资源/联系), responsive 2-col on mobile
- Nav sticky with blur background, border-bottom
- nav-links hidden on mobile (<640px)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

fix(landing): Polish items from code review ... 4832534232

- Add noreferrer to all external rel attributes (4 anchors)
- Change 更新日志 link from /releases (may 404) to /commits/branch/main
- Remove dead CSS overridden by puro.css: .nav z-index:10, .nav-links gap:20px
- Document puro.css global dependency at top of scoped style block

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(router): mount Landing at / with auth-aware redirect ... 284b5129ac

- / (anonymous) → LandingView
- / (authenticated) → redirects to /dashboard via new meta.redirectIfAuth
- Remove temporary /landing-preview route (Task 2 helper)
- RouteMeta TS augmentation for redirectIfAuth
- LandingView brand link uses router-link (was <a href>, causing SPA reload)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

refactor(auth): AuthLayout supports optional narrative slot ... 9ee99d17fd

New slot 'narrative' enables split-screen layout (50/50 desktop, collapses
to single column on mobile <900px).

Backward compatibility:
- Pages that don't pass a narrative slot still render the original
  centered-card layout with siteName + logo + copyright
- ForgotPassword, ResetPassword, EmailVerify unaffected

To be used in Tasks 8 and 9 (LoginView, RegisterView).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(auth): LoginView with PURO narrative split layout ... 91b9ae7e21

- Left: ⬢ PURO AI brand + '5→1' headline + three-line value props
- Right: existing form (OAuth, Turnstile, 2FA all preserved unchanged)
- Heading changed from t('auth.welcomeBack') to '登录' — i18n key consolidation in Task 11

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(auth): RegisterView with PURO narrative split layout ... f17a88c171

Same split layout as LoginView: left narrative, right form.
Heading: '创建账户' + '5 分钟开始用 PURO AI'.
All form logic preserved (OAuth, Turnstile, email verify code, password fields).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(docs): public DocsView with Codex/Claude Code/curl quickstart ... 7dc8062988

Route /docs (no auth). Six sections: get key, codex CLI, claude code,
curl, supported models, feedback. Uses puro.css design system.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

chore(i18n): consolidate PURO auth heading keys into zh.ts ... 0fceb100e0

Login and Register heading strings moved from hardcoded Chinese to
auth.puroLoginTitle / puroLoginSub / puroRegisterTitle / puroRegisterSub.

Landing (LandingView) and Docs (DocsView) intentionally keep hardcoded
Chinese this cycle (see spec §6 note 5 — English version deferred).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

docs: tick local acceptance items [CI SKIP] ... 829f101100

11/12 checklist items verified via pnpm build + preview + curl.
Remaining: CI deploy + prod verification (Task 13).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

purovps merged commit 355370ad2a into main 2026-04-19 13:58:25 +00:00

purovps referenced this issue from a commit 2026-04-19 13:58:27 +00:00

Merge pull request 'feat: PURO AI landing + auth + docs redesign' (#1) from feat/design-landing-auth into main

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

No items

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

purovps

No Assignees

1 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: purovps/sub2api#1