File: /var/www/test/wp-content/themes/resumegrove/patterns/how-it-works.php
<?php
/**
* Title: How It Works
* Slug: resumegrove/how-it-works
* Categories: resumegrove
* Keywords: how it works
*/
?>
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|50","left":"var:preset|spacing|20","right":"var:preset|spacing|20"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="padding-top:var(--wp--preset--spacing--50);padding-right:var(--wp--preset--spacing--20);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--20)"><!-- wp:group {"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}},"layout":{"type":"constrained","contentSize":"800px"}} -->
<div class="wp-block-group" style="margin-bottom:var(--wp--preset--spacing--40)"><!-- wp:heading {"textAlign":"center","style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
<h2 class="wp-block-heading has-text-align-center" style="margin-top:0;margin-bottom:0"><?php echo esc_html__( 'How It Works?', 'resumegrove' ); ?></h2>
<!-- /wp:heading -->
<!-- wp:paragraph {"align":"center"} -->
<p class="has-text-align-center"><?php echo esc_html__( 'Ultricies nulla velit turpis feugiat ac aenean sociosqu luctus facilisis lobortis. Mi commodo dictum fames libero interdum.', 'resumegrove' ); ?></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:columns {"className":"wow animate__animated animate__zoomIn","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|40","left":"var:preset|spacing|30"}}}} -->
<div class="wp-block-columns wow animate__animated animate__zoomIn"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:group {"className":"how-it-works-icon","style":{"spacing":{"padding":{"top":"14px","bottom":"14px","left":"16px","right":"16px"}},"border":{"radius":"5px"}},"backgroundColor":"secondary-bg","layout":{"type":"constrained"}} -->
<div class="wp-block-group how-it-works-icon has-secondary-bg-background-color has-background" style="border-radius:5px;padding-top:14px;padding-right:16px;padding-bottom:14px;padding-left:16px"><!-- wp:image {"id":851,"width":"28px","sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized"><img src="<?php echo esc_url( get_stylesheet_directory_uri() );?>/assets/images/icon-1.png" alt="download" class="wp-image-851" style="width:28px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group -->
<!-- wp:heading {"level":4} -->
<h4 class="wp-block-heading"><?php echo esc_html__( 'Enter Details', 'resumegrove' ); ?></h4>
<!-- /wp:heading -->
<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"12px"}}}} -->
<p style="margin-top:12px"><?php echo esc_html__( 'Semper nec eleifend arcu natoque hac est lectus gravida urna nostra. Accumsan vel pede nam volutpat magnis', 'resumegrove' ); ?> </p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:group {"className":"how-it-works-icon","style":{"spacing":{"padding":{"top":"14px","bottom":"14px","left":"16px","right":"16px"}},"border":{"radius":"5px"}},"backgroundColor":"secondary-bg","layout":{"type":"constrained"}} -->
<div class="wp-block-group how-it-works-icon has-secondary-bg-background-color has-background" style="border-radius:5px;padding-top:14px;padding-right:16px;padding-bottom:14px;padding-left:16px"><!-- wp:image {"id":851,"width":"28px","sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized"><img src="<?php echo esc_url( get_stylesheet_directory_uri() );?>/assets/images/icon-2.png" alt="download" class="wp-image-851" style="width:28px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group -->
<!-- wp:heading {"level":4} -->
<h4 class="wp-block-heading"><?php echo esc_html__( 'Select Template', 'resumegrove' ); ?></h4>
<!-- /wp:heading -->
<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"12px"}}}} -->
<p style="margin-top:12px"><?php echo esc_html__( 'Semper nec eleifend arcu natoque hac est lectus gravida urna nostra. Accumsan vel pede nam volutpat magnis', 'resumegrove' ); ?> </p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group"><!-- wp:group {"className":"how-it-works-icon","style":{"spacing":{"padding":{"top":"14px","bottom":"14px","left":"16px","right":"16px"}},"border":{"radius":"5px"}},"backgroundColor":"secondary-bg","layout":{"type":"constrained"}} -->
<div class="wp-block-group how-it-works-icon has-secondary-bg-background-color has-background" style="border-radius:5px;padding-top:14px;padding-right:16px;padding-bottom:14px;padding-left:16px"><!-- wp:image {"id":851,"width":"28px","sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized"><img src="<?php echo esc_url( get_stylesheet_directory_uri() );?>/assets/images/icon-3.png" alt="download" class="wp-image-851" style="width:28px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group -->
<!-- wp:heading {"level":4} -->
<h4 class="wp-block-heading"><?php echo esc_html__( 'Download Resume', 'resumegrove' ); ?></h4>
<!-- /wp:heading -->
<!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"12px"}}}} -->
<p style="margin-top:12px"><?php echo esc_html__( 'Semper nec eleifend arcu natoque hac est lectus gravida urna nostra. Accumsan vel pede nam volutpat magnis', 'resumegrove' ); ?> </p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->