Fixing search results percentage width

The width of search results on SpecialSearch
page was set to 60% to accomodate the interwiki
results sidebar. As seen on:
https://phabricator.wikimedia.org/T149806

This modification should be moved to the
interwikiwidget.styles.less file so it doesn't
interfere with results when the intwiki
widget is not active.

Bug: T159806
Change-Id: Ib9bdc501c8b0eccbcc84abe399a38d10c9a5d20f

diff --git a/resources/src/mediawiki.special/mediawiki.special.search.interwikiwidget.styles.less b/resources/src/mediawiki.special/mediawiki.special.search.interwikiwidget.styles.less
index 04da3db..0b0f912 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.search.interwikiwidget.styles.less
+++ b/resources/src/mediawiki.special/mediawiki.special.search.interwikiwidget.styles.less
@@ -1,16 +1,6 @@
 /* interwiki search results */
 /*==========================*/
 
-#mw-interwiki-results {
-       width: 30%;
-       display: inline-block;
-       margin-left: 10%;
-}
-
-.searchresults .mw-search-createlink {
-       float: left;
-}
-
 .iw-headline {
        font-weight: bold;
        font-size: 1rem;
@@ -187,37 +177,20 @@ to resemble a traditional dictionary definition */
        text-align: right;
 }
 
-/* no results
-span the interwiki results across the bottom of the page.
-*/
+/* desktop only */
 
-.mw-search-nonefound ~ #mw-search-interwiki {
-       width: 100%;
-}
+@media only screen and ( min-width: @deviceWidthTablet ) {
 
-.mw-search-nonefound ~ #mw-search-interwiki .iw-resultset {
-       width: 30%;
-       max-width: 300px;
-       margin-left: 0.5em;
-       margin-right: 0.5em;
-}
-
-/* mobile */
-/* stylelint-disable declaration-no-important */
-@media only screen and ( max-width: 768px ) {
        #mw-interwiki-results {
-               width: 100%;
-               margin-left: 0;
-       }
-       .mw-search-results {
-               max-width: none !important;
+               width: 30%;
+               display: inline-block; /* used to align iw sidebar with the top of the main search results*/
+               margin-left: 10%;
        }
-       .iw-resultset {
-               width: 100% !important;
-               margin-left: 0 !important;
-               margin-right: 0 !important;
-               max-width: none !important;
+       .searchresults .mw-search-createlink,
+       .searchresults .mw-search-nonefound,
+       .searchresults .mw-search-results {
+               float: left;
+               width: 60%;
        }
 
 }
-/* stylelint-enable declaration-no-important */

diff --git a/resources/src/mediawiki.special/mediawiki.special.search.styles.css b/resources/src/mediawiki.special/mediawiki.special.search.styles.css
index 89f5132..72ede97 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.search.styles.css
+++ b/resources/src/mediawiki.special/mediawiki.special.search.styles.css
@@ -32,9 +32,9 @@
 
 .mw-search-results {
        margin: 0;
-       float: left;
-       max-width: 60%;
+       max-width: 38em;
 }
+
 .mw-search-visualclear {
        clear: both;
 }