Makes adding colors easier

Just map your colors, the bulma way ($name: ($color[,$invert]) into $custom-colors, and import bulma.
Note that, you can provide only the color as the inverted would be computed from it.

diff --git a/sass/utilities/derived-variables.sass b/sass/utilities/derived-variables.sass
index 92a71075e89f2f1ddbf2bdb28ae0be7b4a7b0f07..64f19d113f66c01e0dd230ae14ee52f7a5193464 100644 (file)
--- a/sass/utilities/derived-variables.sass
+++ b/sass/utilities/derived-variables.sass
@@ -75,8 +75,9 @@ $size-medium: $size-5 !default
 $size-large: $size-4 !default
 
 // Lists and maps
+$custom-colors: null !default
 
-$colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "link": ($link, $link-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default
+$colors: colorMap(("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "link": ($link, $link-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)), $custom-colors) !default
 $shades: ("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis) !default
 
-$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
+$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
\ No newline at end of file

diff --git a/sass/utilities/functions.sass b/sass/utilities/functions.sass
index e38d1727cd83a65eaa5624cb0cf1081442504afc..d76b484a9c052655823c29859bf6a99ac1a1fd26 100644 (file)
--- a/sass/utilities/functions.sass
+++ b/sass/utilities/functions.sass
@@ -1,3 +1,25 @@
+@function colorMap($bulma-colors, $custom-colors)
+  // we return at least bulma hardcoded colors
+  $merged-colors: $bulma-colors
+  // we want a map as input
+  @if type-of($custom-colors) == 'map'
+    @each $name, $components in $custom-colors
+      // color name should be a string and colors pair a list with at least one element
+      @if type-of($name) == 'string' and (type-of($components) == 'list' or type-of($components) == 'color') and length($components) >= 1
+        $color-base: nth($components, 1)
+        $color-invert: null
+        // is an inverted color provided ?
+        @if length($components) > 1
+          $color-invert: nth($components, 2)
+        // we only want a color as base color
+        @if type-of($color-base) == 'color'
+          // if inverted color is not provided or is not a color we compute it
+          @if type-of($color-invert) != 'color'
+            $color-invert: findColorInvert($color-base)
+          // we merge this colors elements as map with bulma colors (we can override them this way, no multiple definition for the same name)
+          $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert)))
+  @return $merged-colors
+
 @function powerNumber($number, $exp)
   $value: 1
   @if $exp > 0