guardian/frontend — pull request #5493 by paulrobertlloyd (2014-08-11 13:36:19+00:00)
Title: Document common patterns using Hologram

Read [Hologram](https://github.com/trulia/hologram) formatted comments in Sass stylesheets (currently those saved under /stylesheets/common/modules) and generate a style guide that lives within /docs/styleguide/.

The following styles have been documented as a test sample:
* charts/_doughnuts.scss
* facia/_pagination.scss
* _media.scss
* _social.scss
* _stars.scss
* _tabs.scss
* _tag.scss

## Known issues/questions:
* Index page is given the wrong title (‘Facia’, rather than ‘Charts’). This is a bug in Hologram, I think.
* Currently, any components that require JS to fully function, don’t (tabs for example).
* Templates mimic the structural HTML of the website. Without being tied to the Scala templates, these will likely break without continued maintenance.
* Mixing section front and article components on the same page is problematic as they use different breakpoints and appear within different structural layouts.
* Requires the HTML to be written twice, which isn’t very DRY.
* In the first set of styles I’ve documented, I’ve omitted `js-` classes, and `data-` attributes. Is this the right approach?

Idea is to live with this, and then adapt and improve where we see issues.