via npm

npm install --save roolith-css

Then import roolith-css into your SCSS file

@import "PATH/TO/node_modules/roolith-css/src/sass/roolith";

if you wish to override default settings

@import "PATH/TO/node_modules/roolith-css/sass/function"; @import "./your-settings"; @import "PATH/TO/node_modules/roolith-css/src/sass/roolith";

How to activate dark theme?

@import "PATH/TO/node_modules/roolith-css/sass/function"; @import "./your-settings"; @import "PATH/TO/node_modules/roolith-css/src/sass/roolith"; @include roolith-theme-dark(); /* add theme-dark class to body */

Important: And add class theme-dark to body tag or if you want a certain portion to be dark then add theme-dark class to parent container.

via yarn

yarn add roolith-css

via bower

bower install roolith-css

Traditional

Download CSS and inject into header, that's it!

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>roolith css framework</title> <link rel="stylesheet" href="path/to/roolith.min.css"> </head> <body> <!-- page content --> </body> </html>

CDN unpkg

<link rel="stylesheet" href="https://unpkg.com/roolith-css@1.7.2/dist/css/roolith.min.css">

CDN jsdelivr

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/roolith-css@1.7.2/dist/css/roolith.min.css">

Dark version

<link rel="stylesheet" href="https://unpkg.com/roolith-css@1.7.2/dist/css/roolith-dark.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/roolith-css@1.7.2/dist/css/roolith-dark.min.css">

Changelog

v1.7.2 - Added dark version of CSS in default bundle and updated documentation