Skip to content

v6: Cheatsheet Example updates#42361

Open
coliff wants to merge 2 commits intotwbs:v6-devfrom
coliff:dev/coliff/cheatsheet-example-fixes
Open

v6: Cheatsheet Example updates#42361
coliff wants to merge 2 commits intotwbs:v6-devfrom
coliff:dev/coliff/cheatsheet-example-fixes

Conversation

@coliff
Copy link
Copy Markdown
Contributor

@coliff coliff commented Apr 24, 2026

  • Buttons
  • List Groups.
  • Accordions (replace with new markup)
  • Breadcrumbs markup
  • Spinners theme colors
  • Heading badges
  • Navbar menu buttons (added .btn-icon class)
  • Tables theme color rows

There's still some remaining issues left, but I think they could be dealt with separately.

  • Replace Display size typography with new classes
  • Username validation text layout issue
  • navbar toggle button doesn't collapse and positioned wrong when open

Ideally should add all new components too - e.g. OTP, chi[s, combo box, pw strength. nav overflow, drawer - but that can be done in a separate PR too though.

Type of changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Refactoring (non-breaking change)
  • Breaking change (fix or feature that would change existing functionality)

Checklist

  • I have read the contributing guidelines
  • My code follows the code style of the project (using npm run lint)
  • My change introduces changes to the documentation
  • I have updated the documentation accordingly
  • I have added tests to cover my changes
  • All new and existing tests passed

Live previews

Related issues

Copilot AI review requested due to automatic review settings April 24, 2026 16:19
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Updates the cheatsheet example to reflect new button variants and themed list group styling.

Changes:

  • Update theme-color button examples to use btn-outline + theme-* classes.
  • Add a new theme-color button example for btn-subtle.
  • Update theme-color list group items to use theme-* classes.
Comments suppressed due to low confidence (1)

site/src/assets/examples/cheatsheet/index.astro:1

  • The visible label uses ${themeColor.name} (likely lowercase/internal token), while the button examples use ${themeColor.title} for user-facing text. For consistency and more readable output in the cheatsheet, consider switching the list-group text to ${themeColor.title}.
---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines 745 to 751
<Example showMarkup={false} code={getData('theme-colors').map((themeColor) => `
<button type="button" class="btn-solid theme-outline-${themeColor.name}">${themeColor.title}</button>
<button type="button" class="btn-outline theme-${themeColor.name}">${themeColor.title}</button>
`)} />

<Example showMarkup={false} code={getData('theme-colors').map((themeColor) => `
<button type="button" class="btn-subtle theme-${themeColor.name}">${themeColor.title}</button>
`)} />
Copy link

Copilot AI Apr 24, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This maps over getData('theme-colors') twice in a row to render nearly identical button markup. Consider consolidating into a single loop over the variants (e.g., ['btn-outline', 'btn-subtle']) to reduce duplication and make future variant additions less error-prone.

Copilot uses AI. Check for mistakes.
Comment thread site/src/assets/examples/cheatsheet/index.astro
@coliff coliff force-pushed the dev/coliff/cheatsheet-example-fixes branch from f498e09 to ee2b05c Compare April 25, 2026 06:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants