Merge "Remove the localStorage replication of the block cookie"
[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / styles / mw.rcfilters.ui.CapsuleItemWidget.less
index c70da38..b16e84c 100644 (file)
@@ -5,20 +5,34 @@
        border-color: #979797;
        color: #222;
 
-       &-muted {
+       // Background and color of the capsule widget need a bit
+       // more specificity to override ooui internals
+       &-muted.oo-ui-capsuleItemWidget.oo-ui-widget-enabled {
                // Muted state
                background-color: #eaecf0;
                border-color: #c8ccd1;
+
                .oo-ui-labelElement-label {
                        color: #72777d;
                }
+               .oo-ui-buttonWidget {
+                       opacity: @muted-opacity;
+               }
+       }
+
+       &-conflicted.oo-ui-capsuleItemWidget.oo-ui-widget-enabled {
+               background-color: #fee7e6; // Red90 AAA
+               border-color: #b32424; // Red30 AAA
 
+               .oo-ui-labelElement-label {
+                       color: #b32424;
+               }
                .oo-ui-buttonWidget {
                        opacity: @muted-opacity;
                }
        }
 
-       &-selected {
+       &-selected.oo-ui-capsuleItemWidget.oo-ui-widget-enabled {
                background-color: #eaf3ff;
                border-color: #36c;
        }
                }
 
                &[data-color='c1'] {
-                       .mw-rcfilters-mixin-circle( @highlight-c1, 0.7em, ~'0 0.5em 0 0' );
+                       .mw-rcfilters-mixin-circle( @highlight-c1, 10px, ~'0 0.5em 0 0' );
                }
                &[data-color='c2'] {
-                       .mw-rcfilters-mixin-circle( @highlight-c2, 0.7em, ~'0 0.5em 0 0' );
+                       .mw-rcfilters-mixin-circle( @highlight-c2, 10px, ~'0 0.5em 0 0' );
                }
                &[data-color='c3'] {
-                       .mw-rcfilters-mixin-circle( @highlight-c3, 0.7em, ~'0 0.5em 0 0' );
+                       .mw-rcfilters-mixin-circle( @highlight-c3, 10px, ~'0 0.5em 0 0' );
                }
                &[data-color='c4'] {
-                       .mw-rcfilters-mixin-circle( @highlight-c4, 0.7em, ~'0 0.5em 0 0' );
+                       .mw-rcfilters-mixin-circle( @highlight-c4, 10px, ~'0 0.5em 0 0' );
                }
                &[data-color='c5'] {
-                       .mw-rcfilters-mixin-circle( @highlight-c5, 0.7em, ~'0 0.5em 0 0' );
+                       .mw-rcfilters-mixin-circle( @highlight-c5, 10px, ~'0 0.5em 0 0' );
                }
        }
 }