jamiller619/tachyons.js

Tachyons helper function for JavaScript. Built with PostCSS Modules.

tachyons.js

Easily add tachyons to your project when using a bundler. Built with PostCSS & PostCSS Modules.

Setup

The setup is a two-step process:

• Include the '@jamr/tachyons.js' file in your JavaScript files where needed. This exposes a single function that accepts tachyon css class names as a string or array of strings.
• Include, only once, the tachyons css. This can be done via an import statement in a css file, or by including it in a style tag in your html.

Example

import tachyons from '@jamr/tachyons.js'

const classNames = 'pa3 center sans-serif'
// or
const classNames = ['pa3', 'center', 'sans-serif']

const App = () => <div className={tachyons(classNames)} />

and in your a css file:

@import '@jamr/tachyons.js/tachyons.css';

More info

The three main files:

• tachyons.js - The helper file to use in your import statements.
• tachyons.css - The unmodified tachyons.css file that needs to be included in your site/app.
• tachyons.css.json - The JSON mapping with transformed class names generated by PostCSS Modules.