Ensure that order is proper

Fixes #5212

news/changelog-1.4.md

@@ -126,6 +126,7 @@
 - Add support for `bread-crumbs: true|false` to control whether bread crumbs are displayed. Add support for display of breadcrumbs on full width (non-mobile) pages when `bread-crumbs` is true. Default value is true.
 - Add support for `show-item-context` key within the `search` key to control whether page parents are display next to items in search results. Pass `tree`, `parent`, `root`, or boolean (if you pass true, `tree` is the default).
 - ([#4739](https://github.com/quarto-dev/quarto-cli/issues/4739)): Improve handling of reader mode at mobile responsive sizes
+- ([#5212](https://github.com/quarto-dev/quarto-cli/issues/5212)): Ensure navbar search button respects `collapse-below` and remains aligned properly
 - ([#5251](https://github.com/quarto-dev/quarto-cli/issues/5251)): Allow individual pages to specify `image: false` to prevent image discover for Twitter and Open Graph metadata.
 - ([#5283](https://github.com/quarto-dev/quarto-cli/issues/5283)): Add support for setting `repo-actions: false` in a document to prevent the display of repository actions on a specific page.
 - ([#5389](https://github.com/quarto-dev/quarto-cli/issues/5389)): Allow a website project to provide a default image used in social metadata tags.

src/resources/projects/website/search/quarto-search.scss

@@ -40,6 +40,11 @@ $quarto-search-collapse-icon-size: 26px !default;
   }
 }
 
+.navbar.navbar-expand-sm #quarto-search,
+.navbar.navbar-expand-md #quarto-search {
+  order: 999;
+}
+
 .navbar .quarto-navbar-tools {
   @include media-breakpoint-up(lg) {
     margin-left: 0.25rem;