<?php
/**
 * Title: Media Text 01
 * Slug: hakoniwa/media-text-01
 * Categories: Hakoniwa
 *
 * @package Hakoniwa
 * @since 1.0.0
 */

?>
<!-- wp:media-text {"align":"full","mediaId":758,"mediaLink":"","mediaType":"image","imageFill":true,"focalPoint":{"x":0.5,"y":0.5},"backgroundColor":"contrast","textColor":"base"} -->
<div class="wp-block-media-text alignfull is-stacked-on-mobile is-image-fill has-base-color has-contrast-background-color has-text-color has-background"><figure class="wp-block-media-text__media" style="background-image:url(<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/sample/image01.jpg);background-position:50% 50%"><img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/sample/image01.jpg" alt="Yachtsody in Blue" class="wp-image-758 size-full"/></figure><div class="wp-block-media-text__content"><!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|70","bottom":"var:preset|spacing|70"}}},"layout":{"type":"default"}} -->
<div class="wp-block-group" style="padding-top:var(--wp--preset--spacing--70);padding-bottom:var(--wp--preset--spacing--70)"><!-- wp:heading {"fontSize":"2xl"} -->
<h2 class="wp-block-heading"><?php echo esc_html_x( 'Image and text placement', 'Pattern:Media Text 01', 'hakoniwa' ); ?></h2>
<!-- /wp:heading -->

<!-- wp:list -->
<ul>
<!-- wp:list-item -->
<li><?php echo esc_html_x( 'The combination of images and text makes the website visually appealing and grabs the visitor\'s attention.', 'Pattern:Media Text 01', 'hakoniwa' ); ?></li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li><?php echo esc_html_x( 'Images visually complement the information provided by text. By complementing each other, information can be conveyed more clearly.', 'Pattern:Media Text 01', 'hakoniwa' ); ?></li>
<!-- /wp:list-item -->

<!-- wp:list-item -->
<li><?php echo esc_html_x( 'Adding appropriate captions and ALT text to images will improve SEO.', 'Pattern:Media Text 01', 'hakoniwa' ); ?></li>
<!-- /wp:list-item -->
</ul>
<!-- /wp:list -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link wp-element-button" href="#"><?php echo esc_html_x( 'Read more', 'Pattern:Media Text 01', 'hakoniwa' ); ?></a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group --></div></div>
<!-- /wp:media-text -->
