🤏 Improve theme for narrow screens

[agoose77]

This PR sets some flex styling to avoid shrinkage causing issues at intermediate widths. This PR does not address the need to perhaps tweak the menu breakpoints / move the theme button into the ellipsis menu.

Existing:

• Unnecessarily wide search bar
• Stretched theme icon
• Warped action button(s)

New:

• Narrower search bar
• Non-growing/shrinking (square) theme icon
• Non-shrinking action button(s)

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 767984bbb2e7f67c684feeceaa549e090ef7d0ab

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 14 packages

| Name | Type | | ----------------------------- | ----- | | @myst-theme/site | Patch | | @myst-theme/providers | Patch | | @myst-theme/frontmatter | Patch | | @myst-theme/diagrams | Patch | | @myst-theme/jupyter | Patch | | @myst-theme/styles | Patch | | @myst-theme/common | Patch | | @myst-theme/icons | Patch | | @myst-theme/search | Patch | | @myst-theme/search-minisearch | Patch | | @myst-theme/book | Patch | | @myst-theme/article | Patch | | myst-to-react | Patch | | myst-demo | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[rowanc1]

Can you put screenshots in?!

[stevejpurves]

@agoose77 is wide screen behaviour unchanged? even when there are a good list of nav items in the topbar?

[agoose77]

@stevejpurves I've done some more testing on that, and I think it needs some work.

I think we need to start applying more conditional styling so that if users have nav items, we prefer compactness at intermediate sizes. Does anyone have any thoughts here? It's a bit of a feedback loop between nav and search at the moment.

[agoose77]

I'm closing this for now -- we'll need to revisit.