Mercury & Twitter Bootstrap

We understand the need to use existing markup within Mercury, so we've based some of our common styles on Twitter's great Bootstrap project to help simplify some common integration points -- like building your own modals with complex forms etc.

Since CSS frameworks are often closely tied to a specific HTML structure, you typcially can't plug an external CSS framework into Mercury and have everything working out of the box. That's why we've chosen a specific, and well documented HTML structure for our built in modals and forms.

We've taken the form and button aspects directly from the Twitter Bootstrap project, so if you follow the form guidelines provided in their documentation you should be up and running pretty quickly. For instance, you can use the simple_form gem and install it properly, or check out the formtastic-bootstrap gem.

Adding the Full Bootstrap CSS / Using Other CSS Frameworks

To integrate Bootstrap into Mercury, you must first ensure that the necessary Bootstrap CSS and JavaScript files are included within the same view as the Mercury editor. To do this (in Rails) just drop in a sprockets require at the top of the mercury.css file that you can optionally get when you run the mercury:install Rails generator.

The same is true for using other CSS frameworks. If they follow the twitter bootstrap markup structure for forms (which is what I'm hoping will happen as more become popular), you should be good.