feat(archive-letter): improve UI and readability
Refactored layout of letters archive to use Bootstrap list group for a cleaner and more responsive design. Simplified author display to show 'et al.' when multiple authors are present, enhancing readability. Added margin top for consistent spacing. Implements better UX for browsing letters.
This commit is contained in:
parent
3cb11088a5
commit
a1fa110001
1 changed files with 19 additions and 22 deletions
|
@ -3,34 +3,31 @@
|
|||
<!-- Archive Content -->
|
||||
<section class="container my-5">
|
||||
<h1 class="display-4 text-center">Letters to the Editor</h1>
|
||||
<div class="row">
|
||||
<div class="list-group">
|
||||
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
|
||||
<div class="col-md-4">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<?php if (has_post_thumbnail()) : ?>
|
||||
<img src="<?php the_post_thumbnail_url(); ?>" class="card-img-top" alt="<?php the_title(); ?>">
|
||||
<?php endif; ?>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title"><?php the_title(); ?></h5>
|
||||
<p class="card-text"> <?php
|
||||
<a href="<?php the_permalink(); ?>" class="list-group-item list-group-item-action">
|
||||
<h5 class="mb-1"><?php the_title(); ?></h5>
|
||||
<p class="mb-1">
|
||||
<?php
|
||||
$authors = get_post_meta(get_the_ID(), 'article_authors', true);
|
||||
if (!empty($authors)) {
|
||||
echo implode(', ', array_map('esc_html', $authors));
|
||||
echo esc_html($authors[0]);
|
||||
if (count($authors) > 1) {
|
||||
echo ' et al.';
|
||||
}
|
||||
} else {
|
||||
the_author();
|
||||
}
|
||||
?> | <?php the_date(); ?></p>
|
||||
<p class="card-text"><?php the_excerpt(); ?></p>
|
||||
<a href="<?php the_permalink(); ?>" class="btn btn-outline-primary">Read More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
?> | <?php the_date(); ?>
|
||||
</p>
|
||||
<p class="mb-1"><?php the_excerpt(); ?></p>
|
||||
</a>
|
||||
<?php endwhile;
|
||||
else : ?>
|
||||
<p><?php _e('Sorry, no letters found.', 'duck-behavior-journal'); ?></p>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
<?php
|
||||
echo paginate_links(array(
|
||||
|
|
Loading…
Reference in a new issue