blob: e9c982a86ce07534345dcc006256c51c85dd39f7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
@import 'mediawiki.ui/variables';
@import 'mw.rcfilters.mixins';
@import 'mw.rcfilters.variables';
.mw-rcfilters-ui-tagItemWidget {
// Background and color of the capsule widget need a bit
// more specificity to override OOUI internals
&.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled {
// Muted state
background-color: @colorGray14;
border-color: @colorGray12;
.oo-ui-labelElement-label {
color: @colorGray7;
}
.oo-ui-buttonWidget {
opacity: @muted-opacity;
}
}
&.oo-ui-flaggedElement-invalid.oo-ui-tagItemWidget.oo-ui-widget-enabled {
.oo-ui-labelElement-label {
color: @colorDestructiveActive;
}
}
// OOUI classes require super-specificity in order to override
// the white background
// The specificity is fixed in the patch: https://gerrit.wikimedia.org/r/#/c/349525/
// and will be available in the next OOUI release.
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined &-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
background-color: @background-color-primary;
border-color: @colorProgressive;
}
&-popup-content {
padding: 0.5em;
color: @colorGray5;
}
&.oo-ui-labelElement .oo-ui-labelElement-label {
cursor: pointer;
}
&-highlight {
display: none;
margin-right: 0.5em;
width: 10px;
&-highlighted {
display: inline-block;
}
&:before {
content: '';
position: absolute;
display: block;
top: 50%;
}
&[ data-color='c1' ]:before {
.mw-rcfilters-mixin-circle( @highlight-c1, 10px, ~'-5px 0.5em 0 0' );
}
&[ data-color='c2' ]:before {
.mw-rcfilters-mixin-circle( @highlight-c2, 10px, ~'-5px 0.5em 0 0' );
}
&[ data-color='c3' ]:before {
.mw-rcfilters-mixin-circle( @highlight-c3, 10px, ~'-5px 0.5em 0 0' );
}
&[ data-color='c4' ]:before {
.mw-rcfilters-mixin-circle( @highlight-c4, 10px, ~'-5px 0.5em 0 0' );
}
&[ data-color='c5' ]:before {
.mw-rcfilters-mixin-circle( @highlight-c5, 10px, ~'-5px 0.5em 0 0' );
}
}
}
|
