Repair and refine embed block styles

[m-e-h]

Description

editor.scss

• corrected the attribute selector from [data-type="core/embed"] to [data-type^="core-embed"] and move these style rules from style.scss the more appropriate editor.scss.

style.scss

• Reduced specificity by un-nesting and removing unnecessary selectors.
• Added 100% width to the iframe for alignright and alignleft. Previously, on embeds without an aspect-ratio, floats weren't responsive and the iframe would overflow it's container. (If using normalize.css this wouldn't be noticed)

How has this been tested?

Tested visually with several themes including TwentyNineteen.

Types of changes

Bug fix

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.

[m-e-h]

To save some bytes, switched to .wp-has-aspect-ratio rather than listing all the different aspect-ratios.
Any reason not to do this?

[m-e-h]

I'm not completely clear on this though. Maybe core/embed is correct. I just now saw where thats used for the generic embed? Everything else appears to use something like core-embed/youtube.

Are the generic embeds the only thing that doesn't have an intrinsic width?

[jasmussen]

Hello @m-e-h, apologies for not being able to look at this back when it was fresh. It is a good PR and should have landed ages ago.

If you have the time and energy, I have tested this branch and it works as intended and should be good to merge if you rebase. In absence of that, I understand you may be busy, I took the liberty of creating #21599 which is simply a rebased copy of this branch, with props to you. Let me know if you'd like to rebase this and get it in, or whether we should move on with the other! Thanks again.

[jasmussen]

I'm closing this one as I managed to port your code to #21599 and merge it! Thanks again.