resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.LiveUpdateButtonWidget.less

   1 .mw-rcfilters-ui-liveUpdateButtonWidget {
   2         &.oo-ui-toggleWidget-on {
   3                 position: relative;
   4                 overflow: hidden;
   5                 &:after {
   6                         content: '';
   7                         mix-blend-mode: screen;
   8                         position: absolute;
   9                         width: 1.875em;
  10                         height: 1.875em;
  11                         top: 1.875em / 4;
  12                         left: 0.46875em;
  13                         background: rgba( 51, 102, 204, 0.5 );
  14                         border-radius: 100%;
  15                         transform-origin: 50% 50%;
  16                         opacity: 0;
  17                         animation: ripple 1.2s ease-out infinite;
  18                         animation-delay: 1s;
  19                 }
  20         }
  21 }
  22
  23 @keyframes ripple {
  24         0%,
  25         35% {
  26                 transform: scale( 0 );
  27                 opacity: 1;
  28         }
  29         50% {
  30                 transform: scale( 1.5 );
  31                 opacity: 0.8;
  32         }
  33         100% {
  34                 opacity: 0;
  35                 transform: scale( 4 );
  36         }
  37 }