How to use tachyons-custom?

Question

I am using Tachyons CSS for my web app and I need to add a width css property of width 45% for medium screen. I did npm install tachyons-custom and I don't know what to do next. I couldn't find any tutorial online about adding a new tachyons property.

Can anyone give me a little guide? Thank you.

Answer 1

You'll first need to clone the actual tachyons-css repo and get set up for local dev.

Once you have the source files locally, you can add .w-45 { width: 45%; } (I presume) in the "tachyons-custom/src/_widths.css" file.

Don't forget to add the .w-45-ns and the rest if you want these, too.

Once you've done this, run npm build.

Now, tachyons-custom/css/tachyons.css will contain the new classes!