Site icon Hip-Hop Website Design and Development

Use of CSS classes in editor-blocks.css file

Checking the editor-blocks.css file found in some themes, I see the following CSS classes added before some of the individual block classes:

.edit-post-visual-editor
.editor-block-list__layout
.editor-block-list__block
.block-library-list

An example:

.editor-block-list__block .wp-block-latest-comments {
    margin-left: 0;
    margin-right: 0;
}

And then others, don’t have them:

.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
    font-size: 1.5rem;
    margin: 0 0.8em 0.8em;
    padding: 0;
    border: 0;    
}

What’s the use of these CSS classes? Which elements in the block editor do they target? Why do some of the block CSS classes have them added before and why others don’t? Are they really necessary? Why some themes have an editor-blocks.css file and a blocks.css file and why others just the blocks.css one?

Thanks in advance