docs: Add Overview pages and improve documentation overall #29
Conversation
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull Request Overview
This PR enhances the Styleframe documentation by adding comprehensive API and Design Tokens overview pages, updating navigation links throughout the site, and simplifying code examples. The changes improve discoverability and maintainability while making the documentation more user-friendly.
Key changes:
- Added new overview pages for API and Design Tokens sections with structured summaries and navigation tables
- Updated keyframe animation examples to use simpler
${keyframes.name}syntax instead ofcss${ref(keyframes)} - Updated navigation links on the homepage and configuration to point to relevant documentation pages
Reviewed Changes
Copilot reviewed 13 out of 13 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| docs/content/index.md | Updated homepage feature card links to point to relevant documentation sections |
| docs/content/docs/04.design-tokens/*.md | Added navigation icons to design token pages for consistency |
| docs/content/docs/04.design-tokens/00.overview.md | New comprehensive overview page introducing design token system with examples and reference table |
| docs/content/docs/04.design-tokens/06.scales.md | Updated scale usage example to show proper API usage with defaultScaleValues |
| docs/content/docs/02.api/05.keyframes.md | Simplified animation syntax across all examples, removed unnecessary imports |
| docs/content/docs/02.api/00.overview.md | New comprehensive API overview page with feature descriptions and navigation table |
| docs/app/app.config.ts | Updated "Purchase a license" link and icon to point to pricing page |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| const s = styleframe(); | ||
| const { variable, ref, keyframes, selector } = s; | ||
| const { variable, ref, keyframes, selector, css } = s; |
There was a problem hiding this comment.
[nitpick] The css destructuring was moved but is only used once in this example. Consider whether this adds clarity or if it would be clearer to use s.css inline at line 120 where it's needed.
|
|
||
| const s = styleframe(); | ||
| const { keyframes, selector, ref } = s; | ||
| const { keyframes, selector, ref, css } = s; |
There was a problem hiding this comment.
[nitpick] The css destructuring was moved but is only used once in this example. Consider whether this adds clarity or if it would be clearer to use s.css inline at line 410 where it's needed.
| const { keyframes, selector, ref, css } = s; | |
| const { keyframes, selector, ref } = s; |
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
This pull request primarily updates documentation for the Styleframe API, focusing on improving clarity and maintainability of code examples and updating navigation links. The most significant changes are the addition of a comprehensive API overview page and the simplification of keyframe animation code samples to use a more straightforward syntax.
Documentation Improvements
API Overviewdocumentation page that introduces Styleframe's core features, usage patterns, and provides a summary table with links to detailed API docs. This page helps users quickly understand the library's capabilities and how to get started.Code Sample Simplification
05.keyframes.mdto use the simpler${keyframes.name} ...syntax for theanimationproperty, replacing the previous `cssThis pull request primarily updates documentation for the Styleframe API, focusing on improving clarity and maintainability of code examples and updating navigation links. The most significant changes are the addition of a comprehensive API overview page and the simplification of keyframe animation code samples to use a more straightforward syntax.Documentation Improvements
API Overviewdocumentation page that introduces Styleframe's core features, usage patterns, and provides a summary table with links to detailed API docs. This page helps users quickly understand the library's capabilities and how to get started.Code Sample Simplification
${ref(keyframes)} ...This pull request primarily updates documentation for the Styleframe API, focusing on improving clarity and maintainability of code examples and updating navigation links. The most significant changes are the addition of a comprehensive API overview page and the simplification of keyframe animation code samples to use a more straightforward syntax.
Documentation Improvements
API Overviewdocumentation page that introduces Styleframe's core features, usage patterns, and provides a summary table with links to detailed API docs. This page helps users quickly understand the library's capabilities and how to get started.Navigation and UI Updates
i-material-symbols:award-starand updated its link to the pricing page (/pricing) for clarity and better user experience.