Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
..
Failed to load latest commit information.
lib
README.md
index.css
lg.css
md.css
package.json
responsive.css
sm.css

README.md

sircus-tools-space

npm version

Install

npm:

$ npm install sircus-tools-space sircus-variables

Usage

CSS:

@import "sircus-tools-space";
@import "sircus-variables";

html:

<div class="t-ma0"></div>
<div class="t-maMi"></div>
<div class="t-maTn"></div>
<div class="t-maXs"></div>
<div class="t-maSm"></div>
<div class="t-maMd"></div>
<div class="t-maLg"></div>
<div class="t-maXl"></div>
<div class="t-maHg"></div>
<div class="t-maGt"></div>

<div class="t-mt0"></div>
<div class="t-mtMi"></div>
<div class="t-mtTn"></div>
<div class="t-mtXs"></div>
<div class="t-mtSm"></div>
<div class="t-mtMd"></div>
<div class="t-mtLg"></div>
<div class="t-mtXl"></div>
<div class="t-mtHg"></div>
<div class="t-mtGt"></div>

<div class="t-mb0"></div>
<div class="t-mbMi"></div>
<div class="t-mbTn"></div>
<div class="t-mbXs"></div>
<div class="t-mbSm"></div>
<div class="t-mbMd"></div>
<div class="t-mbLg"></div>
<div class="t-mbXl"></div>
<div class="t-mbHg"></div>
<div class="t-mbGt"></div>

<div class="t-pa0"></div>
<div class="t-paMi"></div>
<div class="t-paTn"></div>
<div class="t-paXs"></div>
<div class="t-paSm"></div>
<div class="t-paMd"></div>
<div class="t-paLg"></div>
<div class="t-paXl"></div>
<div class="t-paHg"></div>
<div class="t-paGt"></div>

<div class="t-pt0"></div>
<div class="t-ptMi"></div>
<div class="t-ptTn"></div>
<div class="t-ptXs"></div>
<div class="t-ptSm"></div>
<div class="t-ptMd"></div>
<div class="t-ptLg"></div>
<div class="t-ptXl"></div>
<div class="t-ptHg"></div>
<div class="t-ptGt"></div>

<div class="t-pb0"></div>
<div class="t-pbMi"></div>
<div class="t-pbTn"></div>
<div class="t-pbXs"></div>
<div class="t-pbSm"></div>
<div class="t-pbMd"></div>
<div class="t-pbLg"></div>
<div class="t-pbXl"></div>
<div class="t-pbHg"></div>
<div class="t-pbGt"></div>

Responsive classes

@import "sircus-tools-space/responsive";
/*  OR  */
@import "sircus-tools-space/sm";
@import "sircus-tools-space/md";
@import "sircus-tools-space/lg";

e.g:

<div class="t-sm-pb0">...</div>
<div class="t-md-ptLg">...</div>
<div class="t-lg-mt0">...</div>

License

Released under the MIT license.