Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/selectize/selectize.js/issues/1886 below:

Cannot import selectize scss styles into my project · Issue #1886 · selectize/selectize.js · GitHub

I did:

• Search for if my issue has already been submitted
• Make sure I'm reporting something precise that needs to be fixed
• Give my issue a descriptive and concise title
• Create a minimal working example on JsFiddle or Codepen
  (or gave a link to a demo on the Selectize docs)
• Indicate precise steps to reproduce in numbers and the result,
  like below

First, I cannot find any documentation how to correctly include selectize into my project (with exception of brief example on https://selectize.dev/docs.html but that does not mention scss).

I am trying to include selectize into my scss file with:

@import "node_modules/@selectize/selectize/dist/scss/selectize.bootstrap4.scss";

But the compilation ends with this error:

Error in plugin "sass"
Message:
    node_modules/@selectize/selectize/dist/scss/selectize.scss
Error: File to import not found or unreadable: ../plugins/drag_drop/plugin.scss.
        on line 93 of node_modules/@selectize/selectize/dist/scss/selectize.scss
        from line 60 of node_modules/@selectize/selectize/dist/scss/selectize.bootstrap4.scss
        from line 5 of src/scss/selectize.scss
        from line 86 of src/scss/sbc-gui.scss
>> @import "../plugins/drag_drop/plugin.scss";

The dist/scss/selectize.scss file contain wrong paths for importing plugins. If I either fix those:

@import "../plugins/drag_drop/plugin.scss";
@import "../plugins/dropdown_header/plugin.scss";
@import "../plugins/optgroup_columns/plugin.scss";
@import "../plugins/remove_button/plugin.scss";
@import "../plugins/clear_button/plugin.scss";

to

@import "./plugins/drag_drop.scss";
@import "./plugins/dropdown_header.scss";
@import "./plugins/optgroup_columns.scss";
@import "./plugins/remove_button.scss";
@import "./plugins/clear_button.scss";

or if I use scss file form src folder instead of dist:

@import "node_modules/@selectize/selectize/src/scss/selectize.bootstrap4.scss";

I got another error:

Error in plugin "sass"
Message:
    node_modules/@selectize/selectize/src/scss/selectize.scss
Error: Invalid CSS after "...top: round(math": expected expression (e.g. 1px, bold), was ".div(-1 * $select-a"
        on line 355 of node_modules/@selectize/selectize/src/scss/selectize.scss
        from line 60 of node_modules/@selectize/selectize/src/scss/selectize.bootstrap4.scss
        from line 6 of src/scss/selectize.scss
        from line 86 of src/scss/sbc-gui.scss
>>     margin-top: round(math.div(-1 * $select-arrow-size, 2));

   --------------------------^

What am I doing wrong? Do I have to use different sass compiler? Mine is node-sass. Or do I have to set some variables in my scss before importing selectize?

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4