Set the scale() CSS property to the proper element for block pattern preview.

[ixkaito]

Description

Set the scale() CSS property to the proper element for block pattern preview.

Testing Instructions

Screenshots

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).
• I've updated related schemas if appropriate.

[draganescu]

I tested this but it's unclear to me what should happen with this changeset applied. I tested in Safari and preview__content seems to be the same in trunk.

[ixkaito]

There's no change on the screen because .block-editor-block-preview__content has an initial value visible for overflow, so its content is visible now. However, .block-editor-block-preview__content has a wrong size. Please check the size of .block-editor-block-preview__content in your browser inspector. It has 0px width and a smaller height than it's content. If you set overflow: hidden; to .block-editor-block-preview__content, its content will be invisible.

Why this is happening: For example, contentHeight is 100, and scale is 0.1. The height of .block-editor-block-preview__content would be 1px because the height is 100 * 0.1 and then transformed by scale(0.1), but it shouldn't. It should be 10px. What we have to scale is not the parent container but the child iframe.