If you are like me, you already downloaded Visual Studio 2013 and probably migrated some solutions to the latest MVC version. It comes with some great responsive design features out of the box starting with the stock template. On the other end, if are using Bootswatch themes you will see that the latest 3.0 Bootswatch themes for Bootstrap break the responsive design. The top navigation reverts to the small screen size and the Hero-Unit also looks funky. Well don’t despair, thanks to Ghislain Proulx and his article, I was able to update my 2.3 references to 3.0, switch my Hero-Unit for a Jumbotron among other CSS fixes.
Nuget Packages:
Update-Package Bootstrap
Update-Package jQuery.Validation
Install-Package Respond
Install-Package html5shiv
Update your BundleConfig files, grab your Bootswatch theme, and replace your “~/Content/bootstrap-theme.css
” file and voila’.
If you need inspiration try the Amelia theme it is my favorite:
Any additional CSS edits will be application specific; for example, I had to change hero-unit
for jumbotron
and my spans
for col-md-4
.
Hope this helps 🙂