Skip to content

DX-027: Wire the shared design system into apps/docs #539

Description

@IbrahimIjai

Context

The docs app must define no tokens of its own. It consumes
@workspace/ui and the tokens in packages/ui/src/styles/globals.css, which is
what keeps the docs and the app looking like one product. See
docs/dx_1/001_docs_site.md §5 and DESIGN.md.

Scope

  • Add @workspace/ui as a workspace dependency and import its globals.css.
  • Configure Tailwind v4 in the docs app to consume the shared @theme block —
    no tailwind.config.js, matching the repo's CSS-first setup.
  • Extend scripts/check-design-tokens.ts to scan apps/docs on the same terms
    as apps/web, with no new allowlist entries.
  • Render one primitive from @workspace/ui (a Button) on the placeholder page
    to prove the pipeline end to end.
  • Self-host fonts through the existing mechanism; no remote font requests.

Acceptance criteria

  • bun run check:tokens covers apps/docs and passes with zero violations
    and zero new allowlist entries.
  • The docs app defines no color, spacing, radius, or type token of its own.
  • A shared primitive renders correctly in both themes.
  • No network font or asset request in the built output.

Out of scope

  • The MDX component map (DX-034) and docs-specific chrome (DX-030).

Spec: docs/dx_1/001_docs_site.md §5 · Depends on: DX-026

Metadata

Metadata

Assignees

Labels

GrantFox OSSIssue tracked in GrantFox OSSMaybe RewardedIssue may be eligible for a GrantFox rewardStellar WaveIssues in the Stellar wave programThird CampaignCampaign: Third CampaigndocumentationImprovements or additions to documentationenhancementNew feature or request

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions