1 files changed, 71 insertions, 0 deletions
diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
new file mode 100644
index 0000000..3a81165
--- /dev/null
+++ b/src/scss/_variables.scss
@@ -0,0 +1,71 @@
+
+$varient: "dark";
+
+$white: #e4e6eb;
+$white-alt: #b0b3b8;
+$black: #000000;
+$black-alt: #1d2129;
+$red: #f02849;
+$red-alt: #f02849;
+$green: #30ab5a;
+$green-alt: #39b463;
+$blue: #1778f2;
+$blue-alt: #1d85fc;
+$yellow: #dcde81;
+$yellow-alt: #808037;
+$grey-100: #18191a;
+$grey-200: #242526;
+$grey-300: #3a3b3c;
+$grey-400: #4e4f50;
+$grey-500: #606770;
+$grey-700: #dadde1;
+$grey-800: #f0f2f5;
+$grey-900: #fff;
+
+$base: null !default;
+$surface0: null !default;
+$surface1: null !default;
+$surface2: null !default;
+$text: null !default;
+$subtext: null !default;
+$btntext: null !default;
+
+@if $varient == "dark" {
+  $base: $grey-100;
+  $surface0: $grey-200;
+  $surface1: $grey-300;
+  $surface2: $grey-400;
+  $text: $white;
+  $subtext: $white-alt;
+  $btntext: $white;
+}
+
+@if $varient == "light" {
+  $base: $grey-900;
+  $surface0: $grey-900;
+  $surface1: $grey-800;
+  $surface2: $grey-700;
+  $text: $black;
+  $subtext: $black-alt;
+  $btntext: $grey-500;
+}
+
+$font: "Helvetica Neue", Helvetica, Verdana, Courier, monospace;
+$header-font: "Facebook";
+
+$scale: 16px;
+$outer-gap: $scale;
+$inner-gap: $scale;
+$inner-inner-gap: $scale * 0.75;
+$outer-radius: $scale / 2;
+$inner-radius: $scale / 3;
+$font-size: $scale;
+$font-size-small: $scale * 0.75;
+
+$header-height: $scale * 3.5;
+
+$base-z-index: 1;
+$header-z-index: 2;
+$modal-z-index: 5;
+
+$content-width: $scale * 40;