Rails / JavaScript exchange CSS-Classes before rendering the view

I doubt you'll be able to find a gem that will give you this kind of functionality out of the box. Basically, to achieve this, you'll need to write all your views using a DSL that can be translated into either Bootstrap, Zurb, or some other framework.

This DSL could be implemented as a series of helper methods in a Rails Engine.

For example, your view could look something like this: (Assuming you use ERB as the templating engine)

<%= box do %>
  <%= header 'Title of the Box' %>
  <%= body do %>
    <p>Box content here</p>
  <% end %>
<% end %>

The definitions of these methods could look something like this: (Pseudo-code)

def box(options = {})
  case EngineName.config.framework.to_sym
  when :bootstrap
    klass = '..' # the class you want
  when :zurb
    klass = '...' # the class you want
  end

  content_tag(:section, class: klass) { yield }
end

In a config/initializers/framework.rb file, you could configure the engine like so:

EngineName.config.framework = :bootstrap # or :zurb

There are a few pros and cons with this approach.

Pros

• You can theoretically switch template frameworks without actually having to change your views.

Cons

• You have to maintain a separate templating DSL in order to abstract away the framework-specific class names and such. This could be time consuming, especially when the frameworks require very different markup to achieve the same result. If you didn't foresee the future markup, you'd end up needing to change your views to support it anyway.

Personally, I think you should consider just going ahead with one framework and not worry about this. It's unlikely that your template DSL would be future-proof, and so creating one could just be unnecessary effort.