RubyDoc.info: File: README – Documentation for refills (0.1.0)

Prepackaged patterns and components built with Bourbon and Neat

Requirements

Sass 3.3+
Bourbon 4.0+
Neat 1.6+

Installation

Install Refills’ dependencies: Bourbon, Neat and jQuery (if you plan to use any components that require JavaScript).
Go to the Refills website, click “Show Code” under the component or pattern that you want and copy-paste it into your project.
Customize: Most of the components and patterns have a set of Sass variables that allow you to quickly tweak the look and feel.

Installation for Ruby on Rails

Alternative to copy-pasting manually, we also have a Refills gem that allows you to add components and patterns via Rake tasks.

Add Refills to your Gemfile:

  gem 'refills'

Then run:

  bundle install

Use the following Rails generators:

List all available snippets:

  rails generate refills:list

Add a snippet:

  rails generate refills:import SNIPPET

If you want to generate coffeescript instead of javascript, simply add --coffee

  rails generate refills:import SNIPPET --coffee

This copies the snippet’s partial to app/views/refills, the stylesheet to app/assets/stylesheets/refills and the JavaScript to app/assets/javascripts/refills

Miscellaneous

If your css reset file does not add webkit antialias, add the following code to your Scss file:

body {
  -webkit-font-smoothing: antialiased;
}

The Bourbon family

Bourbon: A simple and lightweight mixin library for Sass
Neat: A lightweight semantic grid framework for Sass and Bourbon
Bitters: Scaffold styles, variables and structure for Bourbon projects
Refills: Prepackaged patterns and components built with Bourbon, Neat and Bitters

Credits

Refills is maintained and funded by thoughtbot, inc. Tweet your questions or suggestions to @bourbonsass and while you’re at it follow us too.

Whenever code for Refills is borrowed or inspired by existing code, we try to credit the original developer/designer in our source code. Let us know if you think any credit is absent.