Tags template

This commit is contained in:
2018-12-13 21:56:06 +00:00
parent 9a2baf2f95
commit 07e5436c4b
8 changed files with 125 additions and 39 deletions

View File

@@ -1,28 +1,28 @@
.search-result { .excerpt {
margin-bottom: var(--space-sm); margin-bottom: var(--space-sm);
} }
.search-result__head, .excerpt__head,
.search-result__body, .excerpt__body,
.search-result__title { .excerpt__title {
margin-bottom: var(--space-xs); margin-bottom: var(--space-xs);
} }
.search-result__metadata { .excerpt__metadata {
color: var(--color-grey); color: var(--color-grey);
font-size: 12px; font-size: 12px;
} }
.search-result__icon, .excerpt__icon,
.search-result__text { .excerpt__text {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
.search-result__icon { .excerpt__icon {
height: 16px; height: 16px;
} }
.search-result__text { .excerpt__text {
margin: 0 15px 0 5px; margin: 0 15px 0 5px;
} }

View File

@@ -19,7 +19,7 @@
@import "pagination"; @import "pagination";
@import "title"; @import "title";
@import "archive"; @import "archive";
@import "search-result"; @import "excerpt";
:root { :root {
--color-black: #000; --color-black: #000;

View File

@@ -4,13 +4,22 @@
margin-bottom: var(--space-sm); margin-bottom: var(--space-sm);
} }
.title a {
color: inherit;
}
@media (--viewport-lg) { @media (--viewport-lg) {
.title { .title {
margin-bottom: var(--space-md); margin-bottom: var(--space-md);
} }
} }
.title a {
color: inherit;
}
.title__icon,
.title__text {
display: inline-block;
vertical-align: middle;
}
.title__text {
text-transform: capitalize;
}

View File

@@ -61,7 +61,7 @@ function windycoys_the_tags() {
if ($tags) { if ($tags) {
foreach($tags as $key=>$tag) { foreach($tags as $key=>$tag) {
echo '<a class="metadata__categories-link" href="' . echo '<a class="metadata__categories-link" href="' .
home_url() . '/tags/' . $tag->name . '" rel="tag">' . home_url() . '/tag/' . $tag->name . '" rel="tag">' .
$tag->name . '</a>'; $tag->name . '</a>';
if ($key < count($tags) - 1) { if ($key < count($tags) - 1) {
echo ', '; echo ', ';

View File

@@ -1,16 +1,16 @@
<div class="social"> <div class="social">
<a class="social__link" href="https://www.facebook.com/WindyCOYS/"> <a class="social__link" href="https://www.facebook.com/WindyCOYS/" aria-label="WindyCOYS on Facebook">
<svg class="icon icon--facebook"> <svg class="icon icon--facebook" aria-hidden="true">
<use href="#icon-facebook"></use> <use href="#icon-facebook"></use>
</svg> </svg>
</a> </a>
<a class="social__link" href="https://twitter.com/windycoys/"> <a class="social__link" href="https://twitter.com/windycoys/" aria-label="WindyCOYS on Twitter">
<svg class="icon icon--twitter"> <svg class="icon icon--twitter" aria-hidden="true">
<use href="#icon-twitter"></use> <use href="#icon-twitter"></use>
</svg> </svg>
</a> </a>
<a class="social__link" href="/feed"> <a class="social__link" href="/feed" aria-label="WindyCOYS RSS Feed">
<svg class="icon icon--rss"> <svg class="icon icon--rss" aria-hidden="true">
<use href="#icon-rss"></use> <use href="#icon-rss"></use>
</svg> </svg>
</a> </a>

View File

@@ -1,6 +1,6 @@
<section class="metadata"> <section class="metadata">
<div class="metadata__date"> <div class="metadata__date">
<svg class="icon"> <svg class="icon" aria-hidden="true">
<use href="#icon-calendar"></use> <use href="#icon-calendar"></use>
</svg> </svg>
<span class="metadata__date-text"> <span class="metadata__date-text">
@@ -10,7 +10,7 @@
<?php if (is_user_logged_in()): ?> <?php if (is_user_logged_in()): ?>
<div class="metadata__editor"> <div class="metadata__editor">
<a class="metadata__editor-link" href="<?php echo get_edit_post_link() ?>"> <a class="metadata__editor-link" href="<?php echo get_edit_post_link() ?>">
<svg class="icon"> <svg class="icon" aria-hidden="true">
<use href="#icon-edit"></use> <use href="#icon-edit"></use>
</svg> </svg>
<span class="metadata__editor-text"> <span class="metadata__editor-text">
@@ -21,7 +21,7 @@
<?php endif; ?> <?php endif; ?>
<div class="metadata__comments"> <div class="metadata__comments">
<a class="metadata__comments-link" href="<?php the_permalink() ?>#comments"> <a class="metadata__comments-link" href="<?php the_permalink() ?>#comments">
<svg class="icon"> <svg class="icon" aria-hidden="true">
<use href="#icon-comments"></use> <use href="#icon-comments"></use>
</svg> </svg>
<span class="metadata__comments-text"> <span class="metadata__comments-text">
@@ -30,7 +30,7 @@
</a> </a>
</div> </div>
<div class="metadata__categories"> <div class="metadata__categories">
<svg class="icon"> <svg class="icon" aria-hidden="true">
<use href="#icon-hash"></use> <use href="#icon-hash"></use>
</svg> </svg>
<span class="metadata__categories-text"> <span class="metadata__categories-text">
@@ -39,12 +39,12 @@
</div> </div>
<div class="metadata__share"> <div class="metadata__share">
<a class="metadata__share-link" href="#" aria-label="Facebook"> <a class="metadata__share-link" href="#" aria-label="Facebook">
<svg class="icon icon--facebook"> <svg class="icon icon--facebook" aria-hidden="true">
<use href="#icon-facebook"></use> <use href="#icon-facebook"></use>
</svg> </svg>
</a> </a>
<a class="metadata__share-link" href="<?php windycoys_share_twitter_url() ?>" aria-label="Twitter"> <a class="metadata__share-link" href="<?php windycoys_share_twitter_url() ?>" aria-label="Twitter">
<svg class="icon icon--twitter"> <svg class="icon icon--twitter" aria-hidden="true">
<use href="#icon-twitter"></use> <use href="#icon-twitter"></use>
</svg> </svg>
</a> </a>

View File

@@ -14,36 +14,36 @@ get_header();
echo $wp_query->found_posts.' results matching "' . $query . '" found.'; echo $wp_query->found_posts.' results matching "' . $query . '" found.';
?> ?>
</h1> </h1>
<ol class="search-results"> <ol>
<?php if (have_posts()): while (have_posts()) : the_post(); ?> <?php if (have_posts()): while (have_posts()) : the_post(); ?>
<?php $username = get_the_author_meta('nickname') ?> <?php $username = get_the_author_meta('nickname') ?>
<?php $date = get_the_date('jS F, Y', $id).' at '.get_the_date('H:i', $id) ?> <?php $date = get_the_date('jS F, Y', $id).' at '.get_the_date('H:i', $id) ?>
<li class="search-results__content"> <li>
<div class="search-result"> <div class="excerpt">
<div class="search-result__head"> <div class="excerpt__head">
<div class="search-result__title"> <div class="excerpt__title">
<a class="link" href="<?php the_permalink(); ?>"> <a class="link" href="<?php the_permalink(); ?>">
<?php the_title(); ?> <?php the_title(); ?>
</a> </a>
</div> </div>
</div> </div>
<div class="search-result__body"> <div class="excerpt__body">
<?php echo the_excerpt() ?> <?php echo the_excerpt() ?>
</div> </div>
<div class="search-result__foot"> <div class="excerpt__foot">
<p class="search-result__metadata"> <p class="excerpt__metadata">
<span class="search-result__icon"> <span class="excerpt__icon">
<svg class="icon icon--extra-small" aria-hidden="true"> <svg class="icon icon--extra-small" aria-hidden="true">
<use href="#icon-profile"></use> <use href="#icon-profile"></use>
</svg> </svg>
</span> </span>
<span class="search-result__text"><?php echo $username ?></span> <span class="excerpt__text"><?php echo $username ?></span>
<span class="search-result__icon"> <span class="excerpt__icon">
<svg class="icon icon--extra-small" aria-hidden="true"> <svg class="icon icon--extra-small" aria-hidden="true">
<use href="#icon-calendar"></use> <use href="#icon-calendar"></use>
</svg> </svg>
</span> </span>
<span class="search-result__text"><?php echo $date ?></span> <span class="excerpt__text"><?php echo $date ?></span>
</p> </p>
</div> </div>
</div> </div>

77
theme/tag.php Normal file
View File

@@ -0,0 +1,77 @@
<?php get_header() ?>
<main class="page">
<section class="page__logo">
<?php get_template_part('partials/logo') ?>
</section>
<section class="page__content">
<div class="content">
<h1 class="title">
<span class="title__icon">
<svg class="icon icon--large" aria-hidden="true">
<use href="#icon-hash"></use>
</svg>
</span>
<span class="title__text">
<?php echo single_tag_title() ?>
</span>
</h1>
<ol>
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<?php $username = get_the_author_meta('nickname') ?>
<?php $date = get_the_date('jS F, Y', $id).' at '.get_the_date('H:i', $id) ?>
<li>
<div class="excerpt">
<div class="excerpt__head">
<div class="excerpt__title">
<a class="link" href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</div>
</div>
<div class="excerpt__body">
<?php echo the_excerpt() ?>
</div>
<div class="excerpt__foot">
<p class="excerpt__metadata">
<span class="excerpt__icon">
<svg class="icon icon--extra-small" aria-hidden="true">
<use 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 href="#icon-calendar"></use>
</svg>
</span>
<span class="excerpt__text"><?php echo $date ?></span>
</p>
</div>
</div>
</li>
<?php endwhile; ?>
</ol>
</div>
</section>
<section class="page__pagination">
<?php get_template_part('partials/pagination') ?>
</section>
<?php else: ?>
<section class="page__article">
<article class="article">
<h1 class="article__title">Sorry, no results found.</h1>
<div class="article__content">
<a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
</div>
</article>
</section>
<?php endif; ?>
<section class="page__banner">
<?php get_template_part('partials/banner') ?>
</section>
<section class="page__footer">
<?php get_template_part('partials/footer') ?>
</section>
</main>
<?php get_template_part('partials/navigation') ?>
<?php get_footer() ?>