resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.FilterMenuHeaderWidget.less

   1 @import 'mediawiki.skin.variables.less';
   2 @import 'mw.rcfilters.variables.less';
   3 @import 'mediawiki.mixins.less';
   4
   5 .mw-rcfilters-ui-filterMenuHeaderWidget {
   6         &-title {
   7                 display: inline-block;
   8                 font-size: 1.2em;
   9                 padding: 0.75em 0 0.75em 0.5em;
  10                 color: @color-subtle;
  11         }
  12
  13         &-helpIcon {
  14                 position: absolute;
  15                 top: 50%;
  16                 transform: translateY( -50% );
  17         }
  18
  19         &-header {
  20                 background-color: @background-color-neutral-subtle;
  21                 border-bottom: @border-subtle;
  22
  23                 &-highlight {
  24                         min-width: 1em;
  25                         // Using the same padding that the filter item
  26                         // uses, so the button is aligned with the highlight
  27                         // buttons for the filters
  28                         padding-right: (12 / @font-size-system-ui / @font-size-vector);
  29                         // Set the left-padding here, so that the invert buttons have the same padding
  30                         padding-left: (12 / @font-size-system-ui / @font-size-vector);
  31                 }
  32
  33                 &-back {
  34                         .mw-rcfilters-ui-filterMenuHeaderWidget-backButton:first-child {
  35                                 // Overwrite `.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child`
  36                                 margin-left: 0;
  37                         }
  38                 }
  39
  40                 &-title {
  41                         position: relative;
  42                         flex-grow: 1;
  43                 }
  44         }
  45
  46         .mw-rcfilters-ui-cell {
  47                 align-self: center;
  48         }
  49 }