pnx-mixtape-coverart

Builder for kss-node, designed by PreviousNext

Requires KKS-node 3.0.x

This is a custom builder for kss-node living styleguide.

Custom properties

This template supports a couple of custom properties which need to be added to your projects kssOptions in order to access utilise them. Custom properties can be added to the CSS files doc comment.

const kssOptions = {
  ...
  builder: pnx-mixtape-coverart,
  custom: [
    'wrapper',
    'default',
    'wide',
  ],
  ...
};

The options are;

wrapper - add any class to the example div, works nicely for ‘container’ classes that you don’t really want inside the markup, but are necessary for making the grid align nicely. eg. // Wrapper: page-container

default - hides the default example and only shows modifiers. eg. // Default: false

wide - removes horizontal padding from the example div for components that should extend past the container. eg. // Wide: true

Script type=module

To support modern ES6 modules, a new mjs option is now available. Simply list these javascript files in the kssOptions:

const kssOptions = {
  ...
  builder: pnx-mixtape-coverart,
  css: [...],
  js: [...],
  mjs: [
    'relative/path/to/module.js',
    'relative/path/to/anothermodule.js'
  ],
  ...
};

Any javascript files loaded by the mjs option will be output with <script type="module" src="path/to/file.js"></script>.

How to apply this builder

1. Install kss-node. Type npm install kss or npm install -g kss for global CLI.
2. Install this template npm install pnx-mixtape-coverart@alpha
3. Run kss-node command with --builder option, like below.

kss-node <sourcedir> --builder path/to/pnx-mixtape-coverart

This is a dev version of pnx-mixtape-coverart