┌── src │ ├── css │ │ ├── 1-settings │ │ ├── 2-tools │ │ ├── 3-generic │ │ ├── 4-base │ │ ├── 5-objects │ │ ├── 6-components │ │ ├── 7-scopes │ │ ├── 8-trumps │ │ └── index.convy.scss │ ├── js │ │ ├── scopes [smart components] │ │ ├── components [dumb components] │ │ ├── actions │ │ ├── reducers │ │ ├── register-service-worker.js │ │ ├── index.convy.js │ │ ├── store.js │ │ └── route.js │ ├── font │ └── img └── dest
It stands for Inverted Triangle CSS. It is a fully managed CSS architecture. It's not a framework or library; there's nothing to download or install. It's a collection of principles and metrics by which developers should group and order their CSS in order to keep it scalable, terse, logical, and manageable. It's very specifically opinionated in that it gives definite rules and guidelines for your source order and groupings, but it leaves decisions about naming conventions and preprocessors etc. up to you.
The ITCSS philosophy is a simple one at its core. Basically that we should order CSS by metrics defined by the language (and its features) than by the usual standard of human-oriented patterns. ITCSS takes CSS and writes it in a way that browsers and the design of the language can best utilise, which gives us far better scalability and maintainability than we'd get if we were to write CSS around how a person thinks.
That said, the move to ITCSS (both conceptually and in practice) is not a huge shock to the system as you might imagine; it basically just rewires a couple of fundamentals and then it's business as usual.
It is a tool for compiling node-flavored commonjs modules for the browser. You can use browserify to organize your code and use third-party libraries.
This software is a Node.js implementation of Knyle Style Sheets (KSS). This is a documentation syntax for CSS, that's intended to have syntax readable by humans and machines. The kss-node software can be used to create a living style guide.
Write human-readable documentation using KSS syntax comments. Have the kss tool automatically build a style guide from your stylesheets. Michelangelo is the custom template for the KSS-node living style guide. Have a look here to get started with the template and the kss-node syntax.