housecss

A Functional CSS Library Built for Rapid Iteration. Created and maintained by the House House folks — @bengroulx and @durfee.

⚠️ WIP Warning: This is certainly a work in progress. We wouldn't recommend using this in a production project yet. Expect a proper release in the next couple months as soon as we get some time.

Usage

Via npm: (yarn coming soon)

$ npm install --save housecss

via unpkg:

<link rel="stylesheet" href="https://unpkg.com/housecss@latest/css/housecss.min.css">

Using the Framework

Welcome to housecss! This functional CSS framework should be used as a foundation for you and your team to get set up and working on a project as quickly as possible. Whether you are expanding housecss locally, or contributing back upstream to the housecss repo, we encourage you write CSS according our code guidelines and conventions:

1. Write CSS as if someone is using it to learn how code. It needs to be sensible and learnable for new front-end developers and designers — everyone should be able to get going with housecss speedily. We achieve this by writing well-documented code.
2. Housecss is content-agnostic, meaning HTML and CSS are completely separate from one another. If you hide all styles from your template, the HTML should be well-structured and semantically correct, formatted and arranged in a logical hierarchy. That also means classes should be self-documenting and independent of elements. The exception is components, which are directly coupled to markup or other styles.
3. Follow the Code of Conduct at all times.

Note: When contributing back upstream, run postcss with: npm run build && npm run minify. Additionally, be sure to check it with CSS Stats to make sure the stylesheet is still maintainable.

Future things

• Demo site
• Better docs

More to come ✌️✌🏻✌🏼✌🏽✌🏾✌🏿