RCFilters UI: Add hover effect on filter list items
[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / styles / mw.rcfilters.ui.FilterItemWidget.less
1 @import 'mediawiki.mixins';
2
3 .mw-rcfilters-ui-filterItemWidget {
4 padding: 0 0.5em;
5 .box-sizing( border-box );
6
7 &:hover {
8 background-color: #f8f9fa; // Base90 AAA
9 }
10
11 .mw-rcfilters-ui-table {
12 padding-top: 0.5em;
13 }
14
15 &-muted {
16 background-color: #f8f9fa; // Base90 AAA
17 .mw-rcfilters-ui-filterItemWidget-label-title,
18 .mw-rcfilters-ui-filterItemWidget-label-desc {
19 color: #54595d; // Base20 AAA
20 }
21 }
22
23 &-selected {
24 background-color: #eaf3ff; // Accent90 AAA
25 }
26
27 &-label {
28 &-title {
29 font-weight: bold;
30 font-size: 1.15em;
31 color: #222;
32 }
33 &-desc {
34 color: #464a4f;
35 }
36 }
37
38 &-filterCheckbox {
39 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline {
40 // Override margin-top and -bottom rules from FieldLayout
41 margin: 0 !important; /* stylelint-disable-line declaration-no-important */
42 }
43 }
44
45 &-highlightButton {
46 width: 4em;
47 padding-left: 1em;
48 }
49 }