Bulma: Invalid output when declaring a custom shade map

[Tomuke]

This is about Bulma.

Overview of the problem

When declaring a custom shade map, the colour helper functions for "has-background-{shade}" and "has-text-{shade}" outputs in an invalid css format.

This issue was previously reported but has been subsequently closed without a fix.

Description

Using Bulma 0.7.4, I am trying to define custom shades and add a color to it (i.e. fuchsia). I need to find a way for having the corresponding helper classes generated (.has-text-fuchsia .has-background-fuchsia).

Steps to Reproduce

Add $fuchsia to $custom-shades, like so:

$fuchsia: #d705a3
$custom-shades: ("fuchsia": $fuchsia);

When I do that, Bulma first runs mergeColorMaps and then generates the classes, except the ones corresponding to $custom-shades are wrong, because findColorInvert is also called, which adds #fff as the default inverted color.

This works without problems if I use $custom-colors (either specifying the inverted color or not).

Expected behavior

The CSS output should be:

.has-text-fuchsia { color: #d705a3 !important; }

Actual behavior

The CSS output is:

.has-text-fuchsia { color: #d705a3, #fff !important; }

[jgthms]

Indeed, that's an issue. Let me look into it.

[matheusgrieger]

Is there a future release date for this fix?

[bostrom]

@jgthms Any plans on releasing a new version with this fix soon?

[twaiiiin]

I still see this problem on version 0.8.0. Anyone else has this problem?

[twaiiiin]

I still see this problem on version 0.8.0. Anyone else has this problem?

In base/helpers.sass, should update :

@each $name, $shade in $shades
  $shade: nth($shade, 1)
  .has-text-#{$name}
    color: $shade !important
  .has-background-#{$name}
    background-color: $shade !important

The line $shade: nth($shade, 1) is missing.

[matheusgrieger]

This issue is still happening, and it actually got even worse than on previous versions, as now the resulting color: holds four values.

[CalamarBicefalo]

I am seeing the same behaviour in 9.0.0, as @matheusgrieger pointed out with 4 values now.

[matheusgrieger]

This issue is definitely not closed as I still see four values for has-text-[shadeName] on Bulma 0.9.1.