feat(templates): namespace swap + dark surface + remove picsum fallbacks

This commit is contained in:
Keith Solomon
2026-08-16 13:20:06 -05:00
parent 2d9f92618b
commit 8125d1c818
8 changed files with 44 additions and 33 deletions
+4 -4
View File
@@ -2,11 +2,11 @@
/** /**
* Page Not Found * Page Not Found
* *
* @package SoloFrameEvo * @package KsPortfolio
* @since 1.0.0 * @since 1.0.0
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
get_header(); get_header();
?> ?>
@@ -20,8 +20,8 @@ get_header();
<p> <p>
<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>"> <form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label> <label>
<span class="screen-reader-text"><?php echo esc_html__( 'Search for:', 'label' ); ?></span> <span class="screen-reader-text"><?php echo esc_html__( 'Search for:', 'ks-portfolio' ); ?></span>
Try searching for it: <input type="search" class="search-field border border-secondary px-2 rounded-md" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder' ); ?>" value="<?php echo get_search_query(); ?>" name="s" title="<?php echo esc_attr__( 'Search for:', 'label' ); ?>" /> Try searching for it: <input type="search" class="search-field border border-secondary px-2 rounded-md" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder' ); ?>" value="<?php echo get_search_query(); ?>" name="s" title="<?php echo esc_attr__( 'Search for:', 'ks-portfolio' ); ?>" />
</label> </label>
<x-button <x-button
btnClasses="search-submit button text-center" btnClasses="search-submit button text-center"
+5 -6
View File
@@ -2,11 +2,11 @@
/** /**
* Blog posts list * Blog posts list
* *
* @package SoloFrameEvo * @package KsPortfolio
* @since 1.0.0 * @since 1.0.0
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
// Determine classes based on sidebar presence // Determine classes based on sidebar presence
if ( hasSidebar() ) { if ( hasSidebar() ) {
@@ -29,17 +29,16 @@ get_header();
the_post(); the_post();
?> ?>
<div class="post-list__post flex flex-col border border-secondary rounded-md shadow-lg hover:prose-img:scale-110 hover:prose-img:origin-center hover:prose-img:duration-500"> <div class="post-list__post flex flex-col border border-secondary rounded-md shadow-lg hover:prose-img:scale-110 hover:prose-img:origin-center hover:prose-img:duration-500">
<figure class="post-list__img aspect-video border-b border-secondary rounded-t-md block h-auto w-full overflow-hidden m-0 p-0">
<?php if ( has_post_thumbnail() ) : ?> <?php if ( has_post_thumbnail() ) : ?>
<figure class="post-list__img aspect-video border-b border-secondary rounded-t-md block h-auto w-full overflow-hidden m-0 p-0">
<?php <?php
$featImg = get_the_post_thumbnail_url(); $postImg = get_the_post_thumbnail_url();
$postImg = $featImg ? $featImg : 'https://picsum.photos/600/400?random=' . get_the_ID();
$imgAlt = get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true ) ?? get_the_title(); $imgAlt = get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true ) ?? get_the_title();
?> ?>
<img class="block h-full object-cover transition-transform duration-300 ease-linear w-full will-change-transform" src="<?php echo esc_url( $postImg ); ?>" alt="<?php echo esc_attr( $imgAlt ); ?>"> <img class="block h-full object-cover transition-transform duration-300 ease-linear w-full will-change-transform" src="<?php echo esc_url( $postImg ); ?>" alt="<?php echo esc_attr( $imgAlt ); ?>">
<?php endif; ?>
</figure> </figure>
<?php endif; ?>
<div class="post-list__details px-4 py-8 flex flex-col grow"> <div class="post-list__details px-4 py-8 flex flex-col grow">
<div class="post-list__cats"> <div class="post-list__cats">
+2 -2
View File
@@ -2,11 +2,11 @@
/** /**
* Single Pages * Single Pages
* *
* @package SoloFrameEvo * @package KsPortfolio
* @since 1.0.0 * @since 1.0.0
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
get_header(); get_header();
+5 -4
View File
@@ -2,11 +2,11 @@
/** /**
* Blog search template * Blog search template
* *
* @package SoloFrameEvo * @package KsPortfolio
* @since 1.0.0 * @since 1.0.0
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
// Determine classes based on sidebar presence // Determine classes based on sidebar presence
if ( hasSidebar() ) { if ( hasSidebar() ) {
@@ -29,15 +29,16 @@ get_header();
the_post(); the_post();
?> ?>
<div class="post-list__post flex flex-col border border-secondary rounded-md shadow-lg hover:prose-img:scale-110 hover:prose-img:origin-center hover:prose-img:duration-500"> <div class="post-list__post flex flex-col border border-secondary rounded-md shadow-lg hover:prose-img:scale-110 hover:prose-img:origin-center hover:prose-img:duration-500">
<?php if ( has_post_thumbnail() ) : ?>
<figure class="post-list__img aspect-video border-b border-secondary rounded-t-md block h-auto w-full overflow-hidden m-0 p-0"> <figure class="post-list__img aspect-video border-b border-secondary rounded-t-md block h-auto w-full overflow-hidden m-0 p-0">
<?php <?php
$featImg = get_the_post_thumbnail_url(); $postImg = get_the_post_thumbnail_url();
$postImg = $featimg ? $featImg : 'https://picsum.photos/600/400?random=' . get_the_ID();
$imgAlt = get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true ) ?? get_the_title(); $imgAlt = get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true ) ?? get_the_title();
?> ?>
<img class="block h-full object-cover transition-transform duration-300 ease-linear w-full will-change-transform" src="<?php echo esc_url( $postImg ); ?>" alt="<?php echo esc_attr( $imgAlt ); ?>"> <img class="block h-full object-cover transition-transform duration-300 ease-linear w-full will-change-transform" src="<?php echo esc_url( $postImg ); ?>" alt="<?php echo esc_attr( $imgAlt ); ?>">
</figure> </figure>
<?php endif; ?>
<div class="post-list__details px-4 py-8 flex flex-col flex-grow"> <div class="post-list__details px-4 py-8 flex flex-col flex-grow">
<?php <?php
+2 -2
View File
@@ -2,11 +2,11 @@
/** /**
* Single Posts * Single Posts
* *
* @package SoloFrameEvo * @package KsPortfolio
* @since 1.0.0 * @since 1.0.0
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
get_header(); get_header();
+1
View File
@@ -7,3 +7,4 @@
@import "./pagination.css"; @import "./pagination.css";
@import "./site-footer.css"; @import "./site-footer.css";
@import "./project-card.css"; @import "./project-card.css";
@import "./page-hero.css";
+10
View File
@@ -0,0 +1,10 @@
/* Page Hero partial styles */
.page-hero {
background: var(--color-surface-container-low, #1a1b21);
color: var(--color-on-surface, #e3e1e9);
border-bottom: 1px solid var(--color-outline-variant, #444651);
margin-bottom: 2rem;
}
.page-hero__title { color: var(--color-on-surface, #e3e1e9); font-family: var(--font-sans); font-weight: 700; }
.page-hero__intro { color: var(--color-on-surface-variant, #c5c5d3); }
+7 -7
View File
@@ -2,10 +2,10 @@
/** /**
* Page Hero Partial * Page Hero Partial
* *
* @package SoloFrameEvo * @package KsPortfolio
*/ */
namespace SoloFrameEvo; namespace KsPortfolio;
// Set variables // Set variables
$bgColor = get_field( 'background_color' ); $bgColor = get_field( 'background_color' );
@@ -24,7 +24,7 @@ if ( is_home() || is_single() || is_archive() || is_search() || is_404() ) {
} }
?> ?>
<div class="bg-cover bg-no-repeat mb-12 py-12 lg:py-16 bg-dark text-light overflow-hidden <?php echo $isDark ? 'dark' : ''; ?>" <?php echo $bgColor ? 'style="background-color: ' . esc_attr( $bgColor ) . '"' : ''; ?>> <section class="page-hero py-12 lg:py-16 <?php echo $isDark ? 'dark' : ''; ?>" <?php echo $bgColor ? 'style="background-color: ' . esc_attr( $bgColor ) . '"' : ''; ?>>
<div class="container mx-auto"> <div class="container mx-auto">
<div id="breadcrumbs"> <div id="breadcrumbs">
@@ -35,22 +35,22 @@ if ( is_home() || is_single() || is_archive() || is_search() || is_404() ) {
<?php <?php
// Heading // Heading
if ( apply_filters( 'include_page_title_in_hero', true ) ) { if ( apply_filters( 'include_page_title_in_hero', true ) ) {
echo '<h1 class="mx-auto text-center text-light font-normal text-4xl sm:text-5xl lg:text-6xl xl:text-7xl">'; echo '<h1 class="mx-auto text-center page-hero__title font-normal text-4xl sm:text-5xl lg:text-6xl xl:text-7xl">';
echo wp_kses_post( $heading ); echo wp_kses_post( $heading );
echo '</h1>'; echo '</h1>';
} else { } else {
echo '<span class="mx-auto block text-center text-light font-normal text-4xl sm:text-5xl lg:text-6xl xl:text-7xl">'; echo '<span class="mx-auto block text-center page-hero__title font-normal text-4xl sm:text-5xl lg:text-6xl xl:text-7xl">';
echo wp_kses_post( $heading ); echo wp_kses_post( $heading );
echo '</span>'; echo '</span>';
} }
// Intro // Intro
if ( $intro ) { if ( $intro ) {
echo '<p class="mt-3 text-base text-light sm:mt-5 sm:text-xl lg:text-lg xl:text-xl text-center">'; echo '<p class="mt-3 text-base page-hero__intro sm:mt-5 sm:text-xl lg:text-lg xl:text-xl text-center">';
echo wp_kses_post( $intro ); echo wp_kses_post( $intro );
echo '</p>'; echo '</p>';
} }
?> ?>
</div> </div>
</div> </div>
</div> </section>