Add ability to render a reference table

[tech-radar.git] / src / stylesheets / base.scss

diff --git a/src/stylesheets/base.scss b/src/stylesheets/base.scss
index 4a59d22..a6fbd7d 100644 (file)
--- a/src/stylesheets/base.scss
+++ b/src/stylesheets/base.scss
@@ -1,7 +1,7 @@
 @import 'colors';
 
 body {
-  font: 9px 'Open Sans';
+  font: 11px 'Open Sans';
 }
 
 svg {
@@ -28,16 +28,46 @@ svg {
   }
 
   text {
-    .blip-text {
+    &.first, &.second, &.third, &.fourth {
+      font-size: 16px;
+      font-weight: bold;
+    }
+
+    &.blip-text {
+      font-size: 9px;
       font-style: italic;
       fill: $white;
     }
 
-    .line-text {
-      font-size: 16px;
+    &.line-text {
       font-weight: bold;
       text-transform: uppercase;
       fill: $black;
     }
   }
 }
+
+.radar-ref-table {
+  width: 1080px;
+  font-size: 16px;
+  line-height: 26px;
+  padding: 20px;
+
+  tr:nth-child(odd) {
+    background: $grey-darkest;
+  }
+
+  tr:nth-child(even) {
+    background: $grey;
+  }
+
+  td {
+    padding: 10px 15px;
+  }
+
+  tr.radar-ref-status-group {
+    font-size: 20px;
+    font-weight: bold;
+    background: $grey-lightest;
+  }
+}