bulma-material-form icon indicating copy to clipboard operation
bulma-material-form copied to clipboard

How to build custom material form styles?

Open alrik opened this issue 6 years ago • 0 comments

Hi @dbtek,

thank you for this nice bulma add-on.

Whats your opinion on splitting the current main.sass into two files. One for generating the standalone bulma-material-form.css file and the other for being included into custom bulma builds.


My requirements are the following:

  1. I want to install bulma and bulma-material-form via npm.
  2. I want to adjust styles via custom variables.
  3. I want to compile one stylesheet (via gulp or what ever tool).

So as an developer i would like to be able to include your lib into my custom bulma.scss file like:

bulma.scss

@import "variables";
@import "../../node_modules/bulma/bulma";
@import "../../node_modules/bulma-material-form/src/main";

_variables.scss

@import "../../node_modules/bulma/sass/utilities/initial-variables";

/* bulma settings */
$family-sans-serif: 'SuperFont', sans-serif;
$primary: #aabbcc;

/* bulma material form settings */
$mf-font-size: 1.25rem;

@import "../../node_modules/bulma/sass/utilities/_all";

When i tried this out, i got the expected sass error:

Message:
    node_modules/bulma-material-form/src/main.sass
Error: File to import not found or unreadable: ../node_modules/bulma/sass/utilities/variables.
       Parent style sheet: ***/node_modules/bulma-material-form/src/main.sass
        on line 1 of node_modules/bulma-material-form/src/main.sass
>> @import "../node_modules/bulma/sass/utilities/variables";

alrik avatar Sep 04 '17 11:09 alrik