# Roger Style Guide Helpers to create styleguides. ## What's in it? ### Components ### Generator Quick & easy component generation: `roger generate component NAME` will generate this structure in your components path: ``` NAME.html.erb _NAME.html.erb _NAME.scss ``` Options for the command are: * `--js` : Will generate a `NAME.js` file too * `--extension=EXT` : Will generate a `_NAME.EXT` instead of `_NAME.html.erb` #### Helper The `component` function is simplification of the `partial` function. Taking this directory structure: ``` html |- components |- my_component | |- _my_component.html.erb |- other_component |- _other_component.html.erb |- _other_component_variant.html.erb ``` You can call `component('my_component', a: "b")` which will render the partial `components/my_component/_my_component.html.erb` with locals `{a: "b"}`. If you want to render another componentpartial you can also call `component('other_component/other_component_variant')`. The base `components` path can be configured by setting `RogerStyleGuide.components_path` to a path within the HTML directory. ### Toc The `toc` function is used to display table of contents of your Roger mockup. It's pretty simple: `toc(PATH_TO BUILD TOC FROM)`. See `toc_helper.rb` file for more info on options and lower level function. ## Mustache Roger Styleguide adds support for Mustache templates including support for components as Mustache partials. Rendering mustache templates is just as easy as doing `<%= component("bla") %>` which will render `components/bla/bla.mst` if it exists. If you also have regular partials you can force using the mustache template by doing `<%= component("bla.mst") %>`. ## Installation Add this line to your application's Gemfile: ```ruby gem 'roger_styleguide' ``` And then execute: $ bundle Or install it yourself as: $ gem install roger_styleguide ## Contributing 1. Fork it ( https://github.com/digitpaint/roger_style_guide/fork ) 2. Create your feature branch (`git checkout -b my-new-feature`) 3. Commit your changes (`git commit -am 'Add some feature'`) 4. Push to the branch (`git push origin my-new-feature`) 5. Create a new Pull Request