<?php

/**
 * Template part for displaying posts
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
 *
 * @package faced
 */
global $faced_theme_options;
?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <!-- 
        for full single column card layout add [.card-full-width] class 
        for reverse align for figure and card_body add [.reverse-row] class in .card-blog-post
    -->
    <?php
    $image_alignment_class = '';
    $image_alignment = esc_attr($faced_theme_options['faced-blog-page-masonry-normal']);
    if ($image_alignment == 'full-image') {
        $image_alignment_class = 'card-full-width';
    }
    ?>
    <div class="card card-blog-post <?php echo esc_attr($image_alignment_class); ?>">
        <?php
        if (has_post_thumbnail()) {
        ?>
            <figure class="post-thumbnail card_media">
                <a href="<?php the_permalink(); ?>">
                    <?php
                    $cropped_image = esc_attr($faced_theme_options['faced-image-size-blog-page']);
                    if ($cropped_image == 'cropped-image') {
                        the_post_thumbnail('faced-medium');
                    } else {
                        the_post_thumbnail();
                    }
                    ?>
                </a>
            </figure>
        <?php
        }
        ?>
        <div class="card_body">
            <!-- To have a background category link add [.bg-label] in category-label-group class -->
            <div>
                <?php
                faced_list_category();
                    the_title('<h2 class="card_title"><a href="' . esc_url(get_permalink()) . '" rel="bookmark">', '</a></h2>');
                ?>
            </div>
        </div>
    </div>
</article><!-- #post-<?php the_ID(); ?> -->
