[YuqingNicole]

Audit

I checked every public page in Chinese and English at 320, 375 and 414 px:

• home, /about, /docs, /inspiration and one reference page;
• /skills, /submit, /sponsor, /pricing;
• /guides, one guide, /changelog, a case page and a category page.

The script used a mobile viewport with touch. It looked for horizontal scrolling, elements past the screen edge, standalone tap targets under 24 px, text under 12 px, and form fields under 16 px.

What it found:

• No horizontal overflow anywhere.
• The header nav was 11 px text with 18 px-tall targets on every page.
• Standalone links were 17–23 px tall: tables of contents, back and secondary links, "查看全部" links, the footer, and link paragraphs.
• The search field was 23 px tall.
• Inputs and textareas used 12–13 px text, which makes iOS zoom the page on focus.
• Some labels were 11 px.
• The install command on /skills scrolled sideways.

Changes (only below 650 px)

• Nav: each link is 44 px tall, and the text scales from 12 px at 320 px to 14 px from about 400 px. The six links still fit one row at 320 px in English; I measured 320–600 px on 5 routes.
• Standalone links: tables of contents, back and secondary links, link paragraphs, footer links, and the home, library, inspiration, about and pricing links are now 44 px tall. Link paragraphs inside articles get an explicit content-link class, so links inside sentences are untouched.
• Fields: the search field is 44 px tall. Search, selects and textareas use 16 px text.
• Labels: 11 px labels are now 12 px. The Forma screens inside the diagrams are left alone, because they are a scaled-down sample product.
• The /skills command wraps instead of scrolling.

Checks that ran

• Audit: zero findings after the changes, in both languages at 320 and 414 px, and on all Chinese pages at 375 px.
• Screenshots: I compared before and after at 375 px. They caught two regressions that I fixed:
  • the first nav link sat higher than the rest, because of an older, more specific rule;
  • the /docs secondary link sat beside the button instead of below it.
• New Playwright test "on phones, links and fields are big enough to tap and read": at 375 px on 8 routes, it checks targets ≥ 44 px, fields ≥ 16 px, text ≥ 12 px and no horizontal scroll.
• Full landing suite: 43 passed. The only failure was the new test, on the /about primary button at 43.5 px; after fixing that, the new test and the nav and /about tests passed.
• docs/design-system.md records the three rules.

Not checked: a real iPhone or Android device. These are Chrome mobile emulation results.

🤖 Generated with Claude Code

[vercel]

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

Project	Deployment	Actions	Updated
variant-design-skill	Ready	Preview	Nov 2, 2026 3:31pm UTC

[coderabbitai]

Warning

Review limit reached

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Next included review available in 23 seconds.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

Run configuration

• Source mode: Auto
• Repository: Unavailable
• Branch: Unavailable
• File: No configuration file from this repository applied
• Commit: Unavailable
• Layers: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: 2dcd976f-de02-4329-9234-2a293210b6d9

Commits

Reviewing files that changed from the base of the PR and between c7c484b and 8efa71e.

Files selected for processing: 12

• docs/design-system.md
• tests/landing.spec.mjs
• website/src/ChangelogPage.tsx
• website/src/DocsGuide.tsx
• website/src/GuidesPage.tsx
• website/src/content-pages.css
• website/src/home.css
• website/src/inspiration.css
• website/src/library.css
• website/src/paper-landing.css
• website/src/pricing.css
• website/src/site-system.css

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

Share

• X
• Mastodon
• Reddit
• LinkedIn