Merge "Ensure LanguageCode::bcp47() returns a valid BCP 47 language code"

[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / styles / mw.rcfilters.ui.FilterMenuHeaderWidget.less

diff --git a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less
index 83fe189..928b483 100644 (file)
--- a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less
+++ b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less
@@ -1,12 +1,13 @@
 @import 'mediawiki.mixins';
+@import 'mediawiki.ui/variables';
+@import 'mw.rcfilters.variables';
 
 .mw-rcfilters-ui-filterMenuHeaderWidget {
        &-title {
                display: inline-block;
                font-size: 1.2em;
                padding: 0.75em 0 0.75em 0.5em;
-               // TODO: Unify colors with official design palette
-               color: #54595d;
+               color: @colorGray5;
        }
 
        &-helpIcon {
@@ -16,23 +17,27 @@
        }
 
        &-header {
-               border-bottom: 1px solid #c8ccd1;
-               background: #f8f9fa;
+               border-bottom: 1px solid @colorGray12;
+               background-color: @colorGray15;
 
                &-invert,
                &-highlight {
-                       width: 1em;
+                       min-width: 1em;
                        vertical-align: middle;
                        // Using the same padding that the filter item
                        // uses, so the button is aligned with the highlight
                        // buttons for the filters
-                       padding-right: 0.5em;
+                       padding-right: 12 / @font-size-system-ui / @font-size-vector;
                }
 
                &-back {
                        width: 1em;
                        vertical-align: middle;
-                       padding-left: 0.5em;
+
+                       .mw-rcfilters-ui-filterMenuHeaderWidget-backButton:first-child {
+                               // Overwrite `.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child`
+                               margin-left: 0;
+                       }
                }
 
                &-title {