Add expanded modifier for the collapse and accordion components

[jonathan-baernthaler]

Hello, I recently worked on a project where we needed to style the summary of the collapse component based on its state (collapsed, expanded) As there is currently no out of-the-box solution for this use case, we created a new modifier "expanded" that works similarly to the hover: focus: or md: modifiers. This was really useful to us and might be to others. Please check out this small code sandbox to see it in action.

here are the relevant code lines to add the plugin:

plugins: [ require("daisyui"), plugin(function ({ addVariant }) { addVariant("expanded", [ ".collapse[open] &", ".collapse-open &", ".collapse:focus:not(.collapse-close) &", ".collapse:not(.collapse-close) > input[type='checkbox']:checked ~ &", ".collapse:not(.collapse-close) > input[type='checkbox']:checked ~ * &", ".collapse:not(.collapse-close) > input[type='radio']:checked ~ &", ".collapse:not(.collapse-close) > input[type='radio']:checked ~ * &", ]); }), ],

if there is any interest for this feature I would be more than happy to open a PR