Fork me on GitHub

Manage your ITCSS structure from command line.

itcss new comp buttons
create source/assets/stylesheets/components/_components.buttons.sass
update source/assets/stylesheets/application.sass

Why?

We love ITCSS. But it can be hard to grow fluidly.

“While writing I felt I spent much more time moving and
organizing the CSS than I would normally do...”

Anders Grendstadbakk,

trying ITCSS for the first time.

Creating new modules and importing them takes a precious time and ends up you wishing they come in a single package. But this would go against one of the best CSS practices:

Import only what you really uses

That's why itcsscli were created. So you can create ITCSS modules, install inuitcss files independently and import it all into your sass base file automatically without breaking your workflow abruptly.

Installation

itcsscli is a very simple and small RubyGem. To install it on your computer must have ruby and then install the gem from your terminal:

gem install itcsscli

If this command fails, you can force it prepending `sudo`.

Setting up

You can setup itcsscli interactively:

itcss init
Well done! Let`s configure your itcss.yml:
Provide the root folder name where the ITCSS file structure should be built:
source/assets/stylesheets
What is the name of your base sass file (all ITCSS modules will be imported into it):
application
Are you using a package manager? [ y / n ]
y
Choose your package manager [ bower / npm ]:
bower
itcss.yml successfully created!

Usage

Now that everything seems to be configured, you can run itcss commands from the root of your project:

itcss new comp buttons
create source/assets/stylesheets/components/_components.buttons.sass
update source/assets/stylesheets/application.sass
itcss new tr helpers
create source/assets/stylesheets/helpers/_helpers.buttons.sass
update source/assets/stylesheets/application.sass
itcss update
update source/assets/stylesheets/application.sass

Inuitcss

Download and import inuitcss modules should not be that hard. That’s why we decided to add inuit commands to itcsscli. They use your package manager to download the external modules and import it all into your sass base file.

itcss inuit new objects.buttons
using bower to install inuit objects.buttons dependency...
inuit-buttons#0.4.2 bower_components/inuit-buttons
├── inuit-defaults#0.2.3
└── inuit-functions#0.2.0
update itcss.yml. [added objects.buttons]
update source/assets/stylesheets/application.css.sass

There's more!

itcsscli provides you a fully automated documentation so you can take a deep overview of your work without opening thousands of files.