JSFiddle - React, Tailwind, and code Playground

by shapeshifta

CSS

body {
    font: bold 100px/150% Arial, Helvetica, sans-serif;
}
body:before {
    content:'desktop';
}
/* tablet */
 @media all and (max-width: 1024px) {
    body:before {
        content:'tablet';
    }
}
/* mobile phone */
 @media all and (max-width: 768px) {
    body:before {
        content:'mobile';
    }
}

JavaScript

var state = window.getComputedStyle(
document.querySelector('body'), ':before').getPropertyValue('content');
console.log(state);

window.addEventListener('resize', function () {
    state = window.getComputedStyle(
    document.querySelector('body'), ':before').getPropertyValue('content');
    console.log(state);
}, false);