React JSS media query reusable component/snippet

sizes.js

export default {
  up() {},
  down(size) {
    const sizes = {
      xs: "575.98px",
      sm: "767.98px",
      md: "991.98px",
      lg: "1199.98px",
      xl: "1600px",
    }
    return `@media (max-width: ${sizes[size]})`
  },
}


//how to use-
//In your react jss style file, import the module.


//In your jss code-
// root: {
//    width: "75vw",
//    [sizes.down("lg")]: {
//      width: "80vw",
//    },
//    [sizes.down("md")]: {
//      width: "100vw",
//    },
//    [sizes.down("sm")]: {
//     fontSize:"10px"
//    },
//  }