Remove unused colors from color palette

The color palette has been stripped down to a
maximum of two colors shades per palette. This
works for our design since components use a
base color with a lighter color as an accent
color. This change reduces the amount of CSS
generated by Bootstrap when the CSS is compiled.

Github Story: https://github.com/openbmc/webui-vue/issues/2

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I2ddb37f5c89c749a7303799c6f7499ddd83d5a92

1 files changed, 29 insertions, 0 deletions

diff --git a/docs/.vuepress/components/colors/colors.scss b/docs/.vuepress/components/colors/colors.scss
new file mode 100644
index 00000000..8da2023c
--- /dev/null
+++ b/docs/.vuepress/components/colors/colors.scss
@@ -0,0 +1,29 @@
+.color-tile-container {
+    display: grid;
+    grid-gap: 1rem;
+    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+    margin: 1rem 0;
+  }
+
+  .color-tile {
+    display: block;
+    height: 140px;
+
+    &--border {
+      border: 1px dashed #ccc;
+    }
+  }
+
+  .color-tile-desc {
+    margin: 0.5rem 0;
+  }
+
+  .color-tile-desc dt {
+    display: inline;
+    font-weight: bold;
+  }
+
+  .color-tile-desc dd {
+    display: inline;
+    margin: 0;
+  }
\ No newline at end of file