Allow definition of breakpoints in $cssProvider.defaults

[alexcastillo]

Allow definition of breakpoints in $cssProvider.defaults

This will allow the user to reference a breakpoint as opposed to be using the same media queries over and over.

The API should look like this:

myApp.config(function($routeProvider, $cssProvider) {

  angular.extend($cssProvider.defaults, {
    breakpoints: {
      mobile: '(max-width : 768px)',
      desktop: '(min-width : 769px) and (max-width : 1219px)',
      kiosk: '(min-width : 1220px)'
    }
  });

  $routeProvider
    .when('/black', {
      title: 'Black',
      templateUrl: 'pages/black/page-black.html',
      css: [
        {
          href: 'pages/black/page-black.mobile.css',
          breakpoint: 'mobile'
        }, {
          href: 'pages/black/page-black.desktop.css',
          breakpoint: 'desktop'
        }, {
          href: 'pages/black/page-black.kiosk.css',
          breakpoint: 'kiosk'
        }
      ]
    })

});