Work Process Section Block

The Work Process Block

Step One

Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.
Step Two

Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.
Step Three

Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.
Primeros pasos
Código del patrón
<!-- wp:group {"layout":{"type":"constrained"},"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}}} -->
<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:heading {"textAlign":"center","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|60"}}}} -->
<h2 class="has-text-align-center" style="margin-bottom:var(--wp--preset--spacing--60)">The Work Process Block</h2>
<!-- /wp:heading -->

<!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"},"style":{"border":{"radius":"3px"},"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|50"},"blockGap":"var:preset|spacing|30"}},"gradient":"very-light-gray-to-cyan-bluish-gray"} -->
<div class="wp-block-group has-very-light-gray-to-cyan-bluish-gray-gradient-background has-background" style="border-radius:3px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)"><!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
<div class="wp-block-buttons"><!-- wp:button {"textColor":"black","gradient":"very-light-gray-to-cyan-bluish-gray","style":{"border":{"radius":"3px"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-black-color has-very-light-gray-to-cyan-bluish-gray-gradient-background has-text-color has-background wp-element-button" style="border-radius:3px">1</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:heading {"textAlign":"center"} -->
<h2 class="has-text-align-center">Step One</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center">Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"},"style":{"border":{"radius":"3px"},"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|50"},"blockGap":"var:preset|spacing|30"}},"gradient":"very-light-gray-to-cyan-bluish-gray"} -->
<div class="wp-block-group has-very-light-gray-to-cyan-bluish-gray-gradient-background has-background" style="border-radius:3px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)"><!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
<div class="wp-block-buttons"><!-- wp:button {"textColor":"black","gradient":"very-light-gray-to-cyan-bluish-gray","style":{"border":{"radius":"3px"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-black-color has-very-light-gray-to-cyan-bluish-gray-gradient-background has-text-color has-background wp-element-button" style="border-radius:3px">2</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:heading {"textAlign":"center"} -->
<h2 class="has-text-align-center">Step Two</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center">Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"},"style":{"border":{"radius":"3px"},"spacing":{"padding":{"top":"var:preset|spacing|50","right":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|50"},"blockGap":"var:preset|spacing|30"}},"gradient":"very-light-gray-to-cyan-bluish-gray"} -->
<div class="wp-block-group has-very-light-gray-to-cyan-bluish-gray-gradient-background has-background" style="border-radius:3px;padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--50)"><!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
<div class="wp-block-buttons"><!-- wp:button {"textColor":"black","gradient":"very-light-gray-to-cyan-bluish-gray","style":{"border":{"radius":"3px"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-black-color has-very-light-gray-to-cyan-bluish-gray-gradient-background has-text-color has-background wp-element-button" style="border-radius:3px">3</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:heading {"textAlign":"center"} -->
<h2 class="has-text-align-center">Step Three</h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center">Está comprobado que un lector se distrae del contenido legible de una página cuando mira su diseño.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:buttons {"layout":{"type":"flex","verticalAlignment":"top","justifyContent":"center"},"style":{"spacing":{"margin":{"top":"var:preset|spacing|70"}}}} -->
<div class="wp-block-buttons" style="margin-top:var(--wp--preset--spacing--70)"><!-- wp:button {"backgroundColor":"black","textColor":"white","style":{"border":{"radius":"3px"}},"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-white-color has-black-background-color has-text-color has-background wp-element-button" style="border-radius:3px">Primeros pasos</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group -->