From b0d0e54754ae0ad039e53486b11c3d55f3376002 Mon Sep 17 00:00:00 2001 From: Derk-Jan Hartman Date: Fri, 27 May 2016 23:44:25 +0200 Subject: [PATCH] Separate Special:Search styling info into separate module Almost all styling of this page has little to do with the JS module. Separating it into a styles module. Also made the selector for the JS elements far simpler, as there was no reason for being overly specific here. Bug: T136363 Change-Id: I96a35f930be26b26f139120f3e5b23c33a5d019e --- includes/specials/SpecialSearch.php | 2 +- resources/Resources.php | 4 + .../mediawiki.special.search.css | 178 +----------------- .../mediawiki.special.search.styles.css | 172 +++++++++++++++++ 4 files changed, 180 insertions(+), 176 deletions(-) create mode 100644 resources/src/mediawiki.special/mediawiki.special.search.styles.css diff --git a/includes/specials/SpecialSearch.php b/includes/specials/SpecialSearch.php index d474ba5222..e14fcf5b03 100644 --- a/includes/specials/SpecialSearch.php +++ b/includes/specials/SpecialSearch.php @@ -105,7 +105,7 @@ class SpecialSearch extends SpecialPage { $out = $this->getOutput(); $out->allowClickjacking(); $out->addModuleStyles( [ - 'mediawiki.special', 'mediawiki.special.search', 'mediawiki.ui', 'mediawiki.ui.button', + 'mediawiki.special', 'mediawiki.special.search.styles', 'mediawiki.ui', 'mediawiki.ui.button', 'mediawiki.ui.input', 'mediawiki.widgets.SearchInputWidget.styles', ] ); $this->addHelpLink( 'Help:Searching' ); diff --git a/resources/Resources.php b/resources/Resources.php index 2d1e92154e..343722d49b 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -1894,6 +1894,10 @@ return [ 'powersearch-togglenone', ], ], + 'mediawiki.special.search.styles' => [ + 'styles' => 'resources/src/mediawiki.special/mediawiki.special.search.styles.css', + 'targets' => [ 'desktop', 'mobile' ], + ], 'mediawiki.special.undelete' => [ 'scripts' => 'resources/src/mediawiki.special/mediawiki.special.undelete.js', ], diff --git a/resources/src/mediawiki.special/mediawiki.special.search.css b/resources/src/mediawiki.special/mediawiki.special.search.css index 850957e748..aad784e222 100644 --- a/resources/src/mediawiki.special/mediawiki.special.search.css +++ b/resources/src/mediawiki.special/mediawiki.special.search.css @@ -1,181 +1,9 @@ -/* Special:Search */ - -/* - * Fixes sister projects box moving down the extract - * of the first result (bug #16886). - * It only happens when the window is small and - * This changes slightly the layout for big screens - * where there was space for the extracts and the - * sister projects and thus it showed like in any - * other browser. - * - * This will only affect IE 7 and lower - */ -.searchresult { - display: inline !ie; -} -.searchresults { - margin: 1em 0 1em .4em; -} -/* needs extra specificity to override `.mw-body p` selector */ -.mw-body p.mw-search-nonefound { - margin: 0; -} -.mw-search-interwiki-header { - font-weight: bold; -} -.mw-search-nonefound + .mw-search-interwiki-header { - margin-top: 0; -} -div.searchresult { - font-size: 95%; - width: 38em; -} -.mw-search-results { - margin-left: 0; - float: left; -} -.mw-search-results li { - padding-bottom: 1.2em; - list-style: none; - list-style-image: none; -} -.mw-search-results li a { - font-size: 108%; -} -.mw-search-result-data { - color: #008000; - font-size: 97%; -} -.mw-search-profile-tabs { - background-color: #f3f3f3; - margin-top: 1em; - border: 1px solid #c0c0c0; -} -.mw-search-profile-tabs div.search-types { - float: left; - padding-left: 0.25em; -} -.mw-search-profile-tabs div.search-types ul { - margin: 0; - padding: 0; - list-style: none; -} -.mw-search-profile-tabs div.search-types ul li { - float: left; - margin: 0; - padding: 0; -} -.mw-search-profile-tabs div.search-types ul li a { - display: block; - padding: 0.5em; -} -.mw-search-profile-tabs div.search-types ul li.current a { - color: #333; - cursor: default; -} -.mw-search-profile-tabs div.search-types ul li.current a:hover { - text-decoration: none; -} -#mw-search-top-table div.results-info { - float: right; - padding: 0.5em; - padding-right: 0.75em; - color: #666; - font-size: 95%; -} - -fieldset#mw-searchoptions { - margin: 0; - padding: 0.5em 0.75em 0.75em 0.75em; - border: none; - background-color: #f9f9f9; - border: 1px solid #c0c0c0; - border-top-width: 0; -} -fieldset#mw-searchoptions legend { - display: none; -} -fieldset#mw-searchoptions h4 { - padding: 0; - margin: 0; - float: left; -} -fieldset#mw-searchoptions div#mw-search-togglebox { +#mw-search-togglebox { float: right; } -fieldset#mw-searchoptions div#mw-search-togglebox label { +#mw-search-togglebox label { margin-right: 0.25em; } -fieldset#mw-searchoptions div#mw-search-togglebox input { +#mw-search-togglebox input { margin-left: 0.25em; } -fieldset#mw-searchoptions table { - float: left; - margin-right: 3em; - border-collapse: collapse; -} -fieldset#mw-searchoptions table td { - padding: 0 1em 0 0; - white-space: nowrap; -} -fieldset#mw-searchoptions div.divider { - clear: both; - border-bottom: 1px solid #ddd; - padding-top: 0.5em; - margin-bottom: 0.5em; -} -td#mw-search-menu { - padding-left: 6em; - font-size: 85%; -} -div#mw-search-interwiki { - float: right; - width: 18em; - border: 1px solid #aaa; - margin-top: 2ex; -} -div#mw-search-interwiki li { - font-size: 95%; -} -.mw-search-interwiki-more { - float: right; - font-size: 90%; -} -div#mw-search-interwiki-caption { - text-align: center; - font-weight: bold; - font-size: 95%; -} -.mw-search-interwiki-project { - font-size: 97%; - text-align: left; - padding: 0.15em 0.15em 0.2em 0.2em; - background-color: #ececec; - border-top: 1px solid #bbb; -} -span.searchalttitle { - font-size: 95%; -} -div.searchdidyoumean { - font-size: 127%; - margin-top: 0.8em; - /* Note that this color won't affect the link, as desired. */ - color: #c00; -} -div.searchdidyoumean em { - font-weight: bold; -} -.searchmatch { - font-weight: bold; -} -/* Advanced PowerSearch box */ -td#mw-search-togglebox { - text-align: right; -} -table#mw-search-powertable { - width: 100%; -} -form#powersearch { - clear: both; -} diff --git a/resources/src/mediawiki.special/mediawiki.special.search.styles.css b/resources/src/mediawiki.special/mediawiki.special.search.styles.css new file mode 100644 index 0000000000..75889c38e1 --- /dev/null +++ b/resources/src/mediawiki.special/mediawiki.special.search.styles.css @@ -0,0 +1,172 @@ +/* Special:Search */ + +/* + * Fixes sister projects box moving down the extract + * of the first result (bug #16886). + * It only happens when the window is small and + * This changes slightly the layout for big screens + * where there was space for the extracts and the + * sister projects and thus it showed like in any + * other browser. + * + * This will only affect IE 7 and lower + */ +.searchresult { + display: inline !ie; +} +.searchresults { + margin: 1em 0 1em .4em; +} +/* needs extra specificity to override `.mw-body p` selector */ +.mw-body p.mw-search-nonefound { + margin: 0; +} +.mw-search-interwiki-header { + font-weight: bold; +} +.mw-search-nonefound + .mw-search-interwiki-header { + margin-top: 0; +} +div.searchresult { + font-size: 95%; + width: 38em; +} +.mw-search-results { + margin-left: 0; + float: left; +} +.mw-search-results li { + padding-bottom: 1.2em; + list-style: none; + list-style-image: none; +} +.mw-search-results li a { + font-size: 108%; +} +.mw-search-result-data { + color: #008000; + font-size: 97%; +} +.mw-search-profile-tabs { + background-color: #f3f3f3; + margin-top: 1em; + border: 1px solid #c0c0c0; +} +.mw-search-profile-tabs div.search-types { + float: left; + padding-left: 0.25em; +} +.mw-search-profile-tabs div.search-types ul { + margin: 0; + padding: 0; + list-style: none; +} +.mw-search-profile-tabs div.search-types ul li { + float: left; + margin: 0; + padding: 0; +} +.mw-search-profile-tabs div.search-types ul li a { + display: block; + padding: 0.5em; +} +.mw-search-profile-tabs div.search-types ul li.current a { + color: #333; + cursor: default; +} +.mw-search-profile-tabs div.search-types ul li.current a:hover { + text-decoration: none; +} +#mw-search-top-table div.results-info { + float: right; + padding: 0.5em; + padding-right: 0.75em; + color: #666; + font-size: 95%; +} + +fieldset#mw-searchoptions { + margin: 0; + padding: 0.5em 0.75em 0.75em 0.75em; + border: none; + background-color: #f9f9f9; + border: 1px solid #c0c0c0; + border-top-width: 0; +} +fieldset#mw-searchoptions legend { + display: none; +} +fieldset#mw-searchoptions h4 { + padding: 0; + margin: 0; + float: left; +} +fieldset#mw-searchoptions table { + float: left; + margin-right: 3em; + border-collapse: collapse; +} +fieldset#mw-searchoptions table td { + padding: 0 1em 0 0; + white-space: nowrap; +} +fieldset#mw-searchoptions div.divider { + clear: both; + border-bottom: 1px solid #ddd; + padding-top: 0.5em; + margin-bottom: 0.5em; +} +td#mw-search-menu { + padding-left: 6em; + font-size: 85%; +} +div#mw-search-interwiki { + float: right; + width: 18em; + border: 1px solid #aaa; + margin-top: 2ex; +} +div#mw-search-interwiki li { + font-size: 95%; +} +.mw-search-interwiki-more { + float: right; + font-size: 90%; +} +div#mw-search-interwiki-caption { + text-align: center; + font-weight: bold; + font-size: 95%; +} +.mw-search-interwiki-project { + font-size: 97%; + text-align: left; + padding: 0.15em 0.15em 0.2em 0.2em; + background-color: #ececec; + border-top: 1px solid #bbb; +} +span.searchalttitle { + font-size: 95%; +} +div.searchdidyoumean { + font-size: 127%; + margin-top: 0.8em; + /* Note that this color won't affect the link, as desired. */ + color: #c00; +} +div.searchdidyoumean em { + font-weight: bold; +} +.searchmatch { + font-weight: bold; +} +/* Advanced PowerSearch box */ +td#mw-search-togglebox { + text-align: right; +} +table#mw-search-powertable { + width: 100%; +} +form#powersearch { + clear: both; +} -- 2.20.1