Description

Recently styles for the template part converter modal have regressed. The descriptions no longer wrap and no longer have their slightly lighter font color:

It looks like the FlexBlock component's class name was updated from components-flex__block to components-flex-block. Here, we add a custom className to our instance of the FlexBlock and avoid using the base selector from the component in css as this should be more robust:

cc @sarayourfriend - in case this change to the format of component classNames is not expected / not a desired side effect of promoting the g2 version.

How has this been tested?

• Select a block in the site editor.
• Use the ellipsis menu in the block toolbar and select "Make template part"
• Verify the description does not overflow and is grey text color.

Screenshots

Types of changes

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).