Generated by SassMeister.com.

SassMeister-input-HTML.html

<div class="container">
  <p>Hello world</p>
</div>

SassMeister-input.scss

// ----
// libsass (v3.1.0-beta)
// ----

.test-class-1 {
  color: #0f0;
  width: 10px;
  height: 10px;
  border: 1px solid #0f0;
}

.test-class-2 {
  color: #f00;
  width: 20px;
  height: 20px;
  border: 1px solid #f00;
}

.container {
  background: #ff0;
  
  &:before {
    @extend .test-class-1;
    content: "O";
    display: inline-block;
    overflow: none;
  
    @media (min-width: 1000px) {
      @extend .test-class-2;
    }
  }
}

SassMeister-output.css

.test-class-1, .container:before {
  color: #0f0;
  width: 10px;
  height: 10px;
  border: 1px solid #0f0; }

.test-class-2, .container:before {
  color: #f00;
  width: 20px;
  height: 20px;
  border: 1px solid #f00; }

.container {
  background: #ff0; }
  .container:before {
    content: "O";
    display: inline-block;
    overflow: none; }

SassMeister-rendered.html

<div class="container">
  <p>Hello world</p>
</div>