Bootstrap ServiceStack MVC Backbone.js with Twitter and Facebook auth built-in

Is a Single Page App template using the finest, leanest, cleanest OSS parts $0 money could buy 🙂

  • Twitters Bootstrap – For Website design template, css, widgets
  • ServiceStack – .NET REST Web Services Framework
    • MVC PowerPack – Enhance MVC with clean Session, Caching, Logging, IOC & JSON libs
    • Bundler – node.js, CoffeeScript, Less, Sass, JS and website bundling + minification features
  • ASP.NET MVC3 – ASP.NET MVC Web Framework
  • Backbone.js – A lightweight MVC structure ideal for building Single Page Apps
  • Underscore.js – A functional utility toolbelt required by Backbone
  • jQuery – The ubiquitos JS library for providing a pleasant and smooth API around DOM quirks

Twitter Bootstrap responsive design features problem YUI Compressor

I recently had a problem with a website built on Twitter Bootstrap. I was using the .visible-desktop, .hidden-phone, etc responsive classes, and they just wouldn’t work. The .visible-desktop, would not appear on a desktop! When I used the uncompressed versions of the CSS files everything worked ok, and it was only when I compressed and minified them that the problems started.

The solution was relatively easy, once I’d figured out why. I was using YUI Compressor to minimize and combine the various CSS files into one.

The combining was not an issue, but the media queries were getting changed from:

Before

After

Fix