🏘 House House’s functional CSS library, made to help our team build and iterate on web builds quickly and efficiently.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
css
src
.gitignore
README.md
code-of-conduct.md
license.md
package-lock.json
package.json
postcss.config.js

README.md

housecss-logo

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 ✌️✌🏻✌🏼✌🏽✌🏾✌🏿