Alternating Rows of Features

Start by inspecting existing feature pattern entries in the repository to learn how WordPress block markup is added and previewed. Use the supplied screenshot, markup, and preview as the reference, and consider the work complete when the alternating-row pattern is available and matches the provided design.

Category: Features
Tag: Pattern
Pattern Meta: is_web

Screenshot:

Markup:

<!-- wp:heading {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"0"}},"typography":{"fontSize":"3rem","fontStyle":"normal","fontWeight":"700"}}} -->
<h2 class="wp-block-heading alignwide" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:0;font-size:3rem;font-style:normal;font-weight:700">My Process</h2>
<!-- /wp:heading -->

<!-- wp:columns {"verticalAlignment":"center","align":"full"} -->
<div class="wp-block-columns alignfull are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","style":{"border":{"top":{"color":"var:preset|color|tertiary","width":"1px"}},"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50"}}},"layout":{"type":"constrained","contentSize":"525px"}} -->
<div class="wp-block-column is-vertically-aligned-center" style="border-top-color:var(--wp--preset--color--tertiary);border-top-width:1px;padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50)"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} -->
<h3 class="wp-block-heading" style="font-style:normal;font-weight:700">Identifying the Work</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Tell me about your inquiry and your challenges. I’ll provide you with both a free quote and timing estimates. My goal is to make your 3D visualization and modeling services more reasonable and your projects more to be as competitive as possible.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"","layout":{"type":"default"}} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:group {"layout":{"type":"default"}} -->
<div class="wp-block-group"><!-- wp:image {"align":"center","id":9032,"width":281,"height":280,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image aligncenter size-large is-resized"><img src="https://dotcompatterns.files.wordpress.com/2022/12/box.png?w=561" alt="" class="wp-image-9032" width="281" height="280"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:columns {"verticalAlignment":"center","align":"full"} -->
<div class="wp-block-columns alignfull are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","layout":{"type":"constrained","contentSize":"525px"}} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:group {"layout":{"type":"default"}} -->
<div class="wp-block-group"><!-- wp:image {"align":"center","id":9031,"width":280,"height":280,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image aligncenter size-large is-resized"><img src="https://dotcompatterns.files.wordpress.com/2022/12/hectagon.png?w=560" alt="" class="wp-image-9031" width="280" height="280"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50"}},"border":{"top":{"color":"var:preset|color|tertiary","width":"1px"}}},"layout":{"type":"constrained","contentSize":"525px"}} -->
<div class="wp-block-column is-vertically-aligned-center" style="border-top-color:var(--wp--preset--color--tertiary);border-top-width:1px;padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50)"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} -->
<h3 class="wp-block-heading" style="font-style:normal;font-weight:700">Iterate and Iterate</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Based on your project requirements, I’ll start modeling, adding textures, camera views, and so on. During the execution of your project, I will send you reports on an on-going basis to get your feedback.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:columns {"verticalAlignment":"center","align":"full"} -->
<div class="wp-block-columns alignfull are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","style":{"border":{"top":{"color":"var:preset|color|tertiary","width":"1px"}},"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50"}}},"layout":{"type":"constrained","contentSize":"525px"}} -->
<div class="wp-block-column is-vertically-aligned-center" style="border-top-color:var(--wp--preset--color--tertiary);border-top-width:1px;padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50)"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}}} -->
<h3 class="wp-block-heading" style="font-style:normal;font-weight:700">Deliver the Final Result</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Tell me about your inquiry and your challenges. I’ll provide you with both a free quote and timing estimates. My goal is to make your 3D visualization and modeling services more reasonable and your projects more to be as competitive as possible.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"","layout":{"type":"default"}} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:group {"layout":{"type":"default"}} -->
<div class="wp-block-group"><!-- wp:image {"align":"center","id":9033,"width":280,"height":280,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image aligncenter size-large is-resized"><img src="https://dotcompatterns.files.wordpress.com/2022/12/octahedron.png?w=560" alt="" class="wp-image-9033" width="280" height="280"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

Preview:
https://dotcompatterns.wordpress.com/?p=9029&preview=true

A pattern originally from the Arkin theme.

cc @alaczek @iamtakashi