2 files changed, 48 insertions, 10 deletions
diff --git a/app/javascript/flavours/glitch/styles/arachnia/variables.scss b/app/javascript/flavours/glitch/styles/arachnia/variables.scss
index 870d68110..596501bce 100644
--- a/app/javascript/flavours/glitch/styles/arachnia/variables.scss
+++ b/app/javascript/flavours/glitch/styles/arachnia/variables.scss
@@ -1,10 +1,29 @@
 $classic-base-color: #160011;
-$classic-primary-color: #fff;
+$classic-primary-color: #c69;
 $classic-secondary-color: #906;
 $classic-highlight-color: #c08;
 
-$ui-base-color: $classic-base-color;
-$ui-primary-color: $classic-primary-color;
-$ui-secondary-color: $classic-secondary-color;
+$base-shadow-color: $black;
+$base-overlay-background: $black;
+$base-border-color: $white;
+
+$simple-background-color: $black;
+$valid-value-color: $success-green;
+$error-value-color: $error-red;
+
+$ui-base-color: $classic-base-color;                  // Darkest
+$ui-base-lighter-color: lighten($ui-base-color, 26%); // Lighter darkest
+$ui-primary-color: $classic-primary-color;            // Lighter
+$ui-secondary-color: $classic-secondary-color;        // Lightest
 $ui-highlight-color: $classic-highlight-color;
-$primary-text-color: #FFF;
+
+$primary-text-color: $white;
+$darker-text-color: $ui-primary-color;
+$dark-text-color: $ui-base-lighter-color;
+$secondary-text-color: $ui-secondary-color;
+$highlight-text-color: $ui-highlight-color;
+$action-button-color: $ui-base-lighter-color;
+
+$inverted-text-color: $ui-base-color;
+$lighter-text-color: $ui-base-lighter-color;
+$light-text-color: $ui-primary-color;
diff --git a/app/javascript/flavours/glitch/styles/seadrake/variables.scss b/app/javascript/flavours/glitch/styles/seadrake/variables.scss
index 88459ed59..31c92ac6d 100644
--- a/app/javascript/flavours/glitch/styles/seadrake/variables.scss
+++ b/app/javascript/flavours/glitch/styles/seadrake/variables.scss
@@ -1,10 +1,29 @@
 $classic-base-color: #001611;
-$classic-primary-color: #fff;
+$classic-primary-color: #096;
 $classic-secondary-color: #096;
 $classic-highlight-color: #0c8;
 
-$ui-base-color: $classic-base-color;
-$ui-primary-color: $classic-primary-color;
-$ui-secondary-color: $classic-secondary-color;
+$base-shadow-color: $black;
+$base-overlay-background: $black;
+$base-border-color: $white;
+
+$simple-background-color: $black;
+$valid-value-color: $success-green;
+$error-value-color: $error-red;
+
+$ui-base-color: $classic-base-color;                  // Darkest
+$ui-base-lighter-color: lighten($ui-base-color, 26%); // Lighter darkest
+$ui-primary-color: $classic-primary-color;            // Lighter
+$ui-secondary-color: $classic-secondary-color;        // Lightest
 $ui-highlight-color: $classic-highlight-color;
-$primary-text-color: #fff;
+
+$primary-text-color: $white;
+$darker-text-color: $ui-primary-color;
+$dark-text-color: $ui-base-lighter-color;
+$secondary-text-color: $ui-secondary-color;
+$highlight-text-color: $ui-highlight-color;
+$action-button-color: $ui-base-lighter-color;
+
+$inverted-text-color: $ui-base-color;
+$lighter-text-color: $ui-base-lighter-color;
+$light-text-color: $ui-primary-color;