how to write css for a specific breakpoint in angular material

Question

I am trying to write CSS for a div, that should apply only when a particular breakpoint is hit, eg. sm, md or lg.

I\'m using angular-material (https://material.angularjs

Answer 1

I'm using the $mdMedia service for that, see:

https://material.angularjs.org/latest/#/api/material.core/service/$mdMedia

Additionally you can use it in a template directly e.g. with an ng-class directive:

// In your controller: 
$scope.$mdMedia = $mdMedia;

// In your template: 
...