generating background-color utilities


Topic: generating background-color utilities

cross_mk pro premium asked 2 years ago

*Expected behavior*I want to generate bg-color classes for all colors, using MDB Doc https://mdbootstrap.com/docs/standard/content-styles/colors/

but Its not working

Actual behavior

ERROR:Error: Invalid CSS after " ),": expected expression (e.g. 1px, bold), was ")," on line 19 of

Resources (screenshots, code snippets etc.)

@import "bootstrap/functions";
@import "bootstrap/variables";
@import "bootstrap/_mixins.scss";
@import "bootstrap/_utilities.scss";

$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans);

$utilities: map-merge( 
  $utilities,
   ( 
    "background-color": map-merge( 
      map-get($utilities, "background-color"),
      (
        values: map-merge(
          map-get(map-get($utilities, "background-color"), "values"),
          (
            $all-colors
          ),
        ),
      ),
    ),
  )
);

@import "bootstrap/scss/utilities/api";

any ideas?


Grzegorz Bujański staff answered 2 years ago

I need more information to check why it's not working for you.

  • How did you add the MDB in your project? Via NPM, via Zip?
  • What bundler are you using?
  • What does the full error look like?
  • What exact file and part of the code does the error point to?
  • Are you doing this in a SCSS or CSS file?

cross_mk pro premium commented 2 years ago

MDB was added via ZIP Working in Visual Studio Code on a Mac. The code above is an scss file. When compiling I get the following error

Error: Invalid CSS after " ),": expected expression (e.g. 1px, bold), was ")," on line 19 of sass


Grzegorz Bujański staff commented 2 years ago

How do you compile the code? using some plugin for vscode or are you using some bundler or framework for this? Does this tool use dart sass or node-sass? The error may occur if you are trying to compile code with a tool that uses node-sass. We haven't supported node-sass for some time and our code is written to be compatible with dart-sass. node-sass is unfortunately deprecated.


cross_mk pro premium answered 2 years ago

MDB was added via ZIP Working in Visual Studio Code on a Mac. The code above is an scss file. When compiling I get the following error

Error: Invalid CSS after " ),": expected expression (e.g. 1px, bold), was ")," on line 19 of sass


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 6.2.0
  • Device: iMac
  • Browser: Chrome
  • OS: MacOS
  • Provided sample code: No
  • Provided link: Yes
Tags