one/index.php at main · ampry/one · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<?php get_header(); ?>

<main class="blog-archive">
    <div class="c">

        <header class="page-header" style="text-align: center; padding: 60px 0 40px;">
            <h1 class="page-title">Latest Posts</h1>
        </header>

        <?php if (have_posts()) : ?>

            <div class="posts-grid" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 30px; padding-bottom: 60px;">

                <?php while (have_posts()) : the_post(); ?>

                    <article id="post-<?php the_ID(); ?>" <?php post_class('post-card'); ?> style="background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">

                        <?php if (has_post_thumbnail()) : ?>
                            <a href="<?php the_permalink(); ?>" class="post-thumbnail">
                                <?php the_post_thumbnail('medium_large', ['style' => 'width: 100%; height: 200px; object-fit: cover;']); ?>
                            </a>
                        <?php endif; ?>

                        <div class="post-content" style="padding: 20px;">
                            <h2 class="post-title" style="margin: 0 0 10px; font-size: 1.25rem;">
                                <a href="<?php the_permalink(); ?>" style="color: #061F3C; text-decoration: none;">
                                    <?php the_title(); ?>
                                </a>
                            </h2>

                            <div class="post-meta" style="font-size: 0.85rem; color: #666; margin-bottom: 15px;">
                                <?php echo get_the_date(); ?>
                            </div>

                            <div class="post-excerpt" style="color: #506276; font-size: 0.95rem; line-height: 1.6;">
                                <?php echo wp_trim_words(get_the_excerpt(), 20); ?>
                            </div>

                            <a href="<?php the_permalink(); ?>" class="read-more" style="display: inline-block; margin-top: 15px; color: #3172C1; font-weight: 600; text-decoration: none;">
                                Read More &rarr;
                            </a>
                        </div>
                    </article>

                <?php endwhile; ?>

            </div>

            <div class="pagination" style="text-align: center; padding-bottom: 60px;">
                <?php
                the_posts_pagination([
                    'mid_size' => 2,
                    'prev_text' => '← Previous',
                    'next_text' => 'Next →',
                ]);
                ?>
            </div>

        <?php else : ?>

            <div class="no-posts" style="text-align: center; padding: 60px 20px;">
                <h2>No posts found</h2>
                <p>There are no posts to display yet. Check back soon!</p>
            </div>

        <?php endif; ?>

    </div><!-- .c -->
</main>

<?php get_footer(); ?>