Roots Discourse

Isolate/break out styles for editor in sage 10

Often I have to add very block-specific styles only for the editor.
Currently, I have to add these styles to a separate editor.scss file.
Ideally, I can just use some CSS clause to isolate these styles in place:

.wp-block-group {
  &.is-style-special {
    border: 2px solid red;

    @editor {
      margin-top: 0; // or some other adjustment
    }
  }
}

The styles in @editor {[...]} would be outputted in the separate editor.css that is only enqueued for the Gutenberg editor (not as theme style, so no automatic selector wrapping).

Related discussion: