FUNT Add Sass vars for color customization

diff --git a/src/styles/app.scss b/src/styles/app.scss
index f986a37..f08ff56 100644 (file)
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -1,3 +1,8 @@
+$colors: (
+  primary:          #00ADDC,
+  font:             #999999
+);
+
 @import "main.scss";
 @import "svg.scss";
 @import "portrait.scss";

diff --git a/src/styles/main.scss b/src/styles/main.scss
index 226509e..5aca22b 100644 (file)
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -6,7 +6,7 @@ html {
 body {
     font-size: 1.2rem;
     font-family: Arial;
-    color: #999999;
+    color: map-get($colors, font);
     margin: 5%;
 
     .parent {

diff --git a/src/styles/svg.scss b/src/styles/svg.scss
index eddbbe5..2aa0441 100644 (file)
--- a/src/styles/svg.scss
+++ b/src/styles/svg.scss
@@ -4,7 +4,7 @@ body {
         polygon,
         linearGradient,
         rect {
-            fill: #00ADDC !important;
+            fill: map-get($colors, primary) !important;
         }
 
         circle {