<?php
/**
 *  The default template for displaying content in the loop
 *
 *
 * @package Felicityhealth
 * @since Felicityhealth 1.0
 */
?>


<div class="col-12 col-md-6 col-lg-4 col-md mb-5">
    <a href="<?= esc_url( get_permalink() )?>">
        <div class="card border-0">
            <?php if ( has_post_thumbnail() ): // check if the post has a Post Thumbnail assigned to it.?>
            <div class="zulu-post-thumbnail">
                <a href="<?= esc_url( get_permalink() )?>">
                    <?php 
                                  echo get_the_post_thumbnail($post->ID, '', array('title' => the_title_attribute( array( 'echo' => 0 ) ), 'alt' => the_title_attribute( array( 'echo' => 0 ) )));
                                  ?>
                    <div class="zulu-image-overlay"></div>
                </a>
            </div>
            <?php else:?>
            <div class="zulu-post-thumbnail">
                <a href="<?= esc_url( get_permalink() )?>">
                    <svg class="bd-placeholder-img card-img-top" width="100%" height="225"
                        xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false"
                        role="img" aria-label="Placeholder: <?php the_title(); ?>">
                        <title><?php the_title(); ?></title>
                        <rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef"
                            dy=".3em"><?php the_title(); ?></text>
                    </svg>
                    <div class="zulu-image-overlay"></div>
                </a>
            </div>
            <?php endif?>
            <div class="zulu-post-meta mb-0">
                <span><?php echo get_the_date('F j, Y'); ?></span>
            </div>
            <div class="card-body py-3 pl-0 pt-0">
                <a href="<?= esc_url( get_permalink() )?>">
                    <h5 class="font-weight-bold media-titles"><?php the_title(); ?></h5>
                </a>
                <div class="zulu-post-content">
                    <div class="zulu-post-excerpt">
                        <p>
                            <?php
                                      if ( has_excerpt()) {
                                          the_excerpt();
                                        } else {
                                          the_content( __( 'Continue reading', 'zulured' ) );
                                        }
                                      ?></p>
                        <a href="<?= esc_url( get_permalink() )?>"
                            class="zulu-post-read-more"><?php echo __( 'More', 'zulured' ) ?>
                            &nbsp;→</a>
                    </div>
                </div>
            </div>
        </div>
    </a>
</div>