Closed chrisjsewell closed 2 months ago
All modified and coverable lines are covered by tests :white_check_mark:
Project coverage is 89.15%. Comparing base (
169c09d
) to head (fde2a8a
).
:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.
This PR makes three visible changes:
The "default" behaviour of the right chevron is to go from right-facing (closed) to down-facing (open), instead of down-facing (closed) to up-facing (open). There is also a rotate transition on opening/closing. The old default behaviour can be retained by using the new
:chevron: down-up
directive option.The prefix icon (optional), title text, and chevron state icon are now all better aligned
The top/bottom padding is now 0.5em instead of 1em
Here is an example:
The PR also introduces three new CSS variables to control font sizes of the dropdown:
Internally, the HTML / CSS is changed, such that the title is now an
inline-flex
box, with three columns arranged withjustify-content: space-between
:flex-grow: 1
)Also, the state chevron was previously two distinct SVGs (with one hidden), but now is one that get rotated on open/close.
An additional note, currently for multi-line titles, the icons are aligned vertically centered:
It might be ideal for them to be aligned with only the first line of text, i.e. be at the top. But I couldn't work out how to do this, whilst maintaining the correct alignment for the (more common) single line title