stylexicon

Stylexicon

Stylexicon provides a path on your rails site that has demo content for every tag included in the w3 html5 specification. This way, you can visit that page to see if your stylesheet defines acceptable ways to render each piece of content. This should make building a style guide for a site fairly easy.

It also provides a way to add custom modules to the lexicon. Why would you want to do that? Here's an example. Say you have a reusable piece of markup that looks like this:

<div class='image-grid-2x2'>
  <img ... /
   <img ... /
   <img ... /
   <img ... />
</div>

Assume that piece of content was supposed to generate a 2x2 grid of images. You could add that markup to the lexicon, and then add the styles. That way, a content maintainer (say, a developer writing a blog post) can view all of the available content pieces, and use that markup to keep the site's styling consistent, and keep the brand intact. You could also from that point on use the lexicon as a visual test suite, so that a quick glance verifies that you haven't accidentlly broken a style.

Installation

First, add the gem to your Gemfile like so:

gem 'stylexicon', :git => 'http://github.com/isotope11/stylexicon.git'

Then, mount it in your app:

mount Stylexicon::Engine => "/stylexicon"

Finally, run the server:

rails s

and hit http://localhost:3000/stylexicon

Development

To get started developing, do the following:

1. Fork the project on github.
2. Clone your fork locally.
3. Create a feature branch for the feature you wish to work on.
4. Make commits to this feature branch and push it to your github repo.
5. Open a pull request on this isotope11 repo.

Source: http://www.github.com/isotope11/stylexicon

Contributors

• Josh Adams
• Adam Dill

License

This code is released under the MIT License. See the MIT-LICENSE file for details. Feel free to reuse this code for your own purposes, but we'd really prefer it if you'd contribute your changes back to us. Thanks.