Testimonial 1

[iamtakashi]

Mockup

<!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":50} -->
<div class="wp-block-column" style="flex-basis:50%"><!-- wp:heading -->
<h2><strong>Testimonial</strong></h2>
<!-- /wp:heading -->

<!-- wp:spacer {"height":401} -->
<div style="height:401px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->

<!-- wp:quote -->
<blockquote class="wp-block-quote"><p><em>Great top, got the camel. So fresh and with a different take with white stripe on sleeves. Comfy fit, quite loose so could go a size down but like it loose fit!</em></p><cite>Name</cite></blockquote>
<!-- /wp:quote --></div>
<!-- /wp:column -->

<!-- wp:column {"width":50} -->
<div class="wp-block-column" style="flex-basis:50%"><!-- wp:image {"id":9631,"sizeSlug":"full"} -->
<figure class="wp-block-image size-full"><img src="https://iamtakashi.files.wordpress.com/2020/02/dmitriy-ilkevich-zg3alxw9fb0-unsplash-2.jpg" alt="" class="wp-image-9631"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

Front-end

Note
There are a number of ways to build this such as using Media & Text, but Image block could use a block style to add the decorative background.

We need a font-size option for Heading.

I've used a spacer to give a space between the heading and the quote, but the height of the spacer will be depending on the height of the image.

The quote block also could use a better block style as well. It'd be nice if the font for the citation is different from the quote to give a bit of contrast.

[alaczek]

Headings font size was brought up in this issue, and the consensus was it doesn't make sense to add those controls, because it would upset the type scale. I can see that point, but I myself often find I'd like to tweak heading size, and since we can't resort to using paragraphs more often, which isn't great for SEO.

Ideally we'll have some control over heading size via global styles.