1 @import 'mediawiki.ui/variables';
2 @import 'mw.rcfilters.mixins';
3 @import 'mw.rcfilters.variables';
5 .mw-rcfilters-ui-tagItemWidget {
6 // Background and color of the capsule widget need a bit
7 // more specificity to override OOUI internals
8 &.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled {
10 background-color: @colorGray14;
11 border-color: @colorGray12;
13 .oo-ui-labelElement-label {
17 opacity: @muted-opacity;
21 &.oo-ui-flaggedElement-invalid.oo-ui-tagItemWidget.oo-ui-widget-enabled {
22 .oo-ui-labelElement-label {
23 color: @colorDestructiveActive;
27 // OOUI classes require super-specificity in order to override
28 // the white background
29 // The specificity is fixed in the patch: https://gerrit.wikimedia.org/r/#/c/349525/
30 // and will be available in the next OOUI release.
31 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined &-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
32 background-color: @background-color-primary;
33 border-color: @colorProgressive;
41 &.oo-ui-labelElement .oo-ui-labelElement-label {
51 display: inline-block;
61 &[data-color='c1']:before {
62 .mw-rcfilters-mixin-circle( @highlight-c1, 10px, ~'-5px 0.5em 0 0' );
65 &[data-color='c2']:before {
66 .mw-rcfilters-mixin-circle( @highlight-c2, 10px, ~'-5px 0.5em 0 0' );
69 &[data-color='c3']:before {
70 .mw-rcfilters-mixin-circle( @highlight-c3, 10px, ~'-5px 0.5em 0 0' );
73 &[data-color='c4']:before {
74 .mw-rcfilters-mixin-circle( @highlight-c4, 10px, ~'-5px 0.5em 0 0' );
77 &[data-color='c5']:before {
78 .mw-rcfilters-mixin-circle( @highlight-c5, 10px, ~'-5px 0.5em 0 0' );