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         }
  23
  24         &-color {
  25                 &-none {
  26                         display: inline-block;
  27                         .mw-rcfilters-circle( @size-circle-result, @size-circle-result, 0 );
  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                 // Watchlist unseen highlighted fixes
  52                 // Seen (empty circle)
  53                 // There's no need to correct 'unseen' because that would be
  54                 // a filled colorful circle, which is the regular rendering
  55                 .mw-changeslist-watchedseen &-c1 {
  56                         .mw-rcfilters-circle-color( @highlight-c1, true, @highlight-c1, true );
  57                 }
  58
  59                 .mw-changeslist-watchedseen &-c2 {
  60                         .mw-rcfilters-circle-color( @highlight-c2, true, @highlight-c2, true );
  61                 }
  62
  63                 .mw-changeslist-watchedseen &-c3 {
  64                         .mw-rcfilters-circle-color( @highlight-c3, true, @highlight-c3, true );
  65                 }
  66
  67                 .mw-changeslist-watchedseen &-c4 {
  68                         .mw-rcfilters-circle-color( @highlight-c4, true, @highlight-c4, true );
  69                 }
  70
  71                 .mw-changeslist-watchedseen &-c5 {
  72                         .mw-rcfilters-circle-color( @highlight-c5, true, @highlight-c5, true );
  73                 }
  74         }
  75 }