CSS + Styleguide Usage

[gauntface]

At the moment the main index.html page pulls in h5bp.css and main.css.

h5bp.css

Has some CSS which is "opinionated defaults". These should be rolled into the style guide - opinionated defaults is what the style guide is for

Pull in styles.css

At the moment the main index.html doesn't pull in the styles which means the style guide is complete separate. My gut instinct is that we should pull in styles.css into the main page and use uncss to remove it OR expect the user to be using tooling, in which case create a "main.sass" and import the necessary styles from sass files which build into the styleguide.

Since we know what the default styles will be for main.sass would could include a build of main.css so non-tool using developers will have the same styles between styleguide and index.

Perhaps name the imported styleguide styles to "imports.sass" and "imports.css"

[addyosmani]

Some thoughts:

I think whatever we do, we should make sure that users are still able to get access to the styles without the use of tooling (so a checked in version of the compiled Sass styles should always be available).

In terms of moving H5BP to the visual style guide source - that makes sense. It reduces the number of files they need to think about and makes it clear that there are page layout specific styles (which will vary based on the layout you're using) and general style guide styles that give you everything else.

So, the final setup for index.html would include main.css and styles.css. styles could probably have a better name which could similarly sync up with the naming we find in the Sass directory. I think "imports.css" is nice, but I wonder if it would be clearer if we used something like "site.css" (meaning your site/app wide styles).

Any other thoughts on naming? I like the idea of using UnCSS to trim down the styles we ship to get around the user not necessarily using everything the style guide gives you.

[addyosmani]

This has since been refactored. Going to document in readme.