feat(components): small improvement to focus state of DataList headers

[chris-at-jobber]

Motivations

The focus state for DataList headers looked a little unfinished with no radius

Changes

Changed

• DataList interactive headers now have a small radius in their focused state

Fixed

• Sortable headers on right-aligned columns now align properly to their columns' contents

Testing

You can test in Cloudflare or locally by tabbing through the interface and observing the slightly rounded corners.

Changes can be tested via Pre-release

---

In Atlantis we use Github's built in pull request reviews.

[cloudflare-workers-and-pages[bot]]

Deploying atlantis with    Cloudflare Pages

Latest commit:	06feed3
Status:	✅  Deploy successful!
Preview URL:	https://5be7159e.atlantis.pages.dev
Branch Preview URL:	https://add-radius-to-datalist-heade.atlantis.pages.dev

View logs

[Aiden-Brine]

Is the fact that there is a lot more padding on the right hand side as opposed to the left hand side purposeful? For example here there is more space between the arrows and the border than the H and the border. It looks off to me

[chris-at-jobber]

@Aiden-Brine yes that's a very fair point! I'll push up a change here

[chris-at-jobber]

@Aiden-Brine evened out the spacing - also found that fixing this resolved the long-standing issue with right-aligned sortable column headers and their content!

Previously:

[Aiden-Brine]

@chris-at-jobber Looks great! Thank you for making that change