ross/slowtwitch-news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

404, post page

Browse Source
This commit is contained in:
Ross Trottier 2024-07-02 14:45:52 -06:00
parent 35ee1fb1a3
commit 8f247e8478
6 changed files with 212 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
404.php Normal file
View File

@ -0,0 +1,46 @@
<?php get_header() ?>
<div class="st-main-grid st-four-oh-four">
<h1 class="st-four-oh-four__title">Oops, this page doesn't exist.</h1>
<p class="st-four-oh-four__subtitle">Check out some of our articles below.</p>
<section class="st-article-section-four-oh-four">
<?php
$post_section_two_args = array(
'showposts' => 12,
'offset' => 0,
'orderby' => 'post_date',
'order' => 'DESC',
'post_type' => 'post',
'post_status' => 'publish'
);
query_posts($post_section_two_args);
if (have_posts()):
while (have_posts()):
the_post();
$category = get_the_category()[0];
?>
<article class="st-article-section-wide-article">
<?php $category = get_the_category()[0]; ?>
<a href="<?php the_permalink(); ?>" class="st-article-section-wide-article__image-link">
<?php the_post_thumbnail(); ?>
</a>
<div class="st-article-section-wide-article__text-container">
<a href="<?php echo home_url($category->slug); ?>"
class="st-article-section-wide-article__category-link"><?php echo $category->name; ?></a>
<a class="st-article-section-wide-article__title" href="<?php the_permalink(); ?>">
<h3><?php the_title(); ?></h3>
</a>
<p class="st-article-section-wide-article__excerpt"><?php the_excerpt(); ?></p>
</div>
</a>
</article>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</section>
</div>
<?php get_footer() ?>

5
assets/js/st-nav.js
View File

@ -32,16 +32,17 @@ const iconBar = document.querySelector('.st-header-icon-bar');
const siteTitle = document.querySelector('.st-site-title');
const header = document.querySelector('.st-header');
let lastScrollPosition = 0;
const scrollDepthActivationPoint = 100;
window.addEventListener('scroll', function(event) {
const scrollPosition = window.scrollY;
if(scrollPosition < 5) {
if(scrollPosition < scrollDepthActivationPoint) {
iconBar.classList.remove('st-icon-bar-sticky');
siteTitle.classList.remove('st-title-scrolled');
header.classList.remove('st-header-scrolled');
} else {
if(lastScrollPosition < 5) {
if(lastScrollPosition < scrollDepthActivationPoint) {
iconBar.classList.add('st-icon-bar-sticky');
siteTitle.classList.add('st-title-scrolled');
header.classList.add('st-header-scrolled');

4
footer.php
View File

@ -29,9 +29,9 @@
<?php
wp_nav_menu(
array(
'menu' => 'primary',
'menu' => 'footer',
'container' => '',
'theme_location' => 'primary',
'theme_location' => 'footer',
'items_wrap' => '<ul class="st-footer-nav-links">%3$s</ul>'
)
);

2
functions.php
View File

@ -48,7 +48,7 @@ function custom_breadcrumbs() {
$separator = '&gt;';
$breadcrums_id = 'breadcrumbs';
$breadcrums_class = 'breadcrumbs';
$home_title = 'Homepage';
$home_title = 'Home';
// If you have any custom post types with custom taxonomies, put the taxonomy name below (e.g. product_cat)
$custom_taxonomy = 'product_cat';

54
single.php Normal file
View File

@ -0,0 +1,54 @@
<?php get_header() ?>
<article class="st-main-grid st-article">
<?php
if (have_posts()) {
while (have_posts()) {
the_post();
$post_id = get_the_ID(); ?>
<h1 class="st-article__title"> <?php the_title(); ?> </h1>
<div class="st-article__author-box">
<div class="st-article__author-name">
<?php the_author() ?>
</div>
<div>
<?php the_date() ?>
</div>
</div>
<?php the_content(); ?>
</article>
<?php
if(function_exists('get_field')){
$related_posts = get_field('related_posts', $post_id);
if (isset($related_posts)) :?>
<div class="st-main-grid">
<h3>Related Articles</h3>
<div class="st-article-section-related-articles">
<?php foreach ($related_posts as $post) : setup_postdata($post);
$category = get_the_category()[0];?>
<article class="st-related-article">
<a href="<?php the_permalink(); ?>" class="st-article-section-sub-article__image-link">
<?php the_post_thumbnail(); ?>
</a>
<div class="st-article-section-sub-article__text-container">
<a href="<?php echo home_url($category->slug); ?>" class="st-article-section-sub-article__category-link"><?php echo $category->name; ?></a>
<a class="st-article-section-sub-article__title" href="<?php the_permalink(); ?>"><h3><?php the_title(); ?></h3></a>
</div>
</a>
</article>
<?php endforeach;
wp_reset_postdata(); ?>
</div>
</div>
<?php
endif;
}
}
}?>
<?php get_footer() ?>

108
style.css
View File

@ -123,6 +123,7 @@ SECTIONS
text-decoration: none;
cursor: pointer;
color: black;
margin-top: 3px;
}
.st-icon-bar-sticky a {
@ -380,6 +381,7 @@ SECTIONS
.st-footer-menu {
grid-area: menu;
align-self: end;
}
.st-footer-nav-links {
@ -664,7 +666,8 @@ COMPONENTS
/* sub article card */
.st-article-section-sub-article {
.st-article-section-sub-article,
.st-related-article {
display: flex;
flex-direction: row;
margin-top: 1em;
@ -716,6 +719,11 @@ COMPONENTS
.st-article-section-sub-article:first-of-type {
margin-top: 0;
}
.st-related-article {
flex-direction: column;
max-width: 160px;
}
}
@media (min-width: 1200px) {
@ -799,7 +807,7 @@ COMPONENTS
.st-chip-secondary:hover,
.st-chip-secondary:active {
background: #270BA1;
background: #0b4fa0;
color: #fff;
}
@ -851,3 +859,99 @@ COMPONENTS
.st-ad-section-classifieds-card__title {
color: white;
}
/* breadcrumbs */
.breadcrumbs {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
}
.breadcrumbs li {
margin-left: .25em;
}
.st-article .breadcrumbs li:nth-last-child(2),
.st-article .breadcrumbs li:nth-last-child(1) {
display: none;
}
.breadcrumbs li:first-child {
margin-left: 0;
}
.breadcrumbs li a {
text-decoration: none;
}
.breadcrumbs li a:visited {
color: inherit;
}
/* article */
.st-article__title {
font-size: 2rem;
margin-top: 0;
}
.st-article .img-responsive {
width: 100%;
}
.st-article-section-related-articles {
display: flex;
flex-wrap: wrap;
gap: 1em;
margin-bottom: 2em;
}
@media (min-width: 760px) {
.st-article__title{
font-size: 2.5rem;
}
}
@media (min-width: 1200px) {
.st-article {
max-width: 850px;
margin: 0 auto;
}
.st-article__title{
font-size: 2.75rem;
}
}
/* Four oh Four */
.st-four-oh-four__title {
font-size: 2rem;
margin: 0;
}
.st-four-oh-four__subtitle {
font-size: 1.5rem;
}
@media (min-width: 760px) {
.st-article-section-four-oh-four {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1em;
}
}
@media (min-width: 1200px) {
.st-four-oh-four__title {
font-size: 4rem;
}
.st-article-section-four-oh-four {
grid-template-columns: repeat(4, 1fr);
}
}