Good-Production/sevastopol-tort.ru
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

images-portfolio

Browse Source
This commit is contained in:
Антон
2026-07-04 19:07:42 +03:00
parent 1daadd6d1e
commit a20d51db18
5 changed files with 298 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

151
wp-content/themes/sevastopol-tort-child/assets/css/portfolio-page.css Normal file
View File

@@ -0,0 +1,151 @@
.portfolio-page {
overflow: hidden;
}
.portfolio-hero {
padding: 72px 0 54px;
background: var(--color-bg);
}
.portfolio-hero__inner,
.portfolio-gallery__inner,
.portfolio-lead__inner {
width: min(100% - 40px, var(--container));
margin: 0 auto;
}
.portfolio-hero__inner {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(220px, 0.32fr);
align-items: end;
gap: 40px;
}
.portfolio-hero__content {
display: grid;
gap: 22px;
}
.portfolio-hero__eyebrow {
color: var(--color-accent);
font-size: var(--fz-xs);
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.portfolio-hero__title {
max-width: 780px;
font-size: var(--fz-xxl);
font-weight: 800;
line-height: var(--lh-tight);
}
.portfolio-hero__lead {
max-width: 720px;
color: var(--color-muted);
font-size: var(--fz-md);
}
.portfolio-hero__meta {
display: grid;
gap: 6px;
border: 1px solid var(--color-line);
border-radius: var(--radius-md);
background: var(--color-surface);
padding: 24px;
box-shadow: var(--shadow-soft);
}
.portfolio-hero__meta-number {
color: var(--color-accent-dark);
font-size: var(--fz-xl);
font-weight: 800;
line-height: 1;
}
.portfolio-hero__meta-text {
color: var(--color-muted);
}
.portfolio-gallery {
padding: 28px 0 76px;
background: var(--color-bg);
}
.portfolio-gallery__inner {
display: grid;
gap: 64px;
}
.portfolio-gallery__section {
display: grid;
gap: 24px;
}
.portfolio-gallery__head {
display: grid;
gap: 12px;
max-width: 820px;
}
.portfolio-gallery__title {
font-size: var(--fz-xl);
font-weight: 800;
line-height: var(--lh-tight);
}
.portfolio-gallery__lead {
color: var(--color-muted);
font-size: var(--fz-md);
}
.portfolio-gallery__grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 16px;
align-items: stretch;
}
.portfolio-gallery__item {
aspect-ratio: 1;
border: 1px solid var(--color-line);
border-radius: var(--radius-md);
overflow: hidden;
background: var(--color-surface-soft);
box-shadow: var(--shadow-soft);
}
.portfolio-gallery__image {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.24s ease;
}
.portfolio-gallery__item:hover .portfolio-gallery__image {
transform: scale(1.04);
}
.portfolio-lead {
padding: 70px 0;
background: var(--color-surface-soft);
}
.portfolio-lead__inner {
display: grid;
grid-template-columns: minmax(0, 0.82fr) minmax(360px, 0.68fr);
gap: 44px;
align-items: start;
}
.portfolio-lead__content {
display: grid;
gap: 22px;
}
.portfolio-lead__text {
max-width: 560px;
color: var(--color-muted);
font-size: var(--fz-md);
}

23
wp-content/themes/sevastopol-tort-child/assets/css/responsive.css
View File

@@ -9,7 +9,8 @@
}
.service-hero__title,
.policy-hero__title {
.policy-hero__title,
.portfolio-hero__title {
font-size: 2.8rem;
}
}
@@ -46,7 +47,10 @@
.home-categories,
.home-steps,
.policy-hero,
.policy-content {
.policy-content,
.portfolio-hero,
.portfolio-gallery,
.portfolio-lead {
padding: 44px 0;
}
@@ -55,7 +59,9 @@
.service-process__inner,
.service-lead__inner,
.home-hero__inner,
.home-steps__inner {
.home-steps__inner,
.portfolio-hero__inner,
.portfolio-lead__inner {
grid-template-columns: 1fr;
}
@@ -94,13 +100,17 @@
.home-steps__inner,
.site-footer__inner,
.policy-hero__inner,
.policy-content__inner {
.policy-content__inner,
.portfolio-hero__inner,
.portfolio-gallery__inner,
.portfolio-lead__inner {
width: min(100% - 20px, var(--container));
}
.service-hero__title,
.home-hero__title,
.policy-hero__title {
.policy-hero__title,
.portfolio-hero__title {
font-size: 2.2rem;
}
@@ -119,7 +129,8 @@
font-size: 1.7rem;
}
.service-lead__inner {
.service-lead__inner,
.portfolio-lead__inner {
gap: 28px;
}

2
wp-content/themes/sevastopol-tort-child/functions.php
View File

@@ -28,7 +28,7 @@ function sev_tort_enqueue_assets() {
$responsive_dependencies = array( 'sev-tort-layout' );
if ( $page ) {
$style = isset( $page['style'] ) ? $page['style'] : 'service-page.css';
$style = 'portfolio' === $page['slug'] ? 'portfolio-page.css' : ( isset( $page['style'] ) ? $page['style'] : 'service-page.css' );
wp_enqueue_style( 'sev-tort-page', $uri . '/assets/css/' . $style, array( 'sev-tort-layout' ), $theme_version );
$responsive_dependencies = array( 'sev-tort-page' );
} elseif ( is_front_page() ) {

4
wp-content/themes/sevastopol-tort-child/inc/routes.php
View File

@@ -36,6 +36,10 @@ function sev_tort_template_include( $template ) {
return get_stylesheet_directory() . '/page-templates/page-policy.php';
}
if ( 'portfolio' === $page['slug'] ) {
return get_stylesheet_directory() . '/page-templates/page-portfolio.php';
}
return get_stylesheet_directory() . '/page-templates/page-service.php';
}

125
wp-content/themes/sevastopol-tort-child/page-templates/page-portfolio.php Normal file
View File

@@ -0,0 +1,125 @@
<?php
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
$page = sev_tort_current_page_config();
if ( ! function_exists( 'sev_tort_portfolio_image_groups' ) ) {
function sev_tort_portfolio_image_groups() {
$base_dir = get_template_directory() . '/assets/images/images';
$base_uri = get_template_directory_uri() . '/assets/images/images';
$groups = array(
array(
'title' => 'Бенто и праздничные торты',
'lead' => 'Компактные торты, надписи, минималистичный и яркий декор для личных поводов.',
'path' => '',
'alt' => 'Бенто торт на заказ в Севастополе',
),
array(
'title' => 'Медовые торты и классические работы',
'lead' => 'Подборка тортов с натуральным декором, ягодами, кремом и аккуратной подачей.',
'path' => 'medobory_torty_na_zakaz',
'alt' => 'Медовый торт на заказ в Севастополе',
),
array(
'title' => 'Авторские торты Stefany Cake',
'lead' => 'Примеры детских, свадебных, тематических и праздничных тортов с индивидуальным декором.',
'path' => 'stefanycake_torty_na_zakaz',
'alt' => 'Авторский торт на заказ в Севастополе',
),
);
foreach ( $groups as $index => $group ) {
$directory = trailingslashit( $base_dir );
$uri = trailingslashit( $base_uri );
if ( $group['path'] ) {
$directory .= $group['path'] . '/';
$uri .= $group['path'] . '/';
}
$files = array();
foreach ( array( 'jpg', 'jpeg', 'png', 'webp' ) as $extension ) {
$matched_files = glob( $directory . '*.' . $extension );
if ( $matched_files ) {
$files = array_merge( $files, $matched_files );
}
}
natsort( $files );
$groups[ $index ]['images'] = array_map(
function ( $file ) use ( $directory, $uri, $group ) {
$name = basename( $file );
$number = preg_replace( '/\D+/', '', pathinfo( $name, PATHINFO_FILENAME ) );
$size = @getimagesize( $file );
return array(
'src' => $uri . $name,
'alt' => trim( $group['alt'] . ( $number ? ' - работа ' . $number : '' ) ),
'width' => $size ? $size[0] : 600,
'height' => $size ? $size[1] : 600,
);
},
$files
);
}
return $groups;
}
}
$portfolio_groups = sev_tort_portfolio_image_groups();
get_header();
?>
<main class="portfolio-page">
<section class="portfolio-hero">
<div class="portfolio-hero__inner">
<div class="portfolio-hero__content">
<span class="portfolio-hero__eyebrow">Портфолио</span>
<h1 class="portfolio-hero__title"><?php echo esc_html( $page['h1'] ); ?></h1>
<p class="portfolio-hero__lead"><?php echo esc_html( $page['lead'] ); ?></p>
</div>
<div class="portfolio-hero__meta">
<span class="portfolio-hero__meta-number"><?php echo esc_html( array_sum( array_map( static function ( $group ) { return count( $group['images'] ); }, $portfolio_groups ) ) ); ?></span>
<span class="portfolio-hero__meta-text">примеров тортов в галерее</span>
</div>
</div>
</section>
<section class="portfolio-gallery">
<div class="portfolio-gallery__inner">
<?php foreach ( $portfolio_groups as $group ) : ?>
<div class="portfolio-gallery__section">
<div class="portfolio-gallery__head">
<h2 class="portfolio-gallery__title"><?php echo esc_html( $group['title'] ); ?></h2>
<p class="portfolio-gallery__lead"><?php echo esc_html( $group['lead'] ); ?></p>
</div>
<div class="portfolio-gallery__grid">
<?php foreach ( $group['images'] as $image ) : ?>
<figure class="portfolio-gallery__item">
<img class="portfolio-gallery__image" src="<?php echo esc_url( $image['src'] ); ?>" alt="<?php echo esc_attr( $image['alt'] ); ?>" width="<?php echo esc_attr( $image['width'] ); ?>" height="<?php echo esc_attr( $image['height'] ); ?>" loading="lazy">
</figure>
<?php endforeach; ?>
</div>
</div>
<?php endforeach; ?>
</div>
</section>
<section class="portfolio-lead">
<div class="portfolio-lead__inner">
<div class="portfolio-lead__content">
<span class="section-eyebrow">Заявка</span>
<h2 class="section-title">Понравился стиль из портфолио?</h2>
<p class="portfolio-lead__text">Отправьте пример, дату и пожелания по весу. Подскажем начинку, стоимость и ближайший свободный срок.</p>
</div>
<?php get_template_part( 'template-parts/lead-form', null, array( 'context' => 'portfolio' ) ); ?>
</div>
</section>
</main>
<?php
get_footer();