CSS Variables with Gorko

[BenFictional]

Love the theme!

I'm trying to implement CSS variables within the _config.scss by following the Gorko documentation and am not having any luck.

I know there's a separate _variables.scss file, but I would rather have the variables defined in Gorko and have them used in the utility classes.

I've cloned the Gorko custom props demo project, and can successfully generate custom props there and drop them into the utility classes... That proejct uses the basic sass processor, as opposed to mix, so I'm wondering if it's something with how that is processing (or failing to process) the SASS?

I sometimes get an error message reading:

ERROR in ./resources/scss/main.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: $map: "color" is not a map.
   ╷
12 │   $item-value: map-get($items, $value-key);
   │                ^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  node_modules/gorko/src/mixins/_apply-utility.scss 12:16  apply-utility()

Here's my config config code:

'css-vars': (
    'color': $gorko-colors
  ),
  'bg': (
    'items': 'color',
    'css-vars': true,
    'output': 'standard',
    'property': 'background'
  ),
  'color': (
    'items': 'color',
    'css-vars': true,
    'output': 'standard',
    'property': 'color'
  ),
etc.

I've updated sass-loader and other node modules to the latest versions.

[josephdyer]

Hey, I think this might've been fixed in the new releases, I'm not 100% sure though.