Chalarangelo/mini.css

Generated css

k0fi opened this issue · 2 comments

k0fi commented

I have generated a falavor using https://minicss.org/flavors#build-your-own-flavor and now I have a mini-custom.scss.
How am I supposed to make a css file out of this?

FrancoisCapon commented

Your mini-custom.zip file doesn't contains a mini-custom.css and a mini-custom.min.css files a the root?

k0fi commented

Well, modifying .css files is not fun, especially when you discover the power of scss.
So I solved the configuration problem like this:

  1. Download mini.css-master from github
  2. Copy the src folder to my project's css folder.
  3. Install Live Sass Compiler to my vscode
    3.b Assign the output path in the compiler's configuration if you want to specify where the resulting .css should go:
    "liveSassCompile.settings.formats": [{
        "format": "compressed",
        "extensionName": ".min.css",
        "savePath": "/css/mini-modified/dist"
    }

otherwise it saves generated .css in the same folder as corresponding .scss

  1. Live Sass compiler watches the changes which I make to any of the *.scss files in css/mini folder and generates css output mini-default.scss and whatever other .scss file is in css/flavor and put them in savePath defined for it.
  2. Remove unwanted mini-*.css from css/flavor folder, so that only the desired .css is generated. Very handy!