JSFiddle - React, Tailwind, and code Playground

by oilvier

HTML

<div class="foo bar">
  baz
</div>

SCSS

.foo {
  color: red;
}

// 1. media query is declared here and should be here in the compiled CSS
/* @media (max-width: 1250px) {
  .foo {
    color: green;
   }
}*/

// Overriding `.foo`
.bar {
  color: blue;
}

// 2. Instead, it is moved here, after the override 
@media (max-width: 1250px) {
  .foo {
    color: green; // No more overriding via `.bar` :(
   }
}