<?php
/**
 * Title: Hero
 * Slug: chronicle-journal/hero
 * Categories: hero
 *
 * @subpackage Chronicle_Journal
 * @since Chronicle Journal 1.0
 */

?>
<!-- wp:group {"className":"has-md-padding-top hero-section","layout":{"type":"constrained","contentSize":"1200px"}} -->
<div class="wp-block-group has-md-padding-top hero-section">
    <!-- wp:heading {"textAlign":"center","level":1} -->
    <h1 class="wp-block-heading has-text-align-center"><?php esc_html_e('A Voice for Independent Storytelling', 'chronicle-journal'); ?></h1>
    <!-- /wp:heading -->

    <!-- wp:paragraph {"align":"center"} -->
    <p class="has-text-align-center"><?php esc_html_e('Build for Narrative Storytelling', 'chronicle-journal'); ?></p>
    <!-- /wp:paragraph -->

    <!-- wp:paragraph {"className":"has-font-size-h4"} -->
    <p class="has-font-size-h4"><strong><?php esc_html_e('Featured Posts', 'chronicle-journal'); ?></strong></p>
    <!-- /wp:paragraph -->

    <!-- wp:columns -->
    <div class="wp-block-columns"><!-- wp:column -->
        <div class="wp-block-column">
            <!-- wp:query {"query":{"perPage":1,"offset":0,"postType":"post","sticky":"exclude"},"displayLayout":{"type":"list"}} -->
            <div class="wp-block-query">
                <!-- wp:post-template -->
                <!-- wp:post-featured-image {"isLink":true,"sizeSlug":"large"} /-->
                <!-- wp:post-terms {"term":"category"} /-->
                <!-- wp:post-title {"level":2, "isLink":true, "className": "hero-post-title"} /-->
                <!-- wp:post-excerpt {"excerptLength":20, "moreText":"Learn More"} /-->
                <!-- wp:group {"fontSize":"small","layout":{"type":"flex","flexWrap":"nowrap"}} -->
                <div class="wp-block-group has-small-font-size">
                    <!-- wp:post-author {"isLink":true} /-->

                    <!-- wp:post-date {"format":"M j, Y", "isLink":true} /-->
                </div>
                <!-- /wp:group -->
                <!-- /wp:post-template -->
            </div>
            <!-- /wp:query -->
        </div>
        <!-- /wp:column -->

        <!-- wp:column -->
        <div class="wp-block-column"><!-- wp:query {"queryId":0,"query":{"perPage":3,"offset":1,"postType":"post","sticky":"exclude"}} -->
            <div class="wp-block-query"><!-- wp:post-template {"layout":{"type":"default"}} -->
                <!-- wp:columns -->
                <div class="wp-block-columns">
                    <!-- wp:column -->
                    <div class="wp-block-column"><!-- wp:post-featured-image {"isLink":true} /--></div>
                    <!-- /wp:column -->

                    <!-- wp:column -->
                    <div class="wp-block-column"><!-- wp:group -->
                        <div class="wp-block-group">
                            <!-- wp:post-terms {"term":"category"} /-->

                            <!-- wp:post-title {"level":2,"isLink":true,"className": "hero-post-title"} /-->

                            <!-- wp:group {"fontSize":"small","layout":{"type":"flex","flexWrap":"nowrap", "justifyContent":"space-between"}} -->
                            <div class="wp-block-group has-small-font-size">
                                <!-- wp:post-author {"isLink":true} /-->

                                <!-- wp:post-date {"format":"M j, Y", "isLink":true} /-->
                            </div>
                            <!-- /wp:group -->
                        </div>
                        <!-- /wp:group -->
                    </div>
                    <!-- /wp:column -->
                </div>
                <!-- /wp:columns -->
                <!-- /wp:post-template -->
            </div>
            <!-- /wp:query -->
        </div>
        <!-- /wp:column -->
    </div>
    <!-- /wp:columns -->
</div>
<!-- /wp:group -->