MOBILE-3021 styles: Make it easy to change ionic colors

src/theme/variables.scss

@@ -35,7 +35,6 @@ $core-color:      $orange;
 // --------------------------------------------------
 @import "bmma";
 
-
 $blue-light:      mix($blue, white, 20%) !default; // Background.
 $blue-dark:       darken($blue, 10%) !default;
 
@@ -76,19 +75,31 @@ $content-padding: 10px;
 // colors so you can add, rename and remove colors as needed.
 // The "primary" color is the only required color in the map.
 
+$primary: $core-color !default;
+$secondary: $turquoise !default;
+$danger: $red !default;
+$light: $gray-lighter !default;
+$color-gray: $gray-dark !default;
+$dark: $black !default;
+$warning: $yellow !default;
+$success: $green !default;
+$info: $blue !default;
+$inverted-base: $white !default;
+$inverted-contrast: $primary !default;
+
 $colors: (
-  primary:    $core-color,
+  primary:    $primary,
-  secondary:  $turquoise,
+  secondary:  $secondary,
-  danger:     $red,
+  danger:     $danger,
-  light:      $gray-lighter,
+  light:      $light,
-  gray:       $gray-dark,
+  gray:       $color-gray,
-  dark:       $black,
+  dark:       $dark,
-  warning:    $yellow,
+  warning:    $warning,
-  success:    $green,
+  success:    $success,
-  info:       $blue,
+  info:       $info,
   inverted: (
-    base: $white,
+    base: $inverted-base,
-    contrast: $core-color
+    contrast: $inverted-contrast
   )
 );