Skip to content

feat(site): reorganize navigation and add dedicated Tools page#703

Merged
GarthDB merged 1 commit intomainfrom
feat/docs-site-reorganization
Feb 13, 2026
Merged

feat(site): reorganize navigation and add dedicated Tools page#703
GarthDB merged 1 commit intomainfrom
feat/docs-site-reorganization

Conversation

@GarthDB
Copy link
Member

@GarthDB GarthDB commented Feb 13, 2026

Summary

This PR reorganizes the documentation site navigation and adds a new dedicated Tools page:

  • New Tools Page: Auto-generated page with two sections:
    • Web Tools: Links to deployed applications (S2 Tokens Viewer, S2 Visualizer, etc.)
    • Developer Tools: Alphabetically sorted list of packages from tools/ directory with links to npm (public) or GitHub (private)
  • Navigation Updates: Removed "Home" link (logo links to home), added "Tools" link, improved header layout with Adobe logo
  • Footer Updates: Replaced tool links with Spectrum ecosystem links (React Spectrum, Web Components, Spectrum Website)
  • Typography: Integrated Adobe Clean font via Typekit with performance optimizations
  • Content Enhancements: Added descriptions to component/token lists, applied sentence case to token titles
  • Build Integration: Added generateToolsPage task to moon.yml that runs before copyContent

Key Changes

Tools Page Generation

  • New script: docs/site/scripts/generate-tools-page.js
  • Reads package.json files from docs/ and tools/ directories
  • Generates src/tools.md with links and descriptions
  • Integrated into build pipeline via moon tasks

Header & Footer

  • Added Adobe logo to header
  • Vertical header layout with improved spacing
  • Updated footer with Spectrum ecosystem links
  • Consistent link styling throughout

Typography & Content

  • Added Typekit script with preconnect for performance
  • Token titles now use sentence case (e.g., "Color aliases")
  • Added descriptive text to component and token list pages
  • Updated token file descriptions to differentiate types

Test Plan

  • Verify Tools page generates correctly with moon run docs-site:generateToolsPage
  • Check that developer tools are sorted alphabetically
  • Confirm links work for both public (npm) and private (GitHub) packages
  • Test navigation: header links, footer links, logo link
  • Verify Adobe Clean font loads via Typekit
  • Check responsive layout on mobile/tablet
  • Run moon run docs-site:build to ensure no build errors
  • Test live site at http://localhost:8081/spectrum-design-data/

Made with Cursor

- Add new Tools page with auto-generated content from package.json
  - Web Tools section for deployed applications
  - Developer Tools section for packages in tools/ directory
  - Links to npm for public packages, GitHub for private packages
  - Alphabetically sorted developer tools list
- Reorganize header navigation
  - Remove Home link (logo links to home)
  - Add Tools link to main navigation
  - Add Adobe logo to header
  - Update header layout to vertical stack with improved spacing
  - Set header text to font-weight 700
- Update footer
  - Replace tool links with Spectrum ecosystem links
  - Add links to React Spectrum, Spectrum Web Components, and Spectrum Website
  - Style footer links consistently (non-bold, nowrap)
- Add Adobe Clean font via Typekit
  - Include preconnect for performance
  - Load script asynchronously
- Enhance content descriptions
  - Add descriptions to component and token list pages
  - Update token titles to sentence case
  - Add specific descriptions for each token file type
- Update package names for consistency
  - Use simple names for private/unpublished packages
  - Keep @adobe scope for published packages

Co-authored-by: Cursor <cursoragent@cursor.com>
@changeset-bot
Copy link

changeset-bot bot commented Feb 13, 2026

⚠️ No Changeset found

Latest commit: 7746773

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@GarthDB
Copy link
Member Author

GarthDB commented Feb 13, 2026

Run report for 77467731

Total time: 1m 4s | Comparison time: 1m 54s | Estimated savings: 50.2s (43.7% faster)

Action Time Status Info
⬛️ SetupProto(0.51.4) 0ms Skipped
🟩 SyncWorkspace 7ms Passed
🟩 SyncProject(componentSchemas) 696.3ms Passed
🟩 SyncProject(tokens) 696.3ms Passed
🟩 SyncProject(release-analyzer) 696.8ms Passed
🟩 SyncProject(design-system-registry) 0.4ms Passed
🟩 SyncProject(markdown-generator) 0.3ms Passed
🟩 SyncProject(component-options-editor) 1.1ms Passed
🟩 SyncProject(site) 0.4ms Passed
⬛️ SetupToolchain(node:20.17.0) 1.4s Skipped
🟩 InstallWorkspaceDeps(node:20.17.0) 10.1s Passed
🟩 RunTask(tokens:buildManifest) 283.6ms Passed
🟩 RunTask(site:generateToolsPage) 868.9ms Passed
🟩 RunTask(release-analyzer:test) 1.6s Passed
🟩 RunTask(design-system-registry:test) 2.8s Passed
🟩 RunTask(componentSchemas:test) 4.9s Passed
🟩 RunTask(component-options-editor:type-check) 10s Passed
🟩 RunTask(component-options-editor:lint) 10.3s Passed
🟩 RunTask(component-options-editor:validate) 14.9s Passed
🟩 RunTask(component-options-editor:build) 28.8s Passed
And 6 more...
Expanded report
Action Time Status Info
🟩 RunTask(tokens:buildTokens) 44.2s Passed
🟩 RunTask(tokens:build) 13.7ms Passed
🟩 RunTask(markdown-generator:generate) 297.2ms Passed
🟩 RunTask(site:copyContent) 82.4ms Passed
🟩 RunTask(site:build) 2.5s Passed
🟩 RunTask(site:export) 7.7ms Passed
Touched files
docs/markdown/pages/components/index.md
docs/markdown/pages/index.md
docs/markdown/pages/tokens/index.md
docs/markdown/tokens/color-aliases.md
docs/markdown/tokens/color-component.md
docs/markdown/tokens/color-palette.md
docs/markdown/tokens/icons.md
docs/markdown/tokens/layout-component.md
docs/markdown/tokens/layout.md
docs/markdown/tokens/semantic-color-palette.md
docs/markdown/tokens/typography.md
docs/site/eleventy.config.js
docs/site/moon.yml
docs/site/package.json
docs/site/public/adobe_logo.svg
docs/site/scripts/generate-tools-page.js
docs/site/src/assets/css/base/index.css
docs/site/src/data/navigation.js
docs/site/src/includes/layout/footer.liquid
docs/site/src/includes/layout/header.liquid
docs/site/src/layouts/base.liquid
docs/site/src/pages/components/index.md
docs/site/src/pages/index.md
docs/site/src/pages/tokens/index.md
docs/site/src/tools.md
tools/component-options-editor/package.json
tools/markdown-generator/src/tokens.js
tools/release-analyzer/package.json
tools/s2-docs-transformer/package.json
tools/token-changeset-generator/package.json

@GarthDB GarthDB merged commit ec1e4ac into main Feb 13, 2026
4 checks passed
@GarthDB GarthDB deleted the feat/docs-site-reorganization branch February 13, 2026 17:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant