Migrate theme templates to Bootstrap 5 components and grids

This commit is contained in:
Adolfo Reyna
2026-03-12 23:56:36 -04:00
parent 75a2173dc2
commit c2c018ff6f
7 changed files with 301 additions and 221 deletions

View File

@@ -6,44 +6,54 @@
get_header(); ?>
<div class="category-header">
<div class="site-container">
<h1 class="category-title"><?php echo is_home() ? 'The Library' : get_the_archive_title(); ?></h1>
<?php if ( get_the_archive_description() ) : ?>
<div class="category-description"><?php the_archive_description(); ?></div>
<div class="bg-light py-5 border-bottom mb-5">
<div class="container text-center">
<h1 class="display-4 fw-bold mb-3"><?php echo is_home() ? 'The Library' : get_the_archive_title(); ?></h1>
<?php if (get_the_archive_description()): ?>
<div class="lead text-muted mx-auto w-75"><?php the_archive_description(); ?></div>
<?php endif; ?>
</div>
</div>
<div class="site-container">
<div class="container mb-5">
<main id="primary" class="site-main">
<div class="insights-grid">
<div class="row g-4">
<?php
if ( have_posts() ) :
while ( have_posts() ) :
if (have_posts()):
while (have_posts()):
the_post();
?>
<article id="post-<?php the_ID(); ?>" <?php post_class( 'insight-card' ); ?>>
<header class="entry-header">
<div class="entry-meta">
<?php echo get_the_category_list( ', ' ); ?>
</div>
<?php the_title( '<h3 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h3>' ); ?>
</header>
<div class="col-md-6 col-lg-4 d-flex align-items-stretch">
<article id="post-<?php the_ID(); ?>" <?php post_class('card w-100 border-0 shadow-sm h-100'); ?>>
<div class="card-body d-flex flex-column">
<header class="entry-header mb-3">
<div class="entry-meta mb-2 small text-uppercase fw-bold text-muted">
<?php echo get_the_category_list(', '); ?>
</div>
<?php the_title('<h3 class="card-title h5 fw-bold"><a href="' . esc_url(get_permalink()) . '" class="text-dark text-decoration-none stretched-link">', '</a></h3>'); ?>
</header>
<div class="entry-summary">
<?php the_excerpt(); ?>
</div>
</article>
<div class="card-text text-muted flex-grow-1">
<?php the_excerpt(); ?>
</div>
</div>
</article>
</div>
<?php
endwhile;
the_posts_navigation();
else :
echo '<p>' . esc_html__( 'No posts found.', 'wisdom1' ) . '</p>';
echo '</div>'; // close row
the_posts_navigation(array(
'screen_reader_text' => 'Posts navigation',
'prev_text' => '<span class="btn btn-outline-primary">&larr; Older Posts</span>',
'next_text' => '<span class="btn btn-outline-primary">Newer Posts &rarr;</span>',
'class' => 'd-flex justify-content-between my-5'
));
else:
echo '<div class="col-12"><div class="alert alert-info text-center">' . esc_html__('No posts found.', 'wisdom1') . '</div></div></div>';
endif;
?>
</div>
</main>
</div>