JigSass Generic Reset

A minimal and considered CSS reset

The JigSass reset is meant to compliment jigsass-generic-normalize (though it does not depend on it), and removes margins paddings and font-sizes from selected element, as well as sets the default global box-sizing to border-box.

Installation

Using npm:

npm i -S jigsass-generic-reset

Usage

@import 'path/to/jigsass-generic-reset/scss/index';

Like all other JigSass modules, all css output is opt-in, and needs to be explicitly @included. Simply importing it will not affect your generated css.

JigSass Reset offers mixins for including each of the reset submodules, and a shortcut mixin, jigsass-reset, to include all parts at once.

The styles of each JigSass Normalize submodule will only be included a single time, where they were imported

Please check the documentation for more details on the available mixins and their use.

Development

It is a best practice for JigSass modules to not automatically generate css on @import, but rather have to user explicitly enable the generation of specific styles from the module.

Contributions in the form of pull-requests, issues, bug reports, etc. are welcome. Please feel free to fork, hack or modify JigSass Generic Reset in any way you see fit.

Writing documentation

Good documentation is crucial for scalability and maintainability. When contributing, please do make sure that all Sass functionality (functions, mixins, variables and placeholder selectors) is well documented.

Documentation is auto-generated using SassDoc

Running tests

gulp lint will, well, lint the contents scss files in the scss directory.

gulp test with run module's test using Mocha and Sassaby.

gulp tdd will watch both the Sass files and the test specs for changes, and will run tests automatically upon them.

Writing tests

JigSass Generic Reset tests are written using Sassaby and Mocha. Spec files are located in the test directory.

Mocha allows us to place a call to before() in the root of any test file and it will be run once, before all the other tests in every test_*.js file. We can also require() files and assign them to the global object to make them available to all test_*.js files.

jigsass-generic-reset uses a file called helper.js can be used to set up mocha globals requires and before().

In addition to Sassaby's testing functions, jigsass-generic-reset makes a few Sass functions available to the test suite, for use inside Sassaby tests:

jig-var-equals($value, $var) -> {boolean}

Check if a variable equals a value.
$value {*}: A value to compare the value of $var to.
$var {*}: The variable to test

jig-var-type-is($type, $var) -> {boolean}

Check if a variable is of a certain type.
$type {string}: A type to compare with the type of $var.
$var {*}: The variable to test

jig-map-key-equals($value, $map, $keys...) -> {boolean}

Check if a map's key is assigned a cerain value.
$value {*}: A value to compare the value of a key in $map with.
$map {map}: The map to test.
$keys... {arglist}: A recursive chain of keys.

jig-map-key-type-is($type, $map, keys...) -> {boolean}

Check if a map's key is of a certain type
$type {string}: A type to compare with the type of $var.
$map {map}: The map to test.
$keys... {arglist}: A recursive chain of keys.

File structure

┬ ./
│
├─┬ scss/ 
│ └─ index.scss # The module's importable file.
│
├── sassdoc/    # Generated documentation 
│               # of the module's sass features
└─┬─ test/
  │
  ├─┬ helpers/
  │ │
  │ ├── importer.scss       # Used for easilty importing tested scss files
  │ │
  │ └── _test_helpers.scss  # JigSass's assertion helpers,
  │                         # for use inside Sassaby tests.
  │                         
  ├── helper.js              # Used for defining global `before()`
  │                          # functions and requiring modules.
  │                         
  └── test_jigsass-generic-reset  # Specs. Mocha will automatically 
                             # run all javascript files located
                             # in the `test` directory.

License: MIT