resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.highlightCircles.seenunseen.less

   1 @import 'mw.rcfilters.mixins';
   2 @import 'mw.rcfilters.variables';
   3
   4 .mw-rcfilters-ui-changesListWrapperWidget {
   5         ul {
   6                 list-style: none;
   7
   8                 li {
   9                         list-style: none;
  10                 }
  11         }
  12
  13         & > div {
  14                 margin-right: @margin-circle-result;
  15         }
  16 }
  17
  18 // Make more specific for the overrides
  19 div.mw-rcfilters-ui-highlights {
  20         body.mw-rcfilters-ui-initialized & {
  21                 display: inline-block;
  22                 .mw-rcfilters-circle( @size-circle-result, @size-circle-result, 0 );
  23         }
  24
  25         &-color {
  26                 &-none {
  27                         display: inline-block;
  28
  29                         .mw-changeslist-watchedseen & {
  30                                 .mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
  31                                         .mw-rcfilters-circle-color( @highlight-none, true, @highlight-grey, true );
  32                                 }
  33
  34                                 .mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
  35                                         .mw-rcfilters-circle-color( @highlight-none, true, @highlight-bluedot, true );
  36                                 }
  37                         }
  38
  39                         .mw-changeslist-watchedunseen & {
  40                                 .mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
  41                                         .mw-rcfilters-circle-color( @highlight-grey, true, @highlight-grey );
  42                                 }
  43
  44                                 .mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
  45                                         .mw-rcfilters-circle-color( @highlight-bluedot, true, @highlight-bluedot );
  46                                 }
  47                         }
  48
  49                 }
  50
  51         }
  52
  53         // Watchlist unseen highlighted fixes
  54         // Seen (empty circle)
  55         // There's no need to correct 'unseen' because that would be
  56         // a filled colorful circle, which is the regular rendering
  57         .mw-changeslist-watchedseen &-c1 {
  58                 .mw-rcfilters-circle-color( @highlight-c1, true, @highlight-c1, true );
  59         }
  60
  61         .mw-changeslist-watchedseen &-c2 {
  62                 .mw-rcfilters-circle-color( @highlight-c2, true, @highlight-c2, true );
  63         }
  64
  65         .mw-changeslist-watchedseen &-c3 {
  66                 .mw-rcfilters-circle-color( @highlight-c3, true, @highlight-c3, true );
  67         }
  68
  69         .mw-changeslist-watchedseen &-c4 {
  70                 .mw-rcfilters-circle-color( @highlight-c4, true, @highlight-c4, true );
  71         }
  72
  73         .mw-changeslist-watchedseen &-c5 {
  74                 .mw-rcfilters-circle-color( @highlight-c5, true, @highlight-c5, true );
  75         }
  76 }