Oblique metadata text
Make excerpt comments a link
This commit is contained in:
@@ -15,7 +15,13 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.article__date-text {
|
.article__date-icon {
|
||||||
margin-left: var(--space-xs);
|
vertical-align: middle;
|
||||||
vertical-align: top;
|
}
|
||||||
|
|
||||||
|
.article__date-text {
|
||||||
|
margin-left: var(--space-xxs);
|
||||||
|
vertical-align: middle;
|
||||||
|
font-style: oblique;
|
||||||
|
font-size: var(--size-body-small);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -22,6 +22,7 @@
|
|||||||
|
|
||||||
.comment__date {
|
.comment__date {
|
||||||
font-size: var(--size-body-extra-small);
|
font-size: var(--size-body-extra-small);
|
||||||
|
font-style: oblique;
|
||||||
}
|
}
|
||||||
|
|
||||||
.comment__body {
|
.comment__body {
|
||||||
|
|||||||
@@ -39,10 +39,12 @@
|
|||||||
|
|
||||||
.excerpt__icon,
|
.excerpt__icon,
|
||||||
.excerpt__text {
|
.excerpt__text {
|
||||||
|
font-weight: 100;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
.excerpt__text {
|
.excerpt__text {
|
||||||
|
font-style: oblique;
|
||||||
margin: 0 var(--space-sm) 0 var(--space-xxs);
|
margin: 0 var(--space-sm) 0 var(--space-xxs);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -81,3 +83,22 @@
|
|||||||
width: 0.1rem;
|
width: 0.1rem;
|
||||||
background-color: var(--color-light-blue);
|
background-color: var(--color-light-blue);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.excerpt__list-link {
|
||||||
|
color: inherit;
|
||||||
|
transition: color var(--transition-md) ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.excerpt__list-link:visited {
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.excerpt__list-link:hover,
|
||||||
|
.excerpt__list-link:focus {
|
||||||
|
color: var(--color-light-blue);
|
||||||
|
}
|
||||||
|
|
||||||
|
.excerpt__list-link:hover .excerpt__text,
|
||||||
|
.excerpt__list-link:focus .excerpt__text {
|
||||||
|
box-shadow: var(--link-focus);
|
||||||
|
}
|
||||||
|
|||||||
@@ -56,6 +56,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.metadata__text {
|
.metadata__text {
|
||||||
|
font-style: oblique;
|
||||||
margin-left: var(--space-xs);
|
margin-left: var(--space-xs);
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
transition: box-shadow var(--transition-md) ease-out;
|
transition: box-shadow var(--transition-md) ease-out;
|
||||||
|
|||||||
@@ -31,17 +31,19 @@ global $excerpt;
|
|||||||
<span class="excerpt__text"><?php echo $excerpt['date'] ?></span>
|
<span class="excerpt__text"><?php echo $excerpt['date'] ?></span>
|
||||||
</li>
|
</li>
|
||||||
<li class="excerpt__list-item">
|
<li class="excerpt__list-item">
|
||||||
<span class="excerpt__icon">
|
<a class="excerpt__list-link" href="<?php the_permalink() ?>#comments">
|
||||||
<svg class="icon icon--extra-small" aria-hidden="true">
|
<span class="excerpt__icon">
|
||||||
<use xlink:href="#icon-comments"></use>
|
<svg class="icon icon--extra-small" aria-hidden="true">
|
||||||
</svg>
|
<use xlink:href="#icon-comments"></use>
|
||||||
</span>
|
</svg>
|
||||||
<span class="excerpt__text">
|
</span>
|
||||||
<?php
|
<span class="excerpt__text">
|
||||||
$number = $excerpt['comments'];
|
<?php
|
||||||
echo $number === '1' ? '1 comment' : $number . ' comments';
|
$number = $excerpt['comments'];
|
||||||
?>
|
echo $number === '1' ? '1 comment' : $number . ' comments';
|
||||||
</span>
|
?>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -7,9 +7,11 @@
|
|||||||
<section class="page__article is-first">
|
<section class="page__article is-first">
|
||||||
<article class="article">
|
<article class="article">
|
||||||
<div class="article__date">
|
<div class="article__date">
|
||||||
<svg class="icon icon--small">
|
<span class="article__date-icon">
|
||||||
<use xlink:href="#icon-calendar"></use>
|
<svg class="icon icon--extra-small">
|
||||||
</svg>
|
<use xlink:href="#icon-calendar"></use>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
<span class="article__date-text">
|
<span class="article__date-text">
|
||||||
<?php the_time(get_option('date_format')) ?>
|
<?php the_time(get_option('date_format')) ?>
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -14,44 +14,23 @@
|
|||||||
<?php echo single_tag_title() ?>
|
<?php echo single_tag_title() ?>
|
||||||
</span>
|
</span>
|
||||||
</h1>
|
</h1>
|
||||||
<div class="content">
|
<ol>
|
||||||
<ol>
|
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
|
||||||
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
|
<li>
|
||||||
<?php $username = get_the_author_meta('nickname') ?>
|
<?php
|
||||||
<?php $date = get_the_date(get_option('date_format'), $id).' at '.get_the_date(get_option('time_format'), $id) ?>
|
$excerpt = array(
|
||||||
<li>
|
title => get_the_title(),
|
||||||
<div class="excerpt">
|
url => get_the_permalink(),
|
||||||
<div class="excerpt__head">
|
content => get_the_excerpt(),
|
||||||
<div class="excerpt__title">
|
author => get_the_author_meta('nickname'),
|
||||||
<a class="link" href="<?php the_permalink(); ?>">
|
comments => get_comments_number(),
|
||||||
<?php the_title(); ?>
|
date => get_the_date(get_option('date_format'), $id) . ' at ' . get_the_date(get_option('time_format'), $id),
|
||||||
</a>
|
);
|
||||||
</div>
|
get_template_part('partials/excerpt');
|
||||||
</div>
|
?>
|
||||||
<div class="excerpt__body">
|
</li>
|
||||||
<?php echo the_excerpt() ?>
|
<?php endwhile; ?>
|
||||||
</div>
|
</ol>
|
||||||
<div class="excerpt__foot">
|
|
||||||
<p class="excerpt__metadata">
|
|
||||||
<span class="excerpt__icon">
|
|
||||||
<svg class="icon icon--extra-small" aria-hidden="true">
|
|
||||||
<use xlink:href="#icon-profile"></use>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
<span class="excerpt__text"><?php echo $username ?></span>
|
|
||||||
<span class="excerpt__icon">
|
|
||||||
<svg class="icon icon--extra-small" aria-hidden="true">
|
|
||||||
<use xlink:href="#icon-calendar"></use>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
<span class="excerpt__text"><?php echo $date ?></span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<?php endwhile; ?>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
<section class="page__pagination">
|
<section class="page__pagination">
|
||||||
<?php get_template_part('partials/pagination') ?>
|
<?php get_template_part('partials/pagination') ?>
|
||||||
@@ -59,9 +38,7 @@
|
|||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<section class="page__content">
|
<section class="page__content">
|
||||||
<h1 class="title">Sorry, no results found.</h1>
|
<h1 class="title">Sorry, no results found.</h1>
|
||||||
<div class="content">
|
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
|
||||||
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
<section class="page__banner">
|
<section class="page__banner">
|
||||||
|
|||||||
Reference in New Issue
Block a user