RailsLayout Gem RailsLayout Gem

RailsLayout is a utility gem to use during development.

It is a Rails generator that you add to your Rails application Gemfile.

Use it to set up a front-end framework:

  • Twitter Bootstrap 2.3
  • Twitter Bootstrap 3.0
  • Zurb Foundation 4.0

It will rename application.css.css to application.css.scss.

And modify the necessary asset files:

  • application.js

and add either:

  • bootstrap_and_overrides.css.scss

or:

  • foundation_and_overrides.css.scss

It will set up a default application layout.

You also get partials for

  • Rails flash messages
  • navigation links

Supported Frameworks

You can generate layout files suitable for use with the following front-end frameworks:

  • simple – simple layout
  • bootstrap2 – Twitter Bootstrap 2.3
  • bootstrap3 – Twitter Bootstrap 3.0
  • foundation4 – Zurb Foundation 4.0
  • none – removes all changes

Generated Files

The RailsLayout gem generates application layout files:

  • app/views/layouts/application.html.erb
  • app/views/layouts/_messages.html.erb
  • app/views/layouts/_navigation.html.erb

Additionally, when the simple option is selected:

  • app/assets/stylesheets/simple.css

Support for ERB or Haml

If you are using ERB for Rails views, the RailsLayout gem will generate ERB files.

If you are using Haml, the RailsLayout gem will generate Haml files instead.

Rails Composer

The Rails Composer tool, an application template used to create starter applications, uses the RailsLayout gem to generate the layout files used in various starter applications. You can use Rails Composer to generate entire applications.

Usage Example

To see how the generated files from the RailsLayout gem are used, see the Learn Rails example application that is described in the book Learn Ruby on Rails.

Learn Ruby on Rails

Installing a Front-End Framework

Instead of following the instructions for Twitter Bootstrap or Zurb Foundation to install a front-end framework, add the gems you need. Then use the RailsLayout gem. It will set up your assets files.

Install Gems for a Front-End Framework

Add the gems you need to your Rails application Gemfile:

Twitter Bootstrap 2.3


gem 'bootstrap-sass', '~> 2.3.2.2'

Twitter Bootstrap 3.0


gem 'bootstrap-sass'

Zurb Foundation 4.0


gem 'compass-rails', '~> 2.0.alpha.0'
gem 'zurb-foundation'

Use Bundler to install the gems:


$ bundle install

Install the RailsLayout Gem

Add it to your Rails application Gemfile:


group :development do
  gem 'rails_layout'
end

You don’t need the gem deployed to production, so put it in the development group.

If you want to use a newer unreleased version from GitHub:


group :development do
  gem 'rails_layout', github: 'RailsApps/rails_layout'
end

Use Bundler to install the gem:


$ bundle install

Generate a Simple Layout

To create a set of simple layout files:


$ rails generate layout simple

Use --force if you want to overwrite existing files:


$ rails generate layout simple --force

See the files that are generated:

The RailsLayout gem will create the file:

Twitter Bootstrap 2.3 Layout

To create layout files for use with Twitter Bootstrap 2.3:


$ rails generate layout bootstrap2

Use --force if you want to overwrite existing files:


$ rails generate layout bootstrap2 --force

See the files that are generated:

The RailsLayout gem will create the file:

and modify the file:

Twitter Bootstrap 3.0 Layout

To create layout files for use with Twitter Bootstrap 3.0:


$ rails generate layout bootstrap3

Use --force if you want to overwrite existing files:


$ rails generate layout bootstrap3 --force

See the files that are generated:

The RailsLayout gem will create the file:

and modify the file:

Zurb Foundation 4.0 Layout

To create layout files for use with Zurb Foundation 4.0:


$ rails generate layout foundation4

Use --force if you want to overwrite existing files:


$ rails generate layout foundation4 --force

See the files that are generated:

The RailsLayout gem will create the file:

and modify the file:

Reverting to None

To revert your application to a default application layout:


$ rails generate layout none

The RailsLayout gem will remove files it may have added:

  • app/views/layouts/_messages.html.erb
  • app/views/layouts/_navigation.html.erb
  • app/assets/stylesheets/simple.css
  • app/assets/stylesheets/bootstrap_and_overrides.css.scss
  • app/assets/stylesheets/foundation_and_overrides.css.scss

Additionally, it will restore these files to the default versions:

  • app/views/layouts/application.html.erb
  • app/assets/javascripts/application.js

The file app/assets/stylesheets/application.css.scss will contain a CSS rule but you can ignore it or remove it.

Help

To see help messages:


$ rails generate layout --help

Issues

Any issues? Please create an issue on GitHub. Reporting issues (and patching!) helps everyone.

Credits

Daniel Kehoe maintains this gem as part of the RailsApps project.

Please see the CHANGELOG for a list of contributors.

Is the gem useful to you? Follow the project on Twitter: @rails_apps. I’d love to know you were helped out by the gem.

MIT License

MIT License

Copyright © 2013 Daniel Kehoe