SSD-815- added toggle components develop#340
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 introduces a new HTML/CSS toggle component to the design system documentation, providing developers with a lightweight, accessible switch implementation as a starting point before transitioning to React.
Changes:
- Added toggle component implementation with three size variants (small, medium, large)
- Created comprehensive documentation with usage examples, anatomy, and accessibility guidelines
- Implemented dark mode support for the toggle component
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| apps/docs/public/assets/ta-preview/toggle/toggle.css | Core toggle component styles including size variants and state management |
| apps/docs/public/assets/ta-preview/toggle/toggle-dark.css | Dark mode color overrides for toggle component |
| apps/docs/public/assets/ta-preview/toggle/ta-toggle-preview.html | HTML preview page demonstrating all three toggle sizes |
| apps/docs/content/docs/develop/(transistory-assistance)/ta-toggle.mdx | Complete documentation for the toggle component with examples and API reference |
| apps/docs/content/docs/develop/(transistory-assistance)/ta-button.mdx | Removed extra blank line |
| apps/docs/components/iframe-theme-preview.tsx | Reformatted code for better readability |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for CSS code block. The content is CSS, not TSX. Change to ```css for proper syntax highlighting.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for CSS code block. The content is CSS, not TSX. Change to ```css for proper syntax highlighting.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for CSS code block. The content is CSS, not TSX. Change to ```css for proper syntax highlighting.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for HTML code block. The content is HTML, not TSX. Change to ```html for proper syntax highlighting.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for HTML code block. The content is HTML, not TSX. Change to ```html for proper syntax highlighting.
|
|
||
|
|
||
| ## 5. Anatomy | ||
| | Selector | Purpose | |
There was a problem hiding this comment.
Incorrect language identifier for HTML code block. The content is HTML, not TSX. Change to ```html for proper syntax highlighting.
Summarise the feature
Issue ticket #340
Description:
Type of change
Checklist