❤
npm
Sign UpSign In

style-seeds

1.1.0 • Public • Published

Style Seeds

A customizable boilerplate CSS file distributed as an NPM package.

npm install style-seeds --save-dev

Cane be used in conjunction with various Normalize projects such as…

Instructions

:root {
  --root-font-size: 100%;
  --root-font-family: sans-serif;
  --root-font-style: normal;
  --root-line-height: 1.5;
}
 
/* scoped variables! */
hr {
  --hr-color: #ccc;
  --hr-margin: 1rem;
  border: 0;
  border-top: 1px solid var(--hr-color);
  display: block;
  height: 1px;
  margin-bottom: var(--hr-margin);
  margin-top: var(--hr-margin);
}

base.css root vars

Customize your base vars by declaring elements like so…

@import base.css;
 
hr {
  --hr-color: red;
}
 
/* output is red! */

These variable overrides can be done prior to your base.css import or after; It doesn't matter!

hr {
  --hr-color: red;
}
 
@import base.css;
 
/* output is still red! */

For a further dive check out this CSS-Tricks article explaining how to use scoped variables in your CSS.

Readme

Keywords

Package Sidebar

Install

npm i style-seeds

Repository

github.com/trendyminds/style-seeds

Homepage

github.com/trendyminds/style-seeds#readme

Weekly Downloads

1

Version

1.1.0

License

MIT

Unpacked Size

10.5 kB

Total Files

5

Last publish

Collaborators

  • aaronbushnell
  • tmidennis
Try on RunKit
Report malware