c06ab0b8a2
Implement a complete overhaul of the theme templates to match the Kolli UI design, including enhanced WooCommerce support, dark mode functionality, and improved responsive layouts. - Redesign core templates: front-page, archive, single, and product pages - Implement dynamic WooCommerce templates for shop, single product, and checkout - Add comprehensive asset structure including fonts, images, and custom CSS/JS - Integrate Tailwind CSS via CDN with custom configuration for brand colors - Add dark mode support with local storage persistence - Refactor functions.php for better theme setup and script enqueuing - Implement custom product meta fields for ingredients and health benefits - Add responsive design improvements and custom animations
77 lines
3.5 KiB
PHP
77 lines
3.5 KiB
PHP
<?php
|
|
/**
|
|
* صفحه تک پست - مطابق با UI Kolli.html
|
|
*
|
|
* @package Motayeb
|
|
*/
|
|
|
|
get_header();
|
|
|
|
while ( have_posts() ) : the_post();
|
|
$categories = get_the_category();
|
|
$cat_name = ! empty( $categories ) ? $categories[0]->name : 'سلامت';
|
|
$cat_color = 'bg-forest-50 dark:bg-forest-900/30 text-forest-500 dark:text-forest-300';
|
|
if ( $cat_name === 'دستور پخت' || $cat_name === 'غذا' ) {
|
|
$cat_color = 'bg-honey-50 dark:bg-honey-900/30 text-honey-400';
|
|
} elseif ( $cat_name === 'سبک زندگی' ) {
|
|
$cat_color = 'bg-emerald-50 dark:bg-emerald-900/30 text-emerald-500';
|
|
}
|
|
$image = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full' );
|
|
$img_src = $image ? $image[0] : 'https://picsum.photos/seed/' . get_the_ID() . '/1200/600.jpg';
|
|
?>
|
|
|
|
<!-- ===== SINGLE POST ===== -->
|
|
<section class="py-8 md:py-16 bg-cream-100 dark:bg-dark-bg">
|
|
<div class="max-w-4xl mx-auto px-4 md:px-6">
|
|
<!-- Categories & Date -->
|
|
<div class="flex items-center gap-2 mb-6">
|
|
<span class="px-3 py-1 <?php echo esc_attr( $cat_color ); ?> text-xs rounded-full font-medium"><?php echo esc_html( $cat_name ); ?></span>
|
|
<span class="text-xs text-cream-500 dark:text-dark-muted"><?php echo get_the_date( 'j F Y' ); ?></span>
|
|
<span class="w-1 h-1 bg-cream-400 rounded-full"></span>
|
|
<span class="text-xs text-cream-500 dark:text-dark-muted"><?php echo get_the_author(); ?></span>
|
|
</div>
|
|
|
|
<!-- Title -->
|
|
<h1 class="text-3xl md:text-4xl lg:text-5xl font-extrabold mb-6"><?php the_title(); ?></h1>
|
|
|
|
<!-- Featured Image -->
|
|
<div class="rounded-2xl overflow-hidden mb-8 border border-cream-200/50 dark:border-dark-border/50">
|
|
<img src="<?php echo esc_url( $img_src ); ?>" alt="<?php the_title_attribute(); ?>" class="w-full h-auto max-h-[500px] object-cover">
|
|
</div>
|
|
|
|
<!-- Content -->
|
|
<div class="prose prose-lg prose-forest dark:prose-invert max-w-none text-cream-500 dark:text-dark-text leading-relaxed">
|
|
<?php the_content(); ?>
|
|
</div>
|
|
|
|
<!-- Tags -->
|
|
<?php if ( has_tag() ) : ?>
|
|
<div class="mt-8 pt-8 border-t border-cream-200 dark:border-dark-border">
|
|
<div class="flex flex-wrap gap-2">
|
|
<?php the_tags( '<span class="text-sm font-medium text-cream-500 dark:text-dark-muted">برچسبها:</span> ', ' ' ); ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
|
|
<!-- Navigation -->
|
|
<div class="mt-10 pt-8 border-t border-cream-200 dark:border-dark-border flex flex-wrap justify-between gap-4">
|
|
<div class="flex-1 min-w-[120px]">
|
|
<?php previous_post_link( '%link', '<iconify-icon icon="lucide:chevron-right" width="18"></iconify-icon> <span class="text-sm font-medium">مطلب قبلی</span>', false ); ?>
|
|
</div>
|
|
<div class="flex-1 min-w-[120px] text-left">
|
|
<?php next_post_link( '%link', '<span class="text-sm font-medium">مطلب بعدی</span> <iconify-icon icon="lucide:chevron-left" width="18"></iconify-icon>', false ); ?>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Comments -->
|
|
<?php if ( comments_open() || get_comments_number() ) : ?>
|
|
<div class="mt-12 pt-8 border-t border-cream-200 dark:border-dark-border">
|
|
<?php comments_template(); ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
</section>
|
|
|
|
<?php
|
|
endwhile;
|
|
get_footer();
|