backline-normalize v1.0.1
Backline Normalize
Based on normalize.css, but with some more opinionated additions.
Installation
npm install --save backline-normalize
or
yarn add backline-normalize
Add backline-normalize
to your node-sass includePaths option.
{
loader: 'sass-loader',
options: {
includePaths: [
...require('backline-normalize').includePaths
]
}
}
Import backline-normalize in each .scss
as required
@import 'backline-normalize';
Opinionated additions
Change the default box-sizing
Uses box-sizing: border-box
on the html
element, then box-sizing: inherit
for all other elements.
Remove all margin/padding
This allows elements to provide their own unique spacing, or for containers to space their child elements as required.
Un-style all headings
Detaches the semantics of the heading elements from how they look.
Un-style buttons
Removes the default background
, border
and border-radius
. The result looks morelike an anchor element and is an easier starting point point for adding custom styles.
Make images responsive by default
Images appear at their natural size by default, but scale down if their container is narrower.
Make small larger
Resets <small>
to look like regular text. The semantics of <small>
have moved away from just looking visually small, to now “represent side-comments and small print, including copyright and legal text, independent of its styled presentation”.