mymo-wordpress-theme/single.php at master · digbly/mymo-wordpress-theme · 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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<?php get_header(); ?>

<?php if ( function_exists('yoast_breadcrumb') && ! is_front_page() && ! is_home() ) : ?>
    <div class="container mx-auto px-4 pt-4">
        <?php yoast_breadcrumb( '<p id="breadcrumbs" class="text-sm text-gray-400 [&_a]:text-brand-accent [&_a:hover]:underline">', '</p>' ); ?>
    </div>
<?php endif; ?>

<main class="container mx-auto px-4 py-8">
    <div class="flex flex-col lg:flex-row gap-8">
        <div class="flex-1 min-w-0">
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                <article id="post-<?php the_ID(); ?>" <?php post_class( 'bg-brand-gray rounded-lg overflow-hidden mb-8' ); ?>>
                    <?php if ( has_post_thumbnail() ) : ?>
                        <div class="w-full aspect-video">
                            <?php the_post_thumbnail( 'large', array( 'class' => 'w-full h-full object-cover' ) ); ?>
                        </div>
                    <?php endif; ?>

                    <div class="p-6 md:p-8">
                        <header class="mb-6">
                            <h1 class="text-3xl md:text-4xl font-bold text-white mb-4"><?php the_title(); ?></h1>
                            <div class="flex flex-wrap items-center text-gray-400 text-sm gap-4">
                                <span class="flex items-center">
                                    <svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path></svg>
                                    <?php the_author(); ?>
                                </span>
                                <span class="flex items-center">
                                    <svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path></svg>
                                    <?php echo get_the_date(); ?>
                                </span>
                                <?php if ( has_category() ) : ?>
                                    <span class="flex items-center [&_a]:text-brand-accent [&_a:hover]:underline">
                                        <svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path></svg>
                                        <?php echo get_the_category_list( ', ' ); ?>
                                    </span>
                                <?php endif; ?>
                            </div>
                        </header>

                        <div class="text-gray-300 leading-relaxed text-base [&_p]:mb-4 [&_h2]:text-2xl [&_h2]:font-bold [&_h2]:text-white [&_h2]:mb-4 [&_h2]:mt-8 [&_h3]:text-xl [&_h3]:font-bold [&_h3]:text-white [&_h3]:mb-3 [&_h3]:mt-6 [&_ul]:list-disc [&_ul]:pl-5 [&_ul]:mb-4 [&_ol]:list-decimal [&_ol]:pl-5 [&_ol]:mb-4 [&_a]:text-brand-accent [&_a:hover]:underline [&_blockquote]:border-l-4 [&_blockquote]:border-brand-accent [&_blockquote]:pl-4 [&_blockquote]:italic [&_blockquote]:my-4 [&_blockquote]:text-gray-400">
                            <?php the_content(); ?>
                        </div>

                        <?php
                        wp_link_pages( array(
                            'before' => '<div class="page-links text-gray-300 mt-6 font-semibold">' . esc_html__( 'Pages:', 'jw_mymo' ) . ' ',
                            'after'  => '</div>',
                        ) );
                        ?>

                        <?php if ( has_tag() ) : ?>
                            <div class="mt-8 pt-6 border-t border-gray-700">
                                <div class="flex flex-wrap items-center gap-2">
                                    <span class="text-gray-400 text-sm font-semibold"><?php esc_html_e( 'Tags:', 'jw_mymo' ); ?></span>
                                    <?php
                                    $tags = get_the_tags();
                                    if ( $tags ) {
                                        foreach ( $tags as $tag ) {
                                            echo '<a href="' . esc_url( get_tag_link( $tag->term_id ) ) . '" class="bg-brand-dark text-gray-300 hover:text-brand-accent px-3 py-1 rounded-full text-sm transition-colors">' . esc_html( $tag->name ) . '</a>';
                                        }
                                    }
                                    ?>
                                </div>
                            </div>
                        <?php endif; ?>
                    </div>
                </article>

                <?php
                if ( comments_open() || get_comments_number() ) :
                    comments_template();
                endif;
                ?>

            <?php endwhile; else : ?>
                <div class="bg-brand-gray p-8 rounded-lg text-center">
                    <h2 class="text-2xl font-bold text-white mb-4"><?php esc_html_e( 'Nothing Found', 'jw_mymo' ); ?></h2>
                    <p class="text-gray-400">
                        <?php esc_html_e( 'It seems we can&rsquo;t find what you&rsquo;re looking for.', 'jw_mymo' ); ?>
                    </p>
                </div>
            <?php endif; ?>
        </div>

        <?php get_sidebar(); ?>
    </div>
</main>

<?php get_footer(); ?>