[Feaure] Defining explicit dark mode color for a custom color.

[leonard84]

This is about Bulma.

Is it a bug/feature/question or do you need help?
Feature, probably

Overview of the problem

This is about the Bulma CSS framework

I'm using Bulma version [1.0.1]

I am sure this issue is not a duplicate?
Yes, as far as I can tell.

Description

I already asked this on Stackoverflow. Due to the lack of an answer, I guess that this is currently not possible. So, I'm opening this feature request.

I already figured out how to add a custom color to Bulma. Now, I want to know how I can get it to use a different color value in dark mode.

$groovy: #4298B8; 
// dark mode #286B86;

$custom-colors: (
        'groovy': $groovy
);

@use "bulma/sass" with (
  $custom-colors: $custom-colors,
);

What I want to achieve is that groovy uses #4298B8 for light mode and #286B86 for dark mode.

Steps to Reproduce

See code above, or checkout from repo.

Expected behavior

There is a way to define #286B86 as dark mode color for groovy

Actual behavior

There is no option to define an explicit dark mode color.

https://groovyconsole.dev/

[maerteijn]

Hi @leonard84,

See my comment on another issue how to do this with the current implementation of Bulma:

#3804 (comment)

I didn’t use a $custom-colors variable there but the principle stays the same: Override the css variables for the dark theme (with sass).