<?php
/**
 * Template part for displaying posts
 *
 * @package Navier_Instruments
 */
?>

<article id="post-<?php the_ID(); ?>" <?php post_class('post-card animate animate-fade-up'); ?>>
    <?php if (has_post_thumbnail()) : ?>
        <div class="post-thumbnail">
            <a href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail('navier-card'); ?>
            </a>
        </div>
    <?php endif; ?>

    <div class="post-card-content">
        <div class="post-meta">
            <?php
            $categories = get_the_category();
            if ($categories) :
            ?>
                <span class="post-category">
                    <a href="<?php echo esc_url(get_category_link($categories[0]->term_id)); ?>">
                        <?php echo esc_html($categories[0]->name); ?>
                    </a>
                </span>
            <?php endif; ?>
            <span class="post-date"><?php echo get_the_date(); ?></span>
        </div>

        <h3 class="post-card-title">
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
        </h3>

        <p class="post-excerpt"><?php echo esc_html(get_the_excerpt()); ?></p>

        <a href="<?php the_permalink(); ?>" class="read-more">
            <?php esc_html_e('Read More', 'navier-instruments'); ?>
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <line x1="5" y1="12" x2="19" y2="12"></line>
                <polyline points="12 5 19 12 12 19"></polyline>
            </svg>
        </a>
    </div>
</article>
