[Feature/Question] How to use CSS variables?

[super2ni]

This is about Bulma.

Overview of the problem

This is about the Bulma CSS framework

I'm using Bulma 0.7.5.
My browser is: Chrome

Description

I do not know if it's a Feature request or a Question, but I would like to be able to override the Sass variables by CSS variables. The final goal is to offer the end user to be able to customize the theme of the site by updating some CSS variables using Javacript.
Right now, I'm pretty sure it's not possible, but I am ok do discuss the subject, offer solutions and even implement them.

Steps to Reproduce

1. Set CSS variables, for instance:
   :root { --primary: red; }
2. Using SCSS, override Bulma variables. For instance:
   $primary:var(--primary, blue) !default;
   `
3. Import Bulma SASS files:
   @import "~bulma/sass/utilities/_all";

Expected behavior

Be able to compile and update CSS variables using Javascript syntax:
document.documentElement.style .setProperty('--primary', 'pink');

Actual behavior

Compile and see a Sass-loader error.

[Grovkillen]

#1837 and scroll down

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.