feat(accordion): close #152 add height transition

[BuptStEve]

Summary by CodeRabbit

• Style
  • Improved accordion component animations with enhanced height transitions for smoother open and close interactions.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

---

Note

Improves accordion open/close animations with height-based transitions using CSS utilities.

• accordion-content.astro: adds h-0 group-open:h-auto and duration-200 ease-out for smooth height expansion/collapse
• accordion-item.astro: adds details-content:* transition utilities including transition-[height,content-visibility] and [interpolate-size:allow-keywords]
• accordion.astro: no functional changes (formatting only)

^{Written by Cursor Bugbot for commit c2859ee. This will update automatically on new commits. Configure here.}

[netlify]

✅ Deploy Preview for fulldev-ui ready!

Name	Link
🔨 Latest commit	7b67ca3
🔍 Latest deploy log	https://app.netlify.com/projects/fulldev-ui/deploys/695f40095747f000088fdf97
😎 Deploy Preview	https://deploy-preview-154--fulldev-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[silveltman]

Thanks for contributing @BuptStEve ! And Apologies for the late reply here. Will be faster now that the holidays are over.

As for the implementation, I see 2 problems:

• The first time a page is loaded and the accordion is openen, it does not transition, it is instant.
• when the transition works, it is very laggy and slow

I think this has to do with transitioning a h-auto. What do you think, and are you experiencing the same?

If it is not possible with vanilla css it might be better to rename this component to NativeAccordion since its based on the html dialog, and add another Accordion component which will be javascript based with smooth transitions.

[silveltman]

See comment above

[cursor]

This PR is being reviewed by Cursor Bugbot

Details

You are on the Bugbot Free tier. On this plan, Bugbot will review limited PRs each billing cycle.

To receive Bugbot reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial.

[BuptStEve]

Oh you're right, I'll figure it out...

[BuptStEve]

@silveltman

Kapture.2026-01-08.at.13.04.11.mp4

[silveltman]

Awesome! very smooth now 💪🏻