I’m working on my first theme built from custom gutenberg blocks. I’ve managed to register blocks and enqueue their specific stylesheets, but I’m running into one issue that’s kind of a pain. A lot of my blocks override global styles from my style.css file. However, when I enable editor styles, the .editor-styles-wrapper class is superseding the block styles.
To offer an example, here’s my global container style:
div.tmp-container-fixed {
flex-direction: row;
}
In my block-specific stylesheet:
section.sign-up .tmp-container-fixed {
flex-direction: column;
}
And what the editor-styles.css puts out:
.editor-styles-wrapper div.tmp-container-fixed {
flex-direction: row;
}
I understand why the editor styles are overriding the block styles. I’m wondering, is there any way to enqueue an editor stylesheet for each block, to output something like:
.editor-styles-wrapper section.sign-up .tmp-container-fixed {
flex-direction: column;
}
I imagine I could code a custom editor stylesheet, but was hoping there might be an easier way to accomplish that.
Many thanks in advance!