src/stylesheets/base.scss

   1 @import 'colors';
   2
   3 body {
   4   font: 11px 'Open Sans';
   5 }
   6
   7 svg {
   8   padding: 20px;
   9
  10   .first { fill: $green; }
  11   .second { fill: $blue; }
  12   .third { fill: $orange; }
  13   .fourth { fill: $violet; }
  14
  15   circle {
  16     &:nth-child(1) { stroke: none; fill: $grey-light; }
  17     &:nth-child(2) { stroke: none; fill: $grey; }
  18     &:nth-child(3) { stroke: none; fill: $grey-dark; }
  19     &:nth-child(4) { stroke: none; fill: $grey-darkest; }
  20   }
  21
  22   circle, polygon {
  23     stroke: $white;
  24   }
  25
  26   line {
  27     stroke: $grey-alpha-03;
  28   }
  29
  30   text {
  31     &.first, &.second, &.third, &.fourth {
  32       font-size: 16px;
  33       font-weight: bold;
  34     }
  35
  36     &.blip-text {
  37       font-size: 9px;
  38       font-style: italic;
  39       fill: $white;
  40     }
  41
  42     &.line-text {
  43       font-weight: bold;
  44       text-transform: uppercase;
  45       fill: $black;
  46     }
  47   }
  48 }
  49
  50 .radar-ref-table {
  51   width: 1080px;
  52   font-size: 16px;
  53   line-height: 26px;
  54   padding: 20px;
  55
  56   tr:nth-child(odd) {
  57     background: $grey-darkest;
  58   }
  59
  60   tr:nth-child(even) {
  61     background: $grey;
  62   }
  63
  64   td {
  65     padding: 10px 15px;
  66   }
  67
  68   tr.radar-ref-status-group {
  69     font-size: 20px;
  70     font-weight: bold;
  71     background: $grey-lightest;
  72   }
  73 }