resources/src/mediawiki.rcfilters/styles/mw.rcfilters.variables.less

   1 // “External” variables
   2 @font-size-system-ui: 16; // Assumed browser default of `16px`
   3 @font-size-vector: 0.875em; // equals `14px` at browser default of `16px`
   4
   5 // RCFilters variables
   6 @background-color-base: #fff;
   7 @background-color-primary: #eaf3ff;
   8 @color-base--inverted: #fff;
   9
  10 // Colors not on WikimediaUI color palette
  11 @light-gray: #dee0e3;
  12 @light-green: #ccdecc;
  13
  14 // Highlight color definitions
  15 @highlight-none: #fff;
  16 @highlight-c1: #36c;
  17 @highlight-c2: #00af89;
  18 @highlight-c3: #fc3;
  19 @highlight-c4: #ff6d22;
  20 @highlight-c5: #d33;
  21 @highlight-bluedot: #1d4aad; // Simulates the 'known' browser <li> blue dot
  22 @highlight-grey: #54595d; // The color of full dots on Watchlist when highlight is enabled
  23
  24 // Muted state
  25 @muted-opacity: 0.5;
  26
  27 // Circles
  28 @min-size-circle: 20px;
  29 @size-circle: 20 / @font-size-system-ui / @font-size-vector;
  30 @margin-circle: 5 / @font-size-system-ui / @font-size-vector;
  31
  32 // Result list circle indicators
  33 // Defined and used in mw.rcfilters.ui.ChangesListWrapperWidget.less
  34 @margin-circle-result: 3px;
  35 // In these small sizes, 'em' appears
  36 // squished and inconsistent.
  37 // Pixels are better for this use case:
  38 @size-circle-result: 6px;
  39
  40 // Color picker circles
  41 @min-size-circle-colorpicker: 30px;
  42 @size-circle-colorpicker: 30 / @font-size-system-ui / @font-size-vector;