SpecialSearch: Use OOUI\ActionFieldLayout for search input and button

This prevents the button from flipping to a new line if the window or
the available width at all is smaller as the width of the input and the
button together. Now, the input will be as small as needed for the button
to be on the same line.

Bug: T134475
Change-Id: Icc68a8e83fc7037b96a5efec2766ffdf453c5413

diff --git a/includes/specials/SpecialSearch.php b/includes/specials/SpecialSearch.php
index e14fcf5..b98ddda 100644 (file)
--- a/includes/specials/SpecialSearch.php
+++ b/includes/specials/SpecialSearch.php
@@ -1241,16 +1241,19 @@ class SpecialSearch extends SpecialPage {
                        'dataLocation' => 'content',
                ] );
 
+               $layout = new OOUI\ActionFieldLayout( $searchWidget, new OOUI\ButtonInputWidget( [
+                       'type' => 'submit',
+                       'label' => $this->msg( 'searchbutton' )->text(),
+                       'flags' => [ 'progressive', 'primary' ],
+               ] ), [
+                       'align' => 'top',
+               ] );
+
                $out =
                        Html::hidden( 'title', $this->getPageTitle()->getPrefixedText() ) .
                        Html::hidden( 'profile', $this->profile ) .
                        Html::hidden( 'fulltext', 'Search' ) .
-                       $searchWidget .
-                       new OOUI\ButtonInputWidget( [
-                               'type' => 'submit',
-                               'label' => $this->msg( 'searchbutton' )->text(),
-                               'flags' => [ 'progressive', 'primary' ],
-                       ] );
+                       $layout;
 
                // Results-info
                if ( $totalNum > 0 && $this->offset < $totalNum ) {

diff --git a/resources/src/mediawiki.special/mediawiki.special.search.styles.css b/resources/src/mediawiki.special/mediawiki.special.search.styles.css
index 7be7c84..e8fda84 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.search.styles.css
+++ b/resources/src/mediawiki.special/mediawiki.special.search.styles.css
@@ -84,7 +84,6 @@ div.searchresult {
        color: #666;
        font-size: 95%;
 }
-
 fieldset#mw-searchoptions {
        margin: 0;
        padding: 0.5em 0.75em 0.75em 0.75em;