fix(components): Fix icons shrinking in the page menu with longer titles

[ethanmillard]

Motivations

The Jobs More Actions... menu has added 2 new Import actions. The second one being Import Google Calendar which is a long enough title that flex starts to shrink the icon, leaving the menu looking a little scewed.

Changes

Adding flex-shrink: 0 to the svg to stop the icon from changing size. I also found that the text in storybook was center aligned when it got to multiple lines, so I added text-align:start to stop this. Though I wasn't sure if that was the right move.

Added

Changed

Deprecated

Removed

Fixed

Security

Testing

I've only tested this in storybook for now Before:

After:

Changes can be tested via Pre-release

---

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

[jdeichert]

@ethanmillard thanks for the PR! I'll trigger a pre-release to be published for this branch. Once the comment is posted here, can you double check it in JO by installing the pre-release version locally and confirming it works in that scenario?

[github-actions[bot]]

Published Pre-release for 9553760fa1259f9538d2b1f378a5471257c5b579 with versions:

  - @jobber/components@5.40.3-JOB-105977-9553760.0+9553760f

To install the new version(s) for Web run:

npm install @jobber/components@5.40.3-JOB-105977-9553760.0+9553760f

[ethanmillard]

Tested with the pre release.

Longer titles in menu no longer shrink the icon.

I also tested all the other pages just to make sure nothing in there changed and everything else appears to look the same

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

Deploying atlantis with    Cloudflare Pages

Latest commit:	137f3bf
Status:	✅  Deploy successful!
Preview URL:	https://3305162b.atlantis.pages.dev
Branch Preview URL:	https://job-105977-menu-icon-size.atlantis.pages.dev

View logs