Detect Resize and OS / Device Type

- Detect Resize

$(window).bind('resize', function(){
  
    var size = window.getComputedStyle(document.body,':after').getPropertyValue('content');
    
    if (size.indexOf("break2") !=-1){
      // Do stuff for breakpoint 2
      
    } else if (size.indexOf("tablet") !=-1){
      // Do stuff for tablet
      
    } else if (size.indexOf("mobile") !=-1){
      // Do Mobile Stuff
      
    }
  }).trigger('resize');

- Set User Agent

var b = document.documentElement;
b.setAttribute('data-ua', navigator.userAgent);
b.setAttribute('data-pf',  navigator.platform );

Detect User Agent

html[data-ua *= "Mac OS X 10_"] .yourSelector{
  /* Do something for Mac */
}

html[data-ua *= "iPhone OS 7_"] .yourSelector{
  /* Do something for iPhone 7 and up */
}

Set Content

body {
 
  &:after {
    content: 'mobile';
    display: none;
 
    @include breakpoint($break) {
      content: 'tablet';
    }
 
    @include breakpoint($break2) {
      content: 'break2';
    }
  }