index & scss/blog: support article listing
This commit is contained in:
parent
1796246433
commit
2ceb6873be
4 changed files with 88 additions and 1 deletions
25
components/posts-list.php
Normal file
25
components/posts-list.php
Normal file
|
@ -0,0 +1,25 @@
|
|||
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
|
||||
<article class="list-article" id="post-<?php the_ID(); ?>">
|
||||
<aside class="list-article-thumbnail">
|
||||
<?php the_post_thumbnail( ); ?>
|
||||
</aside>
|
||||
|
||||
<div class="list-article-main">
|
||||
<h2 class="list-article-title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>""><?php the_title(); ?></a></h2>
|
||||
<div class="list-article-metadata">
|
||||
<p class="categories">
|
||||
<?php $category = get_the_category();
|
||||
echo"<a href= '" . esc_url( get_category_link( $category[0]->term_id ) ) . "' class='badge badge-blue badge-category'>" . $category[0]->cat_name . "</a>"; ?>
|
||||
</p>
|
||||
<p class="author-time"><?php the_time('j F Y') ?> par <?php the_author() ?></p>
|
||||
</div>
|
||||
<div class="list-article-content"><?php the_excerpt(); ?></div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<?php endwhile; ?>
|
||||
|
||||
<div class="navigation">
|
||||
<?php the_posts_pagination(); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
|
@ -1,6 +1,7 @@
|
|||
<?php get_header(); ?>
|
||||
<main class="col-md-9">
|
||||
|
||||
<h1 class="page-title"><i class="fa fa-fw fa-clock-o"></i> Articles récents</h1>
|
||||
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||
</main>
|
||||
<?php get_sidebar(); ?>
|
||||
<?php get_footer(); ?>
|
||||
|
|
|
@ -153,3 +153,39 @@
|
|||
margin-bottom:0.4em;
|
||||
display:block;
|
||||
}
|
||||
|
||||
/* 2.1.1 - Article list */
|
||||
|
||||
.list-article {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
&-thumbnail {
|
||||
display: block;
|
||||
padding-top: 0.35em;
|
||||
max-width: 200px;
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&-main {
|
||||
padding-left:1em;
|
||||
}
|
||||
&-title {
|
||||
font-family: Teko;
|
||||
font-weight: 600;
|
||||
margin-bottom: 0em;
|
||||
a {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
&-metadata {
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&-content {
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
|
25
style.css
25
style.css
|
@ -1307,3 +1307,28 @@ a.list-group-item:hover {
|
|||
.card-preview time {
|
||||
margin-bottom: 0.4em;
|
||||
display: block; }
|
||||
|
||||
/* 2.1.1 - Article list */
|
||||
.list-article {
|
||||
display: flex;
|
||||
flex-direction: row; }
|
||||
.list-article-thumbnail {
|
||||
display: block;
|
||||
padding-top: 0.35em;
|
||||
max-width: 200px; }
|
||||
.list-article-thumbnail img {
|
||||
max-width: 100%;
|
||||
height: auto; }
|
||||
.list-article-main {
|
||||
padding-left: 1em; }
|
||||
.list-article-title {
|
||||
font-family: Teko;
|
||||
font-weight: 600;
|
||||
margin-bottom: 0em; }
|
||||
.list-article-title a {
|
||||
color: #444; }
|
||||
.list-article-metadata {
|
||||
display: flex;
|
||||
justify-content: space-between; }
|
||||
.list-article-content {
|
||||
font-style: italic; }
|
||||
|
|
Reference in a new issue