full
This commit is contained in:
GP_DEV
@@ -3,7 +3,7 @@
|
||||
* Блок с клубными картами
|
||||
*/
|
||||
|
||||
// Получение полей ACF
|
||||
|
||||
$block_id = 'club-cards-' . $block['id'];
|
||||
$class_name = 'club-cards-block';
|
||||
if (!empty($block['className'])) {
|
||||
@@ -14,14 +14,17 @@ if (!empty($block['align'])) {
|
||||
}
|
||||
|
||||
if (!function_exists('get_club_cards_for_current_language')) {
|
||||
function get_club_cards_for_current_language() {
|
||||
function get_club_cards_for_current_language()
|
||||
{
|
||||
$current_lang = pll_current_language();
|
||||
|
||||
$args = array(
|
||||
'post_type' => 'club-card',
|
||||
'posts_per_page' => -1,
|
||||
'lang' => $current_lang,
|
||||
'post_status' => 'publish'
|
||||
'post_status' => 'publish',
|
||||
'sort' => 'menu_order',
|
||||
'order' => 'ASC',
|
||||
);
|
||||
|
||||
return get_posts($args);
|
||||
@@ -30,57 +33,118 @@ if (!function_exists('get_club_cards_for_current_language')) {
|
||||
|
||||
$cards = get_club_cards_for_current_language();
|
||||
$heading = get_field('heading', $block['id']);
|
||||
|
||||
$room = get_current_room();
|
||||
|
||||
if ($room === 'fitness') {
|
||||
|
||||
} else {
|
||||
$section_classes = 'bg-cover bg-center bg-no-repeat';
|
||||
$bg_image = get_template_directory_uri() . '/assets/images/hero-bg.png';
|
||||
$style_attr = 'style="background-image: url(' . esc_url($bg_image) . ')"';
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<section id="<?php echo esc_attr($block_id); ?>" class="<?php echo esc_attr($class_name); ?>">
|
||||
<div class="container mx-auto mt-[24px]">
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[32px] font-bold mt-[24px]"><?php echo esc_html($heading); ?></h2>
|
||||
<?php endif; ?>
|
||||
<section id="<?php echo esc_attr($block_id); ?>" class="py-[96px] <?php echo esc_attr($section_classes); ?>" <?php echo $style_attr; ?>>
|
||||
<div class="container mx-auto">
|
||||
<?php if ($cards): ?>
|
||||
<div class="mt-[24px] grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-[30px] max-[768px]:gap-[20px]">
|
||||
<?php foreach ($cards as $card): ?>
|
||||
<div class="bg-[#ffffff] border-[1px] border-[#e5e7eb] rounded-[16px] overflow-hidden shadow-lg hover:shadow-xl transition-shadow ">
|
||||
<?php
|
||||
$card_image = get_field('image', $card->ID);
|
||||
if ($card_image): ?>
|
||||
<div class="overflow-hidden max-w-[60px] max-h-[60px] mx-auto mt-[22px] rounded-full">
|
||||
<img src="<?php echo esc_url($card_image['url']); ?>"
|
||||
alt="<?php echo esc_attr($card_image['alt']); ?>"
|
||||
class="w-full h-full object-cover" />
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="mt-[24px] grid grid-cols-3 gap-[24px]">
|
||||
<?php if (is_front_page()): ?>
|
||||
<?php if ($heading) : ?>
|
||||
<div class="flex flex-col gap-[16px] [&>img]:w-[294px] mt-[28px]">
|
||||
|
||||
<div class="p-[30px] max-[768px]:p-[20px]">
|
||||
<?php $card_heading = get_field('heading', $card->ID); ?>
|
||||
<?php if ($card_heading): ?>
|
||||
<h3 class="text-[24px] max-[768px]:text-[20px] font-semibold text-[#1f2937] mb-[16px] text-center">
|
||||
<?php echo esc_html($card_heading); ?>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
<h2 class="dark:text-[#fff] text-[40px] leading-[120%] font-[500]"><?php echo esc_html($heading); ?></h2>
|
||||
<?php display_icon(get_current_room() === 'gym' ? 'dark_logo_name' : 'light_logo_name'); ?>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php endif; ?>
|
||||
<?php foreach ($cards as $card): ?>
|
||||
<div class="bg-[#ffffff] rounded-[12px] p-[28px] pb-[16px] h-[258px] shadow-[0_2px_32px_0_rgba(16,_15,_15,_0.03)]">
|
||||
<div class="flex flex-col h-full">
|
||||
<div class="flex gap-[16px] items-center"> <?php
|
||||
$card_image = get_field('image', $card->ID);
|
||||
if ($card_image): ?>
|
||||
<div class="overflow-hidden w-[32px] h-[32px]">
|
||||
<img src="<?php echo esc_url($card_image['url']); ?>"
|
||||
alt="<?php echo esc_attr($card_image['alt']); ?>"
|
||||
class="w-full h-full object-cover"/>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php $card_heading = get_field('heading', $card->ID); ?>
|
||||
<?php if ($card_heading): ?>
|
||||
<h3 class="text-[24px] font-[600] leading-[125%]">
|
||||
<?php echo esc_html($card_heading); ?>
|
||||
</h3>
|
||||
<?php endif; ?></div>
|
||||
|
||||
<?php $card_description = get_field('description', $card->ID); ?>
|
||||
<?php if ($card_description): ?>
|
||||
<div class="text-[16px] max-[768px]:text-[14px] text-[#6b7280] leading-[150%] text-center mb-[16px]">
|
||||
<div class="text-[16px] leading-[145%] font-[500] mt-[16px]">
|
||||
<?php echo wp_kses_post($card_description); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php $card_price = get_field('price', $card->ID); ?>
|
||||
<?php if ($card_price): ?>
|
||||
<div class="text-[20px] max-[768px]:text-[18px] font-bold text-[#1f2937] text-center mb-[24px]">
|
||||
<span>От</span> <?php echo esc_html($card_price); ?> Р.
|
||||
</div>
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="text-center mt-auto">
|
||||
<div class="flex mt-auto pt-[16px] border-t border-t-[#f1f1f1] justify-between items-center gap-[12px] flex-wrap">
|
||||
<?php $popup_button = get_field('popup_button', $card->ID); ?>
|
||||
<button data-modal="club-card"
|
||||
data-card-id="<?php echo $card->ID; ?>"
|
||||
class="inline-block cursor-pointer px-[24px] py-[12px] bg-[#3b82f6] text-white rounded-[8px] hover:bg-[#2563eb] transition-colors ">
|
||||
<?php echo $popup_button ? esc_html($popup_button) : 'Подробнее'; ?>
|
||||
</button>
|
||||
<?php $card_price = get_field('price', $card->ID) ?: ($card_prices['1_month']['day'] ?? ''); ?>
|
||||
<?php
|
||||
$card_prices = [];
|
||||
if (have_rows('card_prices', $card->ID)) {
|
||||
while (have_rows('card_prices', $card->ID)) {
|
||||
the_row();
|
||||
|
||||
$periods = ['1_month', '3_month', '6_month', '12_month'];
|
||||
foreach ($periods as $period) {
|
||||
if (have_rows($period)) {
|
||||
while (have_rows($period)) {
|
||||
the_row();
|
||||
$card_prices[$period] = [
|
||||
'full' => get_sub_field('full'),
|
||||
'day' => get_sub_field('day')
|
||||
];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
<?php
|
||||
$card_time = [];
|
||||
if (have_rows('time', $card->ID)) {
|
||||
while (have_rows('time', $card->ID)) {
|
||||
the_row();
|
||||
$card_time[] = [
|
||||
'normal_days' => get_sub_field('normal_days'),
|
||||
'vacation_days' => get_sub_field('vacation_days')
|
||||
];
|
||||
}
|
||||
}
|
||||
?>
|
||||
<div>
|
||||
<button
|
||||
data-modal="club-card"
|
||||
data-card-id="<?php echo $card->ID; ?>"
|
||||
data-card-title="<?php echo esc_attr($card_heading); ?>"
|
||||
data-card-prices='<?php echo esc_attr(json_encode($card_prices)); ?>'
|
||||
data-card-time='<?php echo esc_attr(json_encode($card_time));
|
||||
?>'
|
||||
class="red-gradient-hover cursor-pointer flex text-[#f8f8f8] text-[18px] text-[#fff] font-[600] justify-center h-[59px] w-[160px] rounded-[90px] flex items-center">
|
||||
<?php echo 'Оформить' ?>
|
||||
</button>
|
||||
</div>
|
||||
<?php if ($card_price): ?>
|
||||
<div class="flex items-center text-[20px] font-[600] leading-[125%]">
|
||||
от
|
||||
<div class="rounded-[32px] px-[12px] h-[36px] flex items-center bg-[linear-gradient(90deg,_rgba(43,_44,_53,_0.06)_39.42%,_rgba(110,_121,_150,_0.06)_92.9%)]">
|
||||
<span class="bg-[linear-gradient(90deg,_#2b2c35_67.31%,_#4f5870_92.9%)] text-[24px] flex items-center justify-center font-[600] bg-clip-text text-transparent"> <?php echo esc_html($card_price); ?> ₽ </span>
|
||||
</div>
|
||||
в день
|
||||
</div>
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,110 +1,74 @@
|
||||
ymaps.ready(function () {
|
||||
ymaps.ready(function () {
|
||||
|
||||
var buildingCoordinates = [55.832659, 37.576118];
|
||||
var buildingCoordinates = [56.462317, 84.969289];
|
||||
|
||||
//Смещение карты, чтобы иконка была визуально по центру
|
||||
// Смещение карты, чтобы иконка была визуально по центру
|
||||
var offsetCoefficient = 0.001;
|
||||
|
||||
var mapCenter = [
|
||||
buildingCoordinates[0],
|
||||
buildingCoordinates[1] - offsetCoefficient
|
||||
buildingCoordinates[0],
|
||||
buildingCoordinates[1] - offsetCoefficient
|
||||
];
|
||||
|
||||
var myMap = new ymaps.Map('map', {
|
||||
center: mapCenter,
|
||||
zoom: 17,
|
||||
controls: []
|
||||
});
|
||||
center: mapCenter,
|
||||
zoom: 17,
|
||||
controls: []
|
||||
});
|
||||
|
||||
// Отключаем все взаимодействия с картой
|
||||
myMap.behaviors.disable(['scrollZoom', 'drag', 'multiTouch', 'dblClickZoom']);
|
||||
|
||||
var svgIcon = '<svg width="146" height="175" viewBox="0 0 146 175" fill="none" xmlns="http://www.w3.org/2000/svg">' +
|
||||
'<path d="M73 174.328L48.4669 131.836H97.5331L73 174.328Z" fill="#FA4241" />' +
|
||||
'<circle cx="71.9104" cy="73" r="73" fill="url(#paint0_linear_150_2453)" />' +
|
||||
'<path d="M58.0581 42.549C50.1523 47.1076 43.6824 50.8665 43.6985 50.9305C43.7469 51.0424 52.3304 56.0169 52.4756 56.0169C52.524 56.0169 57.0094 53.4577 62.4628 50.3386C67.9162 47.2196 72.4339 44.6444 72.5145 44.6284C72.5952 44.5964 77.1612 47.1556 82.6631 50.3067L92.6825 56.0429L96.942 53.6117C99.2656 52.2841 101.266 51.1004 101.379 51.0044C101.525 50.8765 98.0553 48.8131 87.2614 42.639C79.3878 38.1444 72.8372 34.4175 72.7081 34.3855C72.5791 34.3375 65.9801 38.0164 58.0581 42.549Z" fill="white" />' +
|
||||
'<path d="M38.5032 73.2768V92.7908L42.0043 90.7755C43.9405 89.6718 45.9734 88.5201 46.5381 88.2002L47.5384 87.6244V78.2993C47.5384 73.1648 47.5707 68.9741 47.603 68.9741C47.6352 68.9741 53.2661 72.1891 60.1232 76.1079C66.9642 80.0267 72.6597 83.1938 72.7565 83.1458C72.8694 83.0978 78.5003 79.8828 85.2929 75.98L97.6357 68.8941L97.7164 78.3153L97.7971 87.7204L102.234 90.2636L106.67 92.8068L106.719 73.2408C106.735 62.54 106.719 53.7587 106.687 53.7267C106.655 53.6947 98.9746 58.0614 89.6008 63.4358L72.5629 73.2088L55.896 63.6757C46.7317 58.4133 39.0679 54.0306 38.8743 53.9027L38.5032 53.6787V73.2768Z" fill="white" />' +
|
||||
'<path d="M47.9893 93.0937C45.6014 94.4692 43.6653 95.6209 43.6653 95.6849C43.6653 95.8288 72.449 112.24 72.6588 112.224C72.9008 112.192 101.587 95.7968 101.587 95.6849C101.587 95.6369 99.5867 94.4692 97.1508 93.0777L92.6977 90.5344L82.6782 96.2767C77.1603 99.4277 72.5781 101.987 72.5136 101.955C72.4329 101.939 67.8991 99.3637 62.4618 96.2447C57.0084 93.1256 52.4908 90.5664 52.4262 90.5824C52.3456 90.5984 50.361 91.7181 47.9893 93.0937Z" fill="white" />' +
|
||||
'<defs>' +
|
||||
'<linearGradient id="paint0_linear_150_2453" x1="2.4683" y1="6.137" x2="115.196" y2="71.48" gradientUnits="userSpaceOnUse">' +
|
||||
'<stop stop-color="#F41C1B" />' +
|
||||
'<stop offset="0.435" stop-color="#F72D2C" />' +
|
||||
'<stop offset="1" stop-color="#FA4242" />' +
|
||||
'</linearGradient>' +
|
||||
'</defs>' +
|
||||
'</svg>';
|
||||
|
||||
|
||||
var iconSize;
|
||||
var iconOffset;
|
||||
|
||||
if (window.innerWidth <= 768) {
|
||||
|
||||
iconSize = [73, 88];
|
||||
iconOffset = [-36, -87];
|
||||
} else {
|
||||
|
||||
iconSize = [146, 175];
|
||||
iconOffset = [-73, -174];
|
||||
}
|
||||
|
||||
|
||||
// Создаем метку с серой дефолтной иконкой
|
||||
var myPlacemark = new ymaps.Placemark(
|
||||
buildingCoordinates,
|
||||
{hintContent: '', balloonContent: ''},
|
||||
{
|
||||
|
||||
iconLayout: 'default#imageWithContent',
|
||||
iconImageHref: 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(svgIcon),
|
||||
iconImageSize: iconSize,
|
||||
iconImageOffset: iconOffset,
|
||||
hideIconOnBalloonOpen: false
|
||||
}
|
||||
buildingCoordinates,
|
||||
{hintContent: '', balloonContent: ''},
|
||||
{
|
||||
preset: 'islands#greyIcon'
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
// Делаем карту черно-белой
|
||||
myMap.panes.get('ground').getElement().style.filter = 'grayscale(100%)';
|
||||
|
||||
|
||||
// Добавляем метку на карту
|
||||
myMap.geoObjects.add(myPlacemark);
|
||||
|
||||
|
||||
// Логика интерактивности карты остается без изменений
|
||||
var isMapInteractive = false;
|
||||
var mapElement = document.getElementById('map');
|
||||
|
||||
function activateMap(e) {
|
||||
if (!isMapInteractive) {
|
||||
myMap.behaviors.enable(['scrollZoom', 'drag', 'multiTouch', 'dblClickZoom']);
|
||||
isMapInteractive = true;
|
||||
if (!isMapInteractive) {
|
||||
myMap.behaviors.enable(['scrollZoom', 'drag', 'multiTouch', 'dblClickZoom']);
|
||||
isMapInteractive = true;
|
||||
|
||||
setTimeout(function () {
|
||||
document.addEventListener('click', deactivateMap);
|
||||
document.addEventListener('touchend', deactivateMap);
|
||||
}, 100);
|
||||
setTimeout(function () {
|
||||
document.addEventListener('click', deactivateMap);
|
||||
document.addEventListener('touchend', deactivateMap);
|
||||
}, 100);
|
||||
|
||||
e.stopPropagation();
|
||||
}
|
||||
}
|
||||
e.stopPropagation();
|
||||
}
|
||||
}
|
||||
|
||||
function deactivateMap(e) {
|
||||
var target = e.target;
|
||||
var target = e.target;
|
||||
|
||||
if (e.type === 'touchend' || e.changedTouches || e.changedTouches[0]) {
|
||||
var touch = e.changedTouches[0];
|
||||
target = document.elementFromPoint(touch.clientX, touch.clientY);
|
||||
}
|
||||
if (e.type === 'touchend' || e.changedTouches || e.changedTouches[0]) {
|
||||
var touch = e.changedTouches[0];
|
||||
target = document.elementFromPoint(touch.clientX, touch.clientY);
|
||||
}
|
||||
|
||||
if (!mapElement.contains(target)) {
|
||||
if (!mapElement.contains(target)) {
|
||||
myMap.behaviors.disable(['scrollZoom', 'drag', 'multiTouch', 'dblClickZoom']);
|
||||
isMapInteractive = false;
|
||||
|
||||
myMap.behaviors.disable(['scrollZoom', 'drag', 'multiTouch', 'dblClickZoom']);
|
||||
isMapInteractive = false;
|
||||
|
||||
|
||||
document.removeEventListener('click', deactivateMap);
|
||||
document.removeEventListener('touchend', deactivateMap);
|
||||
}
|
||||
}
|
||||
document.removeEventListener('click', deactivateMap);
|
||||
document.removeEventListener('touchend', deactivateMap);
|
||||
}
|
||||
}
|
||||
|
||||
mapElement.addEventListener('click', activateMap);
|
||||
mapElement.addEventListener('touchstart', activateMap);
|
||||
});
|
||||
});
|
||||
@@ -25,7 +25,7 @@ if (!empty($blocks) && isset($blocks[0]['blockName']) && $blocks[0]['blockName']
|
||||
$is_first_block = true;
|
||||
}
|
||||
|
||||
$section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80px] max-[768px]:pt-[64px]";
|
||||
$section_padding = $is_first_block ? "!pt-[0]" : "!pt-[0px]";
|
||||
|
||||
?>
|
||||
|
||||
@@ -49,35 +49,54 @@ $section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80
|
||||
|
||||
<section id="<?php echo esc_attr( $id ); ?>" class="<?php echo esc_attr( $classes ); ?> <?php echo $section_padding ?>">
|
||||
<div class="w-full relative">
|
||||
<div id="map" class="w-full h-[500px] min-[1024px]:h-[700px] bg-[#f3f4f6]"></div>
|
||||
<div id="map" class="w-full h-[608px] <?php if ($is_first_block): ?>h-[828px]<?php endif; ?>"></div>
|
||||
|
||||
<div class="absolute inset-0 pointer-events-none">
|
||||
<div class="container mx-auto px-[16px] h-full flex items-start pt-[40px]">
|
||||
<div class="bg-[#ffffff] border-[1px] border-[#e5e7eb] rounded-[12px] p-[30px] w-full max-w-[380px] shadow-lg pointer-events-auto">
|
||||
<div class="container mx-auto h-full flex items-center">
|
||||
<div class="bg-[#ffffff] rounded-[24px] px-[32px] py-[30px] w-full max-w-[424px] pointer-events-auto">
|
||||
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[36px] max-[768px]:text-[28px] font-bold mb-[30px] text-[#1f2937]">
|
||||
<h2 class="text-[32px] font-bold leading-[115%]">
|
||||
<?php echo esc_html($heading); ?>
|
||||
</h2>
|
||||
<?php else : ?>
|
||||
<h2 class="text-[36px] max-[768px]:text-[28px] font-bold mb-[30px] text-[#1f2937]">Контакты</h2>
|
||||
<?php endif; ?>
|
||||
<?php
|
||||
endif; ?>
|
||||
|
||||
<div class="flex flex-col gap-[20px]">
|
||||
<div class=" mt-[24px]">
|
||||
|
||||
<?php if ($work_time) : ?>
|
||||
<div>
|
||||
<?php if (!empty($work_time['heading'])) : ?>
|
||||
<p class="text-[14px] text-[#6b7280] mb-[8px]"><?php echo esc_html($work_time['heading']); ?></p>
|
||||
|
||||
|
||||
<?php if ($address) : ?>
|
||||
<div class="flex flex-col gap-[12px]">
|
||||
<?php if (!empty($address['heading'])) : ?>
|
||||
<div class="flex gap-[12px] items-center">
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2190_3176)">
|
||||
<path d="M10.001 0.445312C5.68804 0.445312 2.17879 3.95456 2.17879 8.26265C2.15044 14.5644 9.70377 19.7897 10.001 20.0009C10.001 20.0009 17.8516 14.5644 17.8232 8.26754C17.8232 3.95456 14.314 0.445312 10.001 0.445312ZM10.001 12.1786C7.84012 12.1786 6.0899 10.4284 6.0899 8.26754C6.0899 6.10665 7.84012 4.35642 10.001 4.35642C12.1619 4.35642 13.9121 6.10665 13.9121 8.26754C13.9121 10.4284 12.1619 12.1786 10.001 12.1786Z"
|
||||
fill="#E21E24"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3176">
|
||||
<rect width="19.5556" height="19.5556" fill="white"
|
||||
transform="translate(0 0.222656)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<p class="text-[24px] font-[600] leading-[125%]"><?php echo esc_html($address['heading']); ?></p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($work_time['work_time_repeater'])) : ?>
|
||||
<div class="flex flex-col gap-[4px] mb-[12px]">
|
||||
<?php foreach ($work_time['work_time_repeater'] as $time_item) : ?>
|
||||
<div class="flex text-[16px] text-[#1f2937]">
|
||||
<span><?php echo esc_html($time_item['title']); ?></span>
|
||||
|
||||
<span><?php echo esc_html($time_item['time']); ?></span>
|
||||
<?php if (!empty($address['address_repeater'])) : ?>
|
||||
<div class="flex flex-col gap-[4px]">
|
||||
<?php foreach ($address['address_repeater'] as $addr_item) : ?>
|
||||
<div class="text-[16px] leading-[145%]">
|
||||
<?php if (!empty($addr_item['address_title'])) : ?>
|
||||
<div class="font-[600]"><?php echo esc_html($addr_item['address_title']); ?></div>
|
||||
<?php endif; ?>
|
||||
<?php if (!empty($addr_item['address_extra'])) : ?>
|
||||
<div class="text-[16px] leading-[145%] text-[#6c6b6b]"><?php echo esc_html($addr_item['address_extra']); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
@@ -85,22 +104,32 @@ $section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($address) : ?>
|
||||
<div>
|
||||
<?php if (!empty($address['heading'])) : ?>
|
||||
<p class="text-[14px] text-[#6b7280] mb-[8px]"><?php echo esc_html($address['heading']); ?></p>
|
||||
<?php if ($work_time) : ?>
|
||||
<div class="flex mt-[28px] flex-col gap-[12px]">
|
||||
<?php if (!empty($work_time['heading'])) : ?>
|
||||
<div class="flex gap-[12px] items-center">
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2190_3183)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.4796 19.63C10.9266 19.7273 10.3581 19.7782 9.77778 19.7782C4.38135 19.7782 0 15.3969 0 10.0004C0 4.60401 4.38135 0.222656 9.77778 0.222656C15.1742 0.222656 19.5556 4.60401 19.5556 10.0004C19.5556 10.5807 19.5046 11.1492 19.4073 11.7022C18.882 10.9647 18.1879 10.3636 17.3831 9.94888C16.5782 9.53418 15.6858 9.31796 14.7804 9.31826C13.273 9.31923 11.8276 9.91847 10.7617 10.9844C9.69581 12.0502 9.09657 13.4956 9.09561 15.003C9.0953 15.9085 9.31152 16.8008 9.72622 17.6057C10.1409 18.4106 10.7421 19.1046 11.4796 19.63ZM10.9147 4.99785V9.54565C10.9147 9.72666 10.8429 9.90038 10.7146 10.0277L7.07638 13.666C7.01308 13.7293 6.93792 13.7795 6.85521 13.8137C6.7725 13.848 6.68384 13.8656 6.59432 13.8656C6.50479 13.8656 6.41614 13.848 6.33342 13.8137C6.25071 13.7795 6.17555 13.7293 6.11225 13.666C6.04894 13.6027 5.99873 13.5275 5.96446 13.4448C5.9302 13.3621 5.91257 13.2734 5.91257 13.1839C5.91257 13.0944 5.9302 13.0057 5.96446 12.923C5.99873 12.8403 6.04894 12.7651 6.11225 12.7018L9.55039 9.26278V4.99785C9.55039 4.81693 9.62226 4.64341 9.75019 4.51548C9.87812 4.38755 10.0516 4.31568 10.2326 4.31568C10.4135 4.31568 10.587 4.38755 10.7149 4.51548C10.8429 4.64341 10.9147 4.81693 10.9147 4.99785Z" fill="#E21E24" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.7801 10.2266C12.1442 10.2266 10.0049 12.3658 10.0049 15.0018C10.0049 17.6377 12.1442 19.777 14.7801 19.777C17.416 19.777 19.5553 17.6377 19.5553 15.0018C19.5553 12.3658 17.416 10.2266 14.7801 10.2266ZM12.4789 15.2564L13.8432 16.6208C13.9065 16.6841 13.9816 16.7344 14.0644 16.7687C14.1471 16.803 14.2358 16.8207 14.3253 16.8207C14.4148 16.8207 14.5035 16.803 14.5862 16.7687C14.6689 16.7344 14.7441 16.6841 14.8074 16.6208L17.0813 14.3469C17.1446 14.2836 17.1948 14.2084 17.2291 14.1257C17.2633 14.043 17.2809 13.9543 17.2809 13.8648C17.2809 13.7753 17.2633 13.6866 17.2291 13.6039C17.1948 13.5212 17.1446 13.446 17.0813 13.3827C17.018 13.3194 16.9428 13.2692 16.8601 13.235C16.7774 13.2007 16.6887 13.1831 16.5992 13.1831C16.5097 13.1831 16.421 13.2007 16.3383 13.235C16.2556 13.2692 16.1804 13.3194 16.1171 13.3827L14.3253 15.1737L13.443 14.2923C13.3797 14.229 13.3046 14.1788 13.2218 14.1445C13.1391 14.1103 13.0505 14.0926 12.961 14.0926C12.8714 14.0926 12.7828 14.1103 12.7001 14.1445C12.6173 14.1788 12.5422 14.229 12.4789 14.2923C12.4156 14.3556 12.3654 14.4308 12.3311 14.5135C12.2968 14.5962 12.2792 14.6848 12.2792 14.7744C12.2792 14.8639 12.2968 14.9525 12.3311 15.0353C12.3654 15.118 12.4156 15.1931 12.4789 15.2564Z" fill="#E21E24" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3183">
|
||||
<rect width="19.5556" height="19.5556" fill="white" transform="translate(0 0.222656)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<p class="text-[24px] font-[600] leading-[125%]"><?php echo esc_html($work_time['heading']); ?></p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($address['address_repeater'])) : ?>
|
||||
<div class="flex flex-col gap-[8px] mb-[12px]">
|
||||
<?php foreach ($address['address_repeater'] as $addr_item) : ?>
|
||||
<div class="text-[16px] text-[#1f2937] leading-[140%]">
|
||||
<?php if (!empty($addr_item['address_title'])) : ?>
|
||||
<div class="font-semibold"><?php echo esc_html($addr_item['address_title']); ?></div>
|
||||
<?php endif; ?>
|
||||
<?php if (!empty($addr_item['address_extra'])) : ?>
|
||||
<div><?php echo esc_html($addr_item['address_extra']); ?></div>
|
||||
<?php endif; ?>
|
||||
<?php if (!empty($work_time['work_time_repeater'])) : ?>
|
||||
<div class="flex flex-col gap-[4px]">
|
||||
<?php foreach ($work_time['work_time_repeater'] as $time_item) : ?>
|
||||
<div class="flex text-[16px] leading-[145%] font-[600]">
|
||||
<span><?php echo esc_html($time_item['title']); ?></span>
|
||||
|
||||
<span class="font-[500]"><?php echo esc_html($time_item['time']); ?></span>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
@@ -109,18 +138,18 @@ $section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($contacts) : ?>
|
||||
<div>
|
||||
<div class="mt-[16px]">
|
||||
<?php if (!empty($contacts['phone'])) : ?>
|
||||
<div class="mb-[16px]">
|
||||
<div>
|
||||
<a href="tel:<?php echo esc_attr($contacts['phone']); ?>"
|
||||
class="!decoration-transparent hover:!decoration-inherit text-[20px] max-[768px]:text-[18px] font-semibold transition-colors">
|
||||
class="!decoration-transparent hover:!decoration-inherit text-[32px] font-[700]">
|
||||
<?php echo esc_html($contacts['phone']); ?>
|
||||
</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($contacts['social_repeater'])) : ?>
|
||||
<div>
|
||||
<div class="mt-[14px]">
|
||||
<div class="flex gap-[12px]">
|
||||
<?php foreach ($contacts['social_repeater'] as $social_item) : ?>
|
||||
<?php if (!empty($social_item['url'])) : ?>
|
||||
@@ -130,7 +159,7 @@ $section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80
|
||||
<?php if (!empty($social_item['icon'])) : ?>
|
||||
<img src="<?php echo esc_url($social_item['icon']['url']); ?>"
|
||||
alt="<?php echo esc_attr($social_item['icon']['alt']); ?>"
|
||||
class="object-contain" />
|
||||
class="object-contain w-[42px]" />
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
@@ -1,91 +1,89 @@
|
||||
|
||||
.form-block-wrapper .ff-el-group {
|
||||
margin-bottom: 24px;
|
||||
#fluentform_3 {
|
||||
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-el-input--label label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
font-weight: 600;
|
||||
color: #374151;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-el-form-control {
|
||||
width: 100%;
|
||||
padding: 12px 16px;
|
||||
border: 2px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
font-size: 16px;
|
||||
transition: all 0.2s ease;
|
||||
background: #ffffff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-el-form-control:focus {
|
||||
outline: none;
|
||||
border-color: #3b82f6;
|
||||
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-btn-submit {
|
||||
width: 100%;
|
||||
padding: 14px 24px;
|
||||
background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
|
||||
color: white;
|
||||
#fluentform_3 .ff-el-form-control {
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 32px 0 rgba(16, 15, 15, 0.03);
|
||||
background: #fff;
|
||||
border-radius: 90px;
|
||||
height: 77px;
|
||||
padding-left: 32px;
|
||||
padding-right: 32px;
|
||||
outline: 1px solid transparent;
|
||||
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 130%;
|
||||
color: #6c6b6b;
|
||||
}
|
||||
|
||||
#fluentform_3 .ff-btn-submit {
|
||||
height: 75px;
|
||||
background: linear-gradient(90deg, #e21e24 39.42%, #ff2f35 92.9%);
|
||||
border-radius: 90px;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
line-height: 195%;
|
||||
color: #f8f8f8;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
text-transform: none;
|
||||
transition: 180ms ease-in;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-btn-submit:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 8px 25px rgba(59, 130, 246, 0.3);
|
||||
#fluentform_3 .ff-btn-submit:hover {
|
||||
font-weight: 700;
|
||||
transition: 180ms ease-in;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-btn-submit:active {
|
||||
transform: translateY(0);
|
||||
#fluentform_3 .ff_submit_btn_wrapper {
|
||||
margin-bottom: 0!important;
|
||||
}
|
||||
|
||||
.form-block-wrapper .asterisk-right label::after {
|
||||
content: ' *';
|
||||
color: #ef4444;
|
||||
font-weight: bold;
|
||||
#fluentform_3 .error.text-danger {
|
||||
position: absolute;
|
||||
margin-top: 0;
|
||||
bottom: -18px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-message-success,
|
||||
.form-block-wrapper .ff-message-container {
|
||||
display: none !important;
|
||||
#fluentform_3 .ff-el-group {
|
||||
position: relative;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.form-block-wrapper.form-loading .ff-btn-submit {
|
||||
opacity: 0.7;
|
||||
#fluentform_3_success {
|
||||
display: none!important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#fluentform_3 .ff-el-input--label {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 32px;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
z-index: 2;
|
||||
margin: 0;
|
||||
transition: 180ms ease-in-out;
|
||||
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 130%;
|
||||
color: #6c6b6b;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.form-block-wrapper {
|
||||
margin: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-el-form-control {
|
||||
font-size: 16px;
|
||||
padding: 10px 14px;
|
||||
}
|
||||
|
||||
.form-block-wrapper .ff-btn-submit {
|
||||
font-size: 16px;
|
||||
padding: 12px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) and (min-width: 769px) {
|
||||
.form-block-wrapper {
|
||||
padding: 25px;
|
||||
}
|
||||
#fluentform_3 .ff-el-group.focused .ff-el-input--label,
|
||||
#fluentform_3 .ff-el-group.has-value .ff-el-input--label {
|
||||
top: 6px;
|
||||
transform: translateY(0);
|
||||
transition: 180ms ease-in-out;
|
||||
font-size: 14px;
|
||||
}
|
||||
82
template-parts/la-components/blocks/form-block/form-block.js
Normal file
82
template-parts/la-components/blocks/form-block/form-block.js
Normal file
@@ -0,0 +1,82 @@
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const inputs = document.querySelectorAll('#fluentform_3 .ff-el-form-control');
|
||||
const phoneInput = document.querySelector('#fluentform_3 .ff-el-phone');
|
||||
|
||||
inputs.forEach(input => {
|
||||
// Добавляем класс при фокусе
|
||||
input.addEventListener('focus', function() {
|
||||
this.closest('.ff-el-group').classList.add('focused');
|
||||
});
|
||||
|
||||
// Убираем класс при потере фокуса
|
||||
input.addEventListener('blur', function() {
|
||||
this.closest('.ff-el-group').classList.remove('focused');
|
||||
});
|
||||
|
||||
// Добавляем/убираем класс при вводе
|
||||
input.addEventListener('input', function() {
|
||||
const group = this.closest('.ff-el-group');
|
||||
if (this.value.trim() !== '') {
|
||||
group.classList.add('has-value');
|
||||
} else {
|
||||
group.classList.remove('has-value');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Маска для телефона +7 (___) ___-__-__
|
||||
if (phoneInput) {
|
||||
phoneInput.addEventListener('input', function(e) {
|
||||
let value = e.target.value.replace(/\D/g, ''); // Убираем все кроме цифр
|
||||
|
||||
// Если начинается с 8, заменяем на 7
|
||||
if (value.startsWith('8')) {
|
||||
value = '7' + value.slice(1);
|
||||
}
|
||||
|
||||
// Если не начинается с 7, добавляем 7
|
||||
if (!value.startsWith('7') && value.length > 0) {
|
||||
value = '7' + value;
|
||||
}
|
||||
|
||||
let formattedValue = '';
|
||||
|
||||
if (value.length > 0) {
|
||||
formattedValue = '+7';
|
||||
|
||||
if (value.length > 1) {
|
||||
formattedValue += ' (' + value.slice(1, 4);
|
||||
|
||||
if (value.length > 4) {
|
||||
formattedValue += ') ' + value.slice(4, 7);
|
||||
|
||||
if (value.length > 7) {
|
||||
formattedValue += '-' + value.slice(7, 9);
|
||||
|
||||
if (value.length > 9) {
|
||||
formattedValue += '-' + value.slice(9, 11);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
e.target.value = formattedValue;
|
||||
});
|
||||
|
||||
// Обработка клавиш для корректного удаления
|
||||
phoneInput.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Backspace' || e.key === 'Delete') {
|
||||
const cursorPos = e.target.selectionStart;
|
||||
const value = e.target.value;
|
||||
|
||||
// Если курсор на служебном символе, сдвигаем его
|
||||
if (cursorPos > 0 && [' ', '(', ')', '-'].includes(value[cursorPos - 1])) {
|
||||
setTimeout(() => {
|
||||
e.target.setSelectionRange(cursorPos - 1, cursorPos - 1);
|
||||
}, 0);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -10,24 +10,44 @@ $current_url = home_url($_SERVER['REQUEST_URI']);
|
||||
$page_title = get_the_title() ?: 'Главная страница';
|
||||
$form_name = $form_title;
|
||||
|
||||
$room = get_current_room();
|
||||
if ($room === 'gym') {
|
||||
$section_classes = 'bg-cover bg-center bg-no-repeat';
|
||||
$bg_image = get_template_directory_uri() . '/assets/images/form-bg-dark.png';
|
||||
$style_attr = 'style="background-image: url(' . esc_url($bg_image) . ')"';
|
||||
} else {
|
||||
$section_classes = 'bg-cover bg-center bg-no-repeat';
|
||||
$bg_image = get_template_directory_uri() . '/assets/images/form-bg-light.png';
|
||||
$style_attr = 'style="background-image: url(' . esc_url($bg_image) . ')"';
|
||||
}
|
||||
|
||||
$hidden_value = "Форма: {$form_name} | Страница: {$page_title} | URL: {$current_url}";
|
||||
?>
|
||||
|
||||
<section class="container mx-auto mt-[22px]" id="<?php echo esc_attr($unique_id); ?>">
|
||||
<div class="text-[24px] font-[700] mb-[20px] text-[#374151]">
|
||||
<?php echo esc_html($form_title); ?>
|
||||
</div>
|
||||
<section class="mt-[22px] bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)] bg-cover" id="<?php echo esc_attr($unique_id); ?> "
|
||||
<?php echo $style_attr; ?>
|
||||
>
|
||||
|
||||
<div class="form-block-wrapper bg-white p-[30px] rounded-[12px] max-w-[300px]"
|
||||
data-form-id="<?php echo esc_attr($form_id); ?>"
|
||||
data-submit-text="<?php echo esc_attr($submit_button_text); ?>"
|
||||
data-hidden-value="<?php echo esc_attr($hidden_value); ?>">
|
||||
<?php echo do_shortcode('[fluentform id="' . esc_attr($form_id) . '"]'); ?>
|
||||
<div class="container mx-auto py-[48px] flex relative">
|
||||
<img class="absolute right-0 bottom-0 pointer-events-none z-0" src="<?php echo esc_url(get_template_directory_uri() . '/assets/images/form-image-trainer.png'); ?>" alt="Изображение тренера">
|
||||
<div class="form-block-wrapper relative z-[1] border border-[2px] border-[#fff] p-[48px] bg-[#f8f8f8] rounded-[32px] w-full max-w-[590px]"
|
||||
data-form-id="<?php echo esc_attr($form_id); ?>"
|
||||
data-submit-text="<?php echo esc_attr($submit_button_text); ?>"
|
||||
data-hidden-value="<?php echo esc_attr($hidden_value); ?>">
|
||||
<h3 class="font-[500] text-[40px] leading-[120%] text-[#222]">Пробная <strong class="font-[700]">персональная
|
||||
тренировка</strong>
|
||||
<span class="bg-[linear-gradient(90deg,_#9d9994_39.42%,_#ccc9c4_92.9%)] rounded-[32px] h-[43px] inline-flex items-center pr-[16px] pl-[16px] font-[600] text-[32px] leading-[115%] text-[#fff]">за 1200 ₽</span>
|
||||
</h3>
|
||||
<p class="mt-[16px] mb-[24px] font-[500] text-[20px] leading-[140%] text-[#222]">Познакомимся, покажем зал и
|
||||
<strong class="font-[600]">подберём
|
||||
оптимальные для вас тренировки!</strong></p>
|
||||
<?php echo do_shortcode('[fluentform id="' . esc_attr($form_id) . '"]'); ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const section = document.getElementById('<?php echo esc_js($unique_id); ?>');
|
||||
if (!section) return;
|
||||
|
||||
@@ -68,6 +88,6 @@ $hidden_value = "Форма: {$form_name} | Страница: {$page_title} | UR
|
||||
}, 150);
|
||||
}
|
||||
|
||||
block.addEventListener('focusin', updateForm, { once: true });
|
||||
block.addEventListener('focusin', updateForm, {once: true});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,55 @@
|
||||
.gallery-block .thumbnail {
|
||||
opacity: 0.5;
|
||||
transition: 180ms ease-in-out;
|
||||
|
||||
}
|
||||
|
||||
.gallery-block .thumbnail.active {
|
||||
opacity: 1;
|
||||
transition: 180ms ease-in-out;
|
||||
}
|
||||
|
||||
.gallery-block .tab-button {
|
||||
box-shadow: 0 2px 32px 0 rgba(16, 15, 15, 0.03);
|
||||
background: #fff;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
line-height: 195%;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.gallery-block .tab-button.active {
|
||||
font-size: 18px;
|
||||
line-height: 195%;
|
||||
color: #f8f8f8;
|
||||
box-shadow: none;
|
||||
background: linear-gradient(90deg, #9d9994 39.42%, #ccc9c4 92.9%);
|
||||
}
|
||||
.dark .gallery-block .tab-button.active {
|
||||
background: linear-gradient(90deg, #2b2c35 39.42%, #6e7996 92.9%);
|
||||
color: #f8f8f8;
|
||||
}
|
||||
|
||||
|
||||
.gallery-block .swiper-slide img {
|
||||
transition: opacity 180ms ease-in-out;
|
||||
}
|
||||
|
||||
.gallery-block .swiper-slide img[loading="lazy"] {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.gallery-block .swiper-slide img[loading="lazy"].loaded,
|
||||
.gallery-block .swiper-slide img:not([loading="lazy"]) {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.gallery-block .thumbnail:not(.active) {
|
||||
opacity: 0.6;
|
||||
transition: opacity 180ms ease-in-out;
|
||||
}
|
||||
|
||||
.gallery-block .thumbnail.active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
document.querySelectorAll('.gallery-block').forEach(function(block) {
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
document.querySelectorAll('.gallery-block').forEach(function (block) {
|
||||
const blockId = block.getAttribute('data-gallery-id');
|
||||
initGalleryBlock(blockId);
|
||||
});
|
||||
@@ -10,99 +10,126 @@ function initGalleryBlock(blockId) {
|
||||
if (!container) return;
|
||||
|
||||
const swipers = {};
|
||||
const thumbnailSwipers = {};
|
||||
const initializedTabs = new Set();
|
||||
let lightbox;
|
||||
|
||||
function initAllSwipers() {
|
||||
const tabs = container.querySelectorAll('.tab-button');
|
||||
function initTabSwiper(tabId) {
|
||||
if (initializedTabs.has(tabId)) return;
|
||||
|
||||
tabs.forEach(button => {
|
||||
const tabId = button.getAttribute('data-tab');
|
||||
const tabContent = container.querySelector(`#tab-${tabId}`);
|
||||
const tabContent = container.querySelector(`#tab-${tabId}`);
|
||||
if (!tabContent?.querySelector('.gallery-swiper')) return;
|
||||
|
||||
if (tabContent && tabContent.querySelector('.swiper')) {
|
||||
const wasHidden = tabContent.classList.contains('hidden');
|
||||
if (wasHidden) {
|
||||
tabContent.style.visibility = 'hidden';
|
||||
tabContent.style.position = 'absolute';
|
||||
tabContent.classList.remove('hidden');
|
||||
tabContent.classList.add('block');
|
||||
}
|
||||
thumbnailSwipers[tabId] = new Swiper(`#${blockId} #thumbnail-swiper-${tabId}`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 24,
|
||||
freeMode: true,
|
||||
grabCursor: true,
|
||||
watchSlidesProgress: true,
|
||||
});
|
||||
|
||||
if (swipers[tabId]) {
|
||||
swipers[tabId].destroy(true, true);
|
||||
}
|
||||
|
||||
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
|
||||
slidesPerView: 1.5,
|
||||
spaceBetween: 20,
|
||||
loop: true,
|
||||
centeredSlides: true,
|
||||
grabCursor: true,
|
||||
observer: true,
|
||||
observeParents: true,
|
||||
watchSlidesProgress: true,
|
||||
navigation: {
|
||||
nextEl: `#${blockId} #swiper-${tabId} .swiper-button-next`,
|
||||
prevEl: `#${blockId} #swiper-${tabId} .swiper-button-prev`,
|
||||
},
|
||||
on: {
|
||||
slideChange: function() {
|
||||
updateThumbnails(tabId, this.realIndex);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (wasHidden) {
|
||||
tabContent.style.visibility = '';
|
||||
tabContent.style.position = '';
|
||||
tabContent.classList.add('hidden');
|
||||
tabContent.classList.remove('block');
|
||||
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 24,
|
||||
centeredSlides: true,
|
||||
initialSlide: 1,
|
||||
scrollbar: {
|
||||
el: `#swiper-scrollbar-${tabId}`,
|
||||
draggable: true,
|
||||
},
|
||||
grabCursor: true,
|
||||
watchSlidesProgress: true,
|
||||
lazy: {
|
||||
loadPrevNext: true,
|
||||
loadOnTransitionStart: true,
|
||||
},
|
||||
on: {
|
||||
slideChange: function () {
|
||||
updateThumbnails(tabId, this.realIndex);
|
||||
centerThumbnail(tabId, this.realIndex);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
initializedTabs.add(tabId);
|
||||
}
|
||||
|
||||
function initLightbox(tabId) {
|
||||
if (lightbox) {
|
||||
lightbox.destroy();
|
||||
}
|
||||
const currentSelector = `#${blockId} #tab-${tabId} .glightbox`;
|
||||
|
||||
lightbox = GLightbox({
|
||||
selector: `#${blockId} #tab-${tabId} .glightbox`
|
||||
});
|
||||
if (lightbox?.settings?.selector !== currentSelector) {
|
||||
if (lightbox) {
|
||||
lightbox.destroy();
|
||||
}
|
||||
|
||||
lightbox = GLightbox({
|
||||
selector: currentSelector,
|
||||
preload: false,
|
||||
touchNavigation: true,
|
||||
loop: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function updateThumbnails(tabId, activeIndex) {
|
||||
const thumbnails = container.querySelectorAll(`#tab-${tabId} .thumbnail`);
|
||||
thumbnails.forEach((thumb, index) => {
|
||||
if (index === activeIndex) {
|
||||
thumb.classList.add('active', '!border-blue-500');
|
||||
thumb.classList.remove('border-transparent');
|
||||
thumb.classList.remove('opacity-50', 'hover:opacity-80');
|
||||
thumb.classList.add('opacity-100', 'active');
|
||||
} else {
|
||||
thumb.classList.remove('active', '!border-blue-500');
|
||||
thumb.classList.add('border-transparent');
|
||||
thumb.classList.remove('opacity-100', 'active');
|
||||
thumb.classList.add('opacity-50', 'hover:opacity-80');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
initAllSwipers();
|
||||
function centerThumbnail(tabId, activeIndex) {
|
||||
if (thumbnailSwipers[tabId]) {
|
||||
thumbnailSwipers[tabId].slideTo(activeIndex);
|
||||
}
|
||||
}
|
||||
|
||||
function preloadHeroImage() {
|
||||
const activeTab = container.querySelector('.tab-button.active');
|
||||
if (!activeTab) return;
|
||||
|
||||
const tabId = activeTab.getAttribute('data-tab');
|
||||
const firstImage = container.querySelector(`#tab-${tabId} .swiper-slide:first-child img`);
|
||||
|
||||
if (firstImage && firstImage.src) {
|
||||
const link = document.createElement('link');
|
||||
link.rel = 'preload';
|
||||
link.as = 'image';
|
||||
link.href = firstImage.src;
|
||||
document.head.appendChild(link);
|
||||
}
|
||||
}
|
||||
|
||||
function debounce(func, wait) {
|
||||
let timeout;
|
||||
return (...args) => {
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(() => func.apply(this, args), wait);
|
||||
};
|
||||
}
|
||||
|
||||
preloadHeroImage();
|
||||
|
||||
const activeTab = container.querySelector('.tab-button.active');
|
||||
if (activeTab) {
|
||||
const tabId = activeTab.getAttribute('data-tab');
|
||||
initTabSwiper(tabId);
|
||||
initLightbox(tabId);
|
||||
}
|
||||
|
||||
container.querySelectorAll('.tab-button').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
button.addEventListener('click', debounce(() => {
|
||||
const tabId = button.getAttribute('data-tab');
|
||||
|
||||
container.querySelectorAll('.tab-button').forEach(btn => {
|
||||
btn.classList.remove('active', 'underline');
|
||||
btn.classList.add('bg-gray-100');
|
||||
});
|
||||
button.classList.add('active', 'underline');
|
||||
button.classList.remove('bg-gray-100');
|
||||
container.querySelectorAll('.tab-button').forEach(btn =>
|
||||
btn.classList.remove('active'));
|
||||
button.classList.add('active');
|
||||
|
||||
container.querySelectorAll('.tab-content').forEach(content => {
|
||||
content.classList.remove('block');
|
||||
@@ -113,28 +140,41 @@ function initGalleryBlock(blockId) {
|
||||
targetTab.classList.remove('hidden');
|
||||
targetTab.classList.add('block');
|
||||
|
||||
if (swipers[tabId]) {
|
||||
requestAnimationFrame(() => {
|
||||
initTabSwiper(tabId);
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
if (swipers[tabId]) {
|
||||
swipers[tabId].update();
|
||||
});
|
||||
}
|
||||
}
|
||||
if (thumbnailSwipers[tabId]) {
|
||||
thumbnailSwipers[tabId].update();
|
||||
}
|
||||
});
|
||||
|
||||
initLightbox(tabId);
|
||||
});
|
||||
|
||||
}, 100));
|
||||
});
|
||||
|
||||
container.addEventListener('click', (e) => {
|
||||
if (e.target.closest('.thumbnail')) {
|
||||
const thumbnail = e.target.closest('.thumbnail');
|
||||
const index = parseInt(thumbnail.getAttribute('data-index'));
|
||||
const activeTab = container.querySelector('.tab-content.block');
|
||||
const tabId = activeTab.id.replace('tab-', '');
|
||||
const thumbnail = e.target.closest('.thumbnail');
|
||||
if (!thumbnail) return;
|
||||
|
||||
if (swipers[tabId]) {
|
||||
swipers[tabId].slideToLoop(index);
|
||||
}
|
||||
const index = parseInt(thumbnail.getAttribute('data-index'));
|
||||
const activeTabContent = container.querySelector('.tab-content.block');
|
||||
const tabId = activeTabContent.id.replace('tab-', '');
|
||||
|
||||
updateThumbnails(tabId, index);
|
||||
if (swipers[tabId]) {
|
||||
swipers[tabId].slideTo(index);
|
||||
}
|
||||
|
||||
updateThumbnails(tabId, index);
|
||||
centerThumbnail(tabId, index);
|
||||
});
|
||||
|
||||
window.addEventListener('beforeunload', () => {
|
||||
Object.values(swipers).forEach(swiper => swiper?.destroy());
|
||||
Object.values(thumbnailSwipers).forEach(swiper => swiper?.destroy());
|
||||
if (lightbox) lightbox.destroy();
|
||||
});
|
||||
}
|
||||
@@ -1,85 +1,124 @@
|
||||
<?php
|
||||
|
||||
$id = 'gallery-tabs-' . $block['id'];
|
||||
if ( ! empty($block['anchor'] ) ) {
|
||||
if (!empty($block['anchor'])) {
|
||||
$id = $block['anchor'];
|
||||
}
|
||||
|
||||
$classes = 'block-gallery-tabs';
|
||||
if ( ! empty( $block['className'] ) ) {
|
||||
if (!empty($block['className'])) {
|
||||
$classes .= ' ' . $block['className'];
|
||||
}
|
||||
if ( ! empty( $block['align'] ) ) {
|
||||
if (!empty($block['align'])) {
|
||||
$classes .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
$use_homepage_content = get_field('use_homepage_content');
|
||||
|
||||
if ($use_homepage_content) {
|
||||
$homepage_id = get_option('page_on_front');
|
||||
|
||||
if ($homepage_id) {
|
||||
$page_content = get_post_field('post_content', $homepage_id);
|
||||
$blocks = parse_blocks($page_content);
|
||||
|
||||
foreach ($blocks as $homepage_block) {
|
||||
if ($homepage_block['blockName'] === 'acf/gallery-tabs') {
|
||||
echo render_block($homepage_block);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Если переключатель выключен или блок на главной не найден - рендерим локальные данные
|
||||
$heading = get_field('heading');
|
||||
$slider_tabs = get_field('slider_tabs');
|
||||
|
||||
?>
|
||||
|
||||
<div class="gallery-block mt-[24px]"
|
||||
id="<?php echo esc_attr( $id ); ?>"
|
||||
data-gallery-id="<?php echo esc_attr( $id ); ?>">
|
||||
<div class="gallery-block py-[45px] pb-[90px] <?php if (!is_front_page()): echo 'pb-0 py-[90px] mt-0'; endif ?>"
|
||||
id="<?php echo esc_attr($id); ?>"
|
||||
data-gallery-id="<?php echo esc_attr($id); ?>">
|
||||
|
||||
<div class="container mx-auto">
|
||||
<div class="flex justify-between flex-wrap">
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[48px] font-[700] leading-[110%]"><?php echo esc_html($heading); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[32px] font-bold"><?php echo esc_html($heading); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
||||
<div class="flex gap-[10px] mt-[24px]">
|
||||
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
||||
<?php if (!empty($tab['tab_name'])) : ?>
|
||||
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active underline' : ''; ?>"
|
||||
data-tab="<?php echo $tab_index; ?>">
|
||||
<?php echo esc_html($tab['tab_name']); ?>
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
||||
<div class="flex max-w-[872px] flex-wrap gap-[8px]">
|
||||
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
||||
<?php if (!empty($tab['tab_name'])) : ?>
|
||||
<button class="tab-button grey-gradient-button rounded-[90px] py-[8px] px-[28px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active' : ''; ?>"
|
||||
data-tab="<?php echo $tab_index; ?>">
|
||||
<?php echo esc_html($tab['tab_name']); ?>
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
||||
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
||||
<div class="tab-content <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
|
||||
<div class="tab-content relative <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
|
||||
id="tab-<?php echo $tab_index; ?>">
|
||||
|
||||
<?php if (!empty($tab['slider_images'])) : ?>
|
||||
<div class="swiper mt-[24px] gallery-swiper h-[440px]" id="swiper-<?php echo $tab_index; ?>">
|
||||
|
||||
<div class="swiper max-w-[2000px] mt-[45px] gallery-swiper h-[440px]"
|
||||
id="swiper-<?php echo $tab_index; ?>">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($tab['slider_images'] as $image) : ?>
|
||||
<div class="swiper-slide cursor-pointer min-h-[440px]">
|
||||
<?php foreach ($tab['slider_images'] as $img_index => $image) : ?>
|
||||
<div class="swiper-slide max-w-[648px] cursor-pointer min-h-[440px]">
|
||||
<a href="<?php echo esc_url($image['url']); ?>"
|
||||
class="glightbox block w-full h-full"
|
||||
data-gallery="gallery-<?php echo $tab_index; ?>">
|
||||
<img src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover">
|
||||
<?php if ($img_index === 0) : ?>
|
||||
<img src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover rounded-[24px]"
|
||||
width="<?php echo esc_attr($image['width']); ?>"
|
||||
height="<?php echo esc_attr($image['height']); ?>"
|
||||
fetchpriority="high">
|
||||
<?php else : ?>
|
||||
<img data-src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover rounded-[24px] swiper-lazy"
|
||||
width="<?php echo esc_attr($image['width']); ?>"
|
||||
height="<?php echo esc_attr($image['height']); ?>">
|
||||
<div class="swiper-lazy-preloader"></div>
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="swiper-button-next"></div>
|
||||
<div class="swiper-button-prev"></div>
|
||||
</div>
|
||||
|
||||
<div class="flex mt-[24px] gap-[8px] overflow-x-auto">
|
||||
<?php foreach ($tab['slider_images'] as $thumb_index => $image) : ?>
|
||||
<div class="thumbnail flex-shrink-0 w-[80px] h-[60px] rounded-[5px] overflow-hidden cursor-pointer border-2 border-transparent <?php echo $thumb_index === 0 ? 'active !border-blue-500' : ''; ?>"
|
||||
data-index="<?php echo $thumb_index; ?>">
|
||||
<img src="<?php echo esc_url($image['sizes']['thumbnail']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover">
|
||||
<div class="relative mt-[24px]">
|
||||
<div class="swiper thumbnail-swiper"
|
||||
id="thumbnail-swiper-<?php echo $tab_index; ?>">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($tab['slider_images'] as $thumb_index => $image) : ?>
|
||||
<div class="swiper-slide max-w-[160px] !h-[100px]">
|
||||
<div class="thumbnail w-full h-full overflow-hidden cursor-pointer transition-opacity duration-[180ms] ease-in-out <?php echo $thumb_index === 0 ? 'active opacity-100' : 'opacity-50 hover:opacity-80'; ?>"
|
||||
data-index="<?php echo $thumb_index; ?>">
|
||||
<img src="<?php echo esc_url($image['sizes']['thumbnail']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full rounded-[12px] h-full object-cover"
|
||||
width="160"
|
||||
height="100">
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if (!empty($image['caption'])) : ?>
|
||||
<p><?php echo esc_html($image['caption']); ?></p>
|
||||
<?php endif; ?>
|
||||
<?php endif; ?>
|
||||
<div class="swiper-scrollbar !static !mx-auto !cursor-grab container mt-[44px] !w-full !p-0" id="swiper-scrollbar-<?php echo $tab_index; ?>"></div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
@@ -8,7 +8,6 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
const swiper = new Swiper(swiperContainer, {
|
||||
slidesPerView: 1,
|
||||
loop: true,
|
||||
grabCursor: true,
|
||||
on: {
|
||||
slideChange: function () {
|
||||
|
||||
File diff suppressed because one or more lines are too long
108
template-parts/la-components/blocks/line-block/line-block.php
Normal file
108
template-parts/la-components/blocks/line-block/line-block.php
Normal file
File diff suppressed because one or more lines are too long
@@ -0,0 +1,192 @@
|
||||
<?php
|
||||
|
||||
$id = 'masonry-tiles-block-' . $block['id'];
|
||||
if (!empty($block['anchor'])) {
|
||||
$id = $block['anchor'];
|
||||
}
|
||||
|
||||
$classes = 'block-masonry-tiles-block';
|
||||
if (!empty($block['className'])) {
|
||||
$classes .= ' ' . $block['className'];
|
||||
}
|
||||
if (!empty($block['align'])) {
|
||||
$classes .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<section id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($classes); ?>">
|
||||
<div class="container mx-auto py-[90px]">
|
||||
|
||||
<?php if (get_field('heading')) : ?>
|
||||
<h2 class="text-[48px] font-[500] text-[#1f2937] mb-[40px]">
|
||||
<?php echo get_field('heading'); ?>
|
||||
</h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (have_rows('tiles_group')) : ?>
|
||||
<?php while (have_rows('tiles_group')) :
|
||||
the_row(); ?>
|
||||
|
||||
<div class="grid grid-cols-3 gap-[24px]">
|
||||
|
||||
<!-- Первая колонка: First Tile -->
|
||||
<div>
|
||||
<?php if (have_rows('first_tile')) : ?>
|
||||
<?php while (have_rows('first_tile')) :
|
||||
the_row(); ?>
|
||||
<div class="relative h-[512px] rounded-[12px] p-[24px] overflow-hidden"
|
||||
<?php
|
||||
$image = get_sub_field('image');
|
||||
if ($image) : ?>
|
||||
style="background-image: url('<?php echo esc_url($image['url']); ?>'); background-size: cover; background-position: center;"
|
||||
<?php endif; ?>>
|
||||
|
||||
<!-- Градиент оверлей -->
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent"></div>
|
||||
|
||||
<div class="relative flex flex-col gap-[12px] h-full justify-end z-10">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="text-[32px] font-[600] leading-[115%] text-[#f8f8f8]"><?php echo esc_html(get_sub_field('heading')); ?></h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="text-[16px] font-[500] leading-[145%] text-[#e0e0e0]"><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<!-- Вторая колонка: Second и Third Tiles -->
|
||||
<div class="flex flex-col gap-[24px]">
|
||||
<!-- Second Tile -->
|
||||
<?php if (have_rows('second_tile')) : ?>
|
||||
<?php while (have_rows('second_tile')) :
|
||||
the_row(); ?>
|
||||
<div class="h-[244px] relative border border-[#e0e0e0] dark:border-transparent bg-transparent dark:bg-white rounded-[12px] p-[24px] overflow-hidden">
|
||||
<?php
|
||||
if (get_current_room() === 'fitness') {
|
||||
?>
|
||||
<div class="absolute right-[24px] top-[24px]">
|
||||
<img alt="decoration"
|
||||
src="<?php echo get_template_directory_uri() . '/assets/images/masonry-decor.png'; ?>">
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="flex flex-col h-full justify-end">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[600] text-[62px] dark:text-[42px] leading-[115%]">
|
||||
<span class="bg-[linear-gradient(90deg,#2b2c35_67.31%,#4f5870_92.9%)] bg-clip-text text-transparent">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</span>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class="text-[20px] leading-[140%] text-[#222]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="mt-[12px] text-[16px] leading-[145%] text-[#6c6b6b]"
|
||||
><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Third Tile -->
|
||||
<?php if (have_rows('third_tile')) : ?>
|
||||
<?php while (have_rows('third_tile')) : the_row(); ?>
|
||||
<div class="h-[244px] rounded-[12px] p-[24px] overflow-hidden"
|
||||
<?php
|
||||
$bg = get_sub_field('bg');
|
||||
if ($bg) : ?>
|
||||
style="background-image: url('<?php echo esc_url($bg['url']); ?>'); background-size: cover; background-position: center;"
|
||||
<?php endif; ?>>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<!-- Третья колонка: Fourth и Fifth Tiles -->
|
||||
<div class="flex flex-col gap-[24px]">
|
||||
<!-- Fourth Tile -->
|
||||
<?php if (have_rows('fourth_tile')) : ?>
|
||||
<?php while (have_rows('fourth_tile')) :
|
||||
the_row(); ?>
|
||||
<div class="h-[244px] relative rounded-[12px] p-[24px] overflow-hidden dark:bg-[linear-gradient(90deg,_#2b2c35_53.4%,_#4f5870_100%)] bg-[linear-gradient(90deg,_#9d9994_39.42%,_#bbb7b1_92.9%)]">
|
||||
<div class="absolute right-[24px] top-[24px]">
|
||||
<svg width="87" height="50" viewBox="0 0 87 50" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4015_3641)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M87.0003 0C70.954 39.9255 36.1536 18.6568 8.89355 28.3583C16.8203 5.97016 31.127 1.86568 47.1737 1.67911C59.1603 1.49254 75.9806 2.79851 87.0003 0Z"
|
||||
fill="#F8F8F8"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M59.7404 28.918C47.367 59.5149 20.8802 42.5372 0 50.0001C10.8269 19.403 35.5736 35.0747 59.7404 28.918Z"
|
||||
fill="#F8F8F8"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4015_3641">
|
||||
<rect width="87" height="50" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="flex h-full justify-end flex-col text-[#f8f8f8]">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="text-[42px] leading-[115%]"><?php echo esc_html(get_sub_field('heading')); ?></h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class=" text-[20px] leading-[140%]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="mt-[12px] text-[16px] leading-[145%] text-[#e0e0e0]">
|
||||
<?php echo wp_kses_post(get_sub_field('text')); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Fifth Tile -->
|
||||
<?php if (have_rows('fifth_tile')) : ?>
|
||||
<?php while (have_rows('fifth_tile')) : the_row(); ?>
|
||||
<div class="h-[244px] border border-[#e0e0e0] dark:border-transparent bg-transparent dark:bg-white rounded-[12px] p-[24px] overflow-hidden">
|
||||
<div class="flex flex-col h-full justify-end">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[600] text-[42px] leading-[115%]">
|
||||
<span class="bg-[linear-gradient(90deg,#2b2c35_67.31%,#4f5870_92.9%)] bg-clip-text text-transparent">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</span>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class="text-[20px] leading-[140%] text-[#222]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="mt-[12px] text-[16px] leading-[145%] text-[#6c6b6b]"
|
||||
"><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,210 @@
|
||||
<?php
|
||||
|
||||
$id = 'masonry-tiles-block-' . $block['id'];
|
||||
if (!empty($block['anchor'])) {
|
||||
$id = $block['anchor'];
|
||||
}
|
||||
|
||||
$classes = 'block-masonry-tiles-block';
|
||||
if (!empty($block['className'])) {
|
||||
$classes .= ' ' . $block['className'];
|
||||
}
|
||||
if (!empty($block['align'])) {
|
||||
$classes .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<section id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($classes); ?>">
|
||||
<div class="container mx-auto py-[90px]">
|
||||
|
||||
<?php if (get_field('heading')) : ?>
|
||||
<h2 class="text-[48px] font-[500] text-[#1f2937] mb-[40px]">
|
||||
<?php echo get_field('heading'); ?>
|
||||
</h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (have_rows('tiles_group')) : ?>
|
||||
<?php while (have_rows('tiles_group')) :
|
||||
the_row(); ?>
|
||||
|
||||
<div class="flex gap-[24px]">
|
||||
|
||||
<!-- Первая колонка -->
|
||||
<div class="flex flex-col gap-[24px] w-full max-w-[424px]">
|
||||
|
||||
<!-- First Tile - Текстовый блок -->
|
||||
<?php if (have_rows('first_tile')) : ?>
|
||||
<?php while (have_rows('first_tile')) : the_row(); ?>
|
||||
<div class="<?php echo is_front_page() ? 'h-[298px]' : 'h-[383px]'; ?> pt-[24px] overflow-hidden">
|
||||
<div class="flex <?php echo is_front_page() ? 'flex-col justify-start' : 'flex-col-reverse justify-end'; ?> gap-[16px] h-full [&_img]:w-[294px]">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<?php display_icon(get_current_room() === 'gym' ? 'dark_logo_name_gym' : 'light_logo_name'); ?>
|
||||
<h3 class="text-[32px] font-[500] text-[#222] leading-[115%]">
|
||||
<span>
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</span>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Second Tile - Блок с картинкой -->
|
||||
<?php if (have_rows('second_tile')) : ?>
|
||||
<?php while (have_rows('second_tile')) : the_row(); ?>
|
||||
|
||||
<div class="relative <?php echo is_front_page() ? 'h-[298px]' : 'h-[383px]'; ?> rounded-[12px] p-[24px] overflow-hidden bg-[linear-gradient(90deg,_#9d9994_39.42%,_#ccc9c4_92.9%)] dark:bg-[linear-gradient(90deg,_#2b2c35_53.4%,_#4f5870_100%)]
|
||||
">
|
||||
<?php $background = get_sub_field('background'); ?>
|
||||
<?php if ($background) : ?>
|
||||
<img class="absolute right-0 top-0 w-full h-full" alt="Фон блока"
|
||||
src="<?php echo esc_url($background['url']); ?>">
|
||||
<?php else :{
|
||||
?>
|
||||
<div class="absolute flex justify-end dark:bg-[linear-gradient(90deg,_#2b2c35_53.4%,_#4f5870_100%)] bg-[linear-gradient(90deg,_#9d9994_39.42%,_#ccc9c4_92.9%)] right-0 top-0 w-full h-full">
|
||||
<svg width="169" height="136" viewBox="0 0 169 136" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.2" clip-path="url(#clip0_2281_7020)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M293 -31C238.959 102.351 121.758 31.3136 29.9512 63.7166C56.6471 -11.0597 104.829 -24.7686 158.872 -25.3918C199.24 -26.0149 255.888 -21.653 293 -31Z"
|
||||
fill="#F9F9F9"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M201.195 65.5859C159.523 167.78 70.3205 111.074 0 136C36.463 33.806 119.805 86.1494 201.195 65.5859Z"
|
||||
fill="#F9F9F9"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2281_7020">
|
||||
<rect width="293" height="167" fill="white"
|
||||
transform="translate(0 -31)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
<?php
|
||||
} ?>
|
||||
|
||||
<?php endif; ?>
|
||||
<div class="relative flex flex-col <?php echo is_front_page() ? 'justify-start' : 'justify-end'; ?> h-full z-10">
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[600] text-[42px] text-[#fff] leading-[115%]">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class="text-[24px] font-[700] leading-[140%] text-[#fff]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="<?php echo is_front_page() ? 'max-w-[245px]' : 'max-w-full'; ?> w-full text-[20px] font-[600] leading-[115%] text-[#fff] mt-[24px]">
|
||||
<?php echo wp_kses_post(get_sub_field('text')); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Вторая колонка -->
|
||||
<div class="flex flex-col gap-[24px] w-full max-w-[872px]">
|
||||
|
||||
<!-- Два обычных блока сверху -->
|
||||
<div class="grid grid-cols-2 gap-[24px]">
|
||||
|
||||
<!-- Third Tile -->
|
||||
<?php if (have_rows('third_tile')) : ?>
|
||||
<?php while (have_rows('third_tile')) : the_row(); ?>
|
||||
<div class="relative <?php echo is_front_page() ? 'h-[298px]' : 'h-[383px]'; ?> rounded-[12px] p-[24px] overflow-hidden"
|
||||
<?php
|
||||
$background = get_sub_field('background');
|
||||
if ($background) : ?>
|
||||
style="background-image: url('<?php echo esc_url($background['url']); ?>'); background-size: cover; background-position: center;"
|
||||
<?php endif; ?>>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent"></div>
|
||||
<div class="relative flex flex-col h-full justify-end z-10">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[700] text-[24px] text-[#fff] leading-[125%]">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="text-[20px] font-[600] leading-[115%] text-[#fff] mt-[24px] w-full <?php echo is_front_page() ? 'max-w-[330px]' : 'max-w-full' ?>"><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Fourth Tile -->
|
||||
<?php if (have_rows('fourth_tile')) : ?>
|
||||
<?php while (have_rows('fourth_tile')) : the_row(); ?>
|
||||
<div class="relative <?php echo is_front_page() ? 'h-[298px]' : 'h-[383px]'; ?> rounded-[12px] p-[24px] overflow-hidden"
|
||||
<?php
|
||||
$background = get_sub_field('background');
|
||||
if ($background) : ?>
|
||||
style="background-image: url('<?php echo esc_url($background['url']); ?>'); background-size: cover; background-position: center;"
|
||||
<?php endif; ?>>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent"></div>
|
||||
<div class="relative flex flex-col h-full justify-end z-10">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[700] text-[24px] text-[#fff] leading-[125%]">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class="text-[24px] font-[700] leading-[140%] text-[#fff]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="text-[20px] font-[600] leading-[115%] text-[#fff] mt-[24px] w-full <?php echo is_front_page() ? 'max-w-[330px]' : 'max-w-full' ?>"><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Fifth Tile - Широкий блок снизу -->
|
||||
<?php if (have_rows('fifth_tile')) : ?>
|
||||
<?php while (have_rows('fifth_tile')) : the_row(); ?>
|
||||
<div class="relative <?php echo is_front_page() ? 'h-[298px]' : 'h-[383px]'; ?> rounded-[12px] p-[24px] overflow-hidden"
|
||||
<?php
|
||||
$background = get_sub_field('background');
|
||||
if ($background) : ?>
|
||||
style="background-image: url('<?php echo esc_url($background['url']); ?>'); background-size: cover; background-position: center;"
|
||||
<?php endif; ?>>
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent"></div>
|
||||
|
||||
<div class="relative flex flex-col h-full justify-end z-10">
|
||||
<?php if (get_sub_field('heading')) : ?>
|
||||
<h3 class="font-[600] text-[42px] text-[#fff] leading-[115%]">
|
||||
<?php echo esc_html(get_sub_field('heading')); ?>
|
||||
</h3>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (get_sub_field('underheading')) : ?>
|
||||
<p class="text-[24px] font-[700] leading-[140%] text-[#fff]"><?php echo esc_html(get_sub_field('underheading')); ?></p>
|
||||
<?php endif; ?>
|
||||
<?php if (get_sub_field('text')) : ?>
|
||||
<div class="text-[20px] font-[600] leading-[115%] text-[#fff] mt-[24px] w-full <?php echo is_front_page() ? 'max-w-[330px]' : 'max-w-[400px]' ?>"><?php echo wp_kses_post(get_sub_field('text')); ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,23 @@
|
||||
|
||||
.reviews-block .tab-button {
|
||||
box-shadow: 0 2px 32px 0 rgba(16, 15, 15, 0.03);
|
||||
background: #fff;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
line-height: 195%;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.reviews-block .tab-button.active {
|
||||
font-size: 18px;
|
||||
line-height: 195%;
|
||||
color: #f8f8f8;
|
||||
box-shadow: none;
|
||||
background: linear-gradient(90deg, #9d9994 39.42%, #ccc9c4 92.9%);
|
||||
}
|
||||
|
||||
.dark .reviews-block .tab-button.active {
|
||||
background: linear-gradient(90deg, #2b2c35 39.42%, #6e7996 92.9%);
|
||||
color: #f8f8f8;
|
||||
}
|
||||
|
||||
@@ -13,102 +13,139 @@ function initReviewsBlock(blockId) {
|
||||
let lightbox;
|
||||
|
||||
function initAllSwipers() {
|
||||
const tabs = container.querySelectorAll('.tab-button');
|
||||
container.querySelectorAll('.reviews-swiper').forEach(swiperEl => {
|
||||
const tabId = swiperEl.id.replace('swiper-', '');
|
||||
|
||||
tabs.forEach(button => {
|
||||
const tabId = button.getAttribute('data-tab');
|
||||
const tabContent = container.querySelector(`#tab-${tabId}`);
|
||||
|
||||
if (tabContent && tabContent.querySelector('.swiper')) {
|
||||
const wasHidden = tabContent.classList.contains('hidden');
|
||||
if (wasHidden) {
|
||||
tabContent.style.visibility = 'hidden';
|
||||
tabContent.style.position = 'absolute';
|
||||
tabContent.classList.remove('hidden');
|
||||
tabContent.classList.add('block');
|
||||
}
|
||||
|
||||
if (swipers[tabId]) {
|
||||
swipers[tabId].destroy(true, true);
|
||||
}
|
||||
|
||||
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 20,
|
||||
loop: true,
|
||||
centeredSlides: true,
|
||||
observer: true,
|
||||
observeParents: true,
|
||||
watchSlidesProgress: true,
|
||||
});
|
||||
|
||||
if (wasHidden) {
|
||||
tabContent.style.visibility = '';
|
||||
tabContent.style.position = '';
|
||||
tabContent.classList.add('hidden');
|
||||
tabContent.classList.remove('block');
|
||||
}
|
||||
}
|
||||
swipers[tabId] = new Swiper(`#${blockId} #swiper-${tabId}`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 24,
|
||||
grabCursor: true,
|
||||
watchSlidesProgress: true,
|
||||
scrollbar: {
|
||||
el: `#${blockId} #swiper-${tabId} .swiper-scrollbar`,
|
||||
draggable: true,
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function initLightbox(tabId) {
|
||||
if (lightbox) {
|
||||
lightbox.destroy();
|
||||
}
|
||||
const currentSelector = `#${blockId} #tab-${tabId} .glightbox`;
|
||||
|
||||
lightbox = GLightbox({
|
||||
selector: `#${blockId} #tab-${tabId} .glightbox`,
|
||||
touchNavigation: true,
|
||||
loop: true,
|
||||
autoplayVideos: false,
|
||||
videosWidth: '90vw',
|
||||
videosHeight: '80vh',
|
||||
plyr: {
|
||||
css: 'https://cdn.plyr.io/3.7.8/plyr.css',
|
||||
js: 'https://cdn.plyr.io/3.7.8/plyr.js',
|
||||
config: {
|
||||
ratio: '16:9',
|
||||
fullscreen: { enabled: true, fallback: true, iosNative: true },
|
||||
controls: [
|
||||
'play-large',
|
||||
'play',
|
||||
'progress',
|
||||
'current-time',
|
||||
'duration',
|
||||
'mute',
|
||||
'volume',
|
||||
'fullscreen'
|
||||
]
|
||||
}
|
||||
},
|
||||
onOpen: () => {
|
||||
console.log('видео открыли');
|
||||
},
|
||||
onClose: () => {
|
||||
console.log('видео закрыли');
|
||||
if (lightbox?.settings?.selector !== currentSelector) {
|
||||
if (lightbox) {
|
||||
lightbox.destroy();
|
||||
}
|
||||
});
|
||||
|
||||
const isVideo = tabId === 'video';
|
||||
|
||||
lightbox = GLightbox({
|
||||
selector: currentSelector,
|
||||
touchNavigation: true,
|
||||
loop: true,
|
||||
autoplayVideos: false,
|
||||
videosWidth: isVideo ? '90vw' : 'auto',
|
||||
videosHeight: isVideo ? '80vh' : 'auto',
|
||||
plyr: isVideo ? {
|
||||
css: 'https://cdn.plyr.io/3.7.8/plyr.css',
|
||||
js: 'https://cdn.plyr.io/3.7.8/plyr.js',
|
||||
config: {
|
||||
ratio: '16:9',
|
||||
fullscreen: { enabled: true, fallback: true, iosNative: true },
|
||||
controls: [
|
||||
'play-large',
|
||||
'play',
|
||||
'progress',
|
||||
'current-time',
|
||||
'duration',
|
||||
'mute',
|
||||
'volume',
|
||||
'fullscreen'
|
||||
]
|
||||
}
|
||||
} : undefined,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function toggleRatingSection(show) {
|
||||
const ratingSection = container.querySelector('.rating-section');
|
||||
if (ratingSection) {
|
||||
if (show) {
|
||||
ratingSection.classList.remove('hidden');
|
||||
ratingSection.classList.add('flex');
|
||||
} else {
|
||||
ratingSection.classList.remove('flex');
|
||||
ratingSection.classList.add('hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateRatingAndStars(rating, stars) {
|
||||
|
||||
if (stars) {
|
||||
const starsElement = container.querySelector('[data-reviews="stars"]');
|
||||
if (starsElement) {
|
||||
const starCount = parseInt(stars);
|
||||
const lastDigit = starCount % 10;
|
||||
const lastTwoDigits = starCount % 100;
|
||||
|
||||
let ending;
|
||||
if (lastTwoDigits >= 11 && lastTwoDigits <= 19) {
|
||||
ending = ' оценок';
|
||||
} else if (lastDigit == 1) {
|
||||
ending = ' оценка';
|
||||
} else if (lastDigit >= 2 && lastDigit <= 4) {
|
||||
ending = ' оценки';
|
||||
} else {
|
||||
ending = ' оценок';
|
||||
}
|
||||
|
||||
starsElement.textContent = starCount + ending;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function debounce(func, wait) {
|
||||
let timeout;
|
||||
return (...args) => {
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(() => func.apply(this, args), wait);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
initAllSwipers();
|
||||
|
||||
|
||||
const activeTab = container.querySelector('.tab-button.active');
|
||||
if (activeTab) {
|
||||
const tabId = activeTab.getAttribute('data-tab');
|
||||
initLightbox(tabId);
|
||||
}
|
||||
|
||||
|
||||
container.querySelectorAll('.tab-button').forEach(button => {
|
||||
button.addEventListener('click', () => {
|
||||
button.addEventListener('click', debounce(() => {
|
||||
const tabId = button.getAttribute('data-tab');
|
||||
const rating = button.getAttribute('data-rating');
|
||||
const stars = button.getAttribute('data-stars');
|
||||
const isVideoTab = tabId === 'video';
|
||||
|
||||
|
||||
container.querySelectorAll('.tab-button').forEach(btn => {
|
||||
btn.classList.remove('active', 'underline');
|
||||
btn.classList.add('bg-gray-100');
|
||||
btn.classList.remove('active');
|
||||
});
|
||||
button.classList.add('active', 'underline');
|
||||
button.classList.remove('bg-gray-100');
|
||||
button.classList.add('active');
|
||||
|
||||
|
||||
toggleRatingSection(!isVideoTab);
|
||||
|
||||
|
||||
if (!isVideoTab) {
|
||||
updateRatingAndStars(rating, stars);
|
||||
}
|
||||
|
||||
|
||||
container.querySelectorAll('.tab-content').forEach(content => {
|
||||
content.classList.remove('block');
|
||||
@@ -119,13 +156,22 @@ function initReviewsBlock(blockId) {
|
||||
targetTab.classList.remove('hidden');
|
||||
targetTab.classList.add('block');
|
||||
|
||||
if (swipers[tabId]) {
|
||||
|
||||
initLightbox(tabId);
|
||||
|
||||
|
||||
if (!isVideoTab && swipers[tabId]) {
|
||||
requestAnimationFrame(() => {
|
||||
swipers[tabId].update();
|
||||
});
|
||||
}
|
||||
|
||||
initLightbox(tabId);
|
||||
});
|
||||
}, 100));
|
||||
});
|
||||
|
||||
|
||||
window.addEventListener('beforeunload', () => {
|
||||
Object.values(swipers).forEach(swiper => swiper?.destroy());
|
||||
if (lightbox) lightbox.destroy();
|
||||
});
|
||||
}
|
||||
@@ -1,28 +1,29 @@
|
||||
<?php
|
||||
|
||||
$id = 'reviews-block-' . $block['id'];
|
||||
if ( ! empty($block['anchor'] ) ) {
|
||||
if (!empty($block['anchor'])) {
|
||||
$id = $block['anchor'];
|
||||
}
|
||||
|
||||
$classes = 'block-reviews-block';
|
||||
if ( ! empty( $block['className'] ) ) {
|
||||
if (!empty($block['className'])) {
|
||||
$classes .= ' ' . $block['className'];
|
||||
}
|
||||
if ( ! empty( $block['align'] ) ) {
|
||||
if (!empty($block['align'])) {
|
||||
$classes .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
$heading = get_field('heading');
|
||||
$slider_tabs = get_field('slider_tabs');
|
||||
$slider_video_reviews = get_field('slider_video_reviews');
|
||||
$rating = get_field('rating') ?: '5.0';
|
||||
$stars = get_field('stars');
|
||||
?>
|
||||
|
||||
<div class="reviews-block container mx-auto mt-[24px]"
|
||||
id="<?php echo esc_attr( $id ); ?>"
|
||||
data-reviews-id="<?php echo esc_attr( $id ); ?>">
|
||||
<div>
|
||||
<div class="reviews-block container mx-auto py-[90px]"
|
||||
id="<?php echo esc_attr($id); ?>"
|
||||
data-reviews-id="<?php echo esc_attr($id); ?>">
|
||||
<div class="flex justify-between flex-wrap gap-[12px]">
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[32px] font-bold mt-[24px]"><?php echo esc_html($heading); ?></h2>
|
||||
<?php endif; ?>
|
||||
@@ -31,8 +32,10 @@ $stars = get_field('stars');
|
||||
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
||||
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
||||
<?php if (!empty($tab['tab_name'])) : ?>
|
||||
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active underline' : ''; ?>"
|
||||
data-tab="<?php echo $tab_index; ?>">
|
||||
<button class="tab-button grey-gradient-button rounded-[90px] py-[8px] px-[28px] cursor-pointer transition-all <?php echo $tab_index === 0 ? 'active' : ''; ?>"
|
||||
data-tab="<?php echo $tab_index; ?>"
|
||||
data-rating="<?php echo esc_attr($tab['rating'] ?? $rating); ?>"
|
||||
data-stars="<?php echo esc_attr($tab['stars'] ?? $stars); ?>">
|
||||
<?php echo esc_html($tab['tab_name']); ?>
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
@@ -40,62 +43,95 @@ $stars = get_field('stars');
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($slider_video_reviews) : ?>
|
||||
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] cursor-pointer transition-all"
|
||||
<button class="tab-button grey-gradient-button rounded-[90px] py-[8px] px-[28px] cursor-pointer transition-all"
|
||||
data-tab="video">
|
||||
Видеоотзывы
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<div class="mt-[24px] flex gap-[20px]">
|
||||
<div class="flex gap-[5px] w-full items-center justify-center">
|
||||
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
|
||||
</svg>
|
||||
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
|
||||
</svg>
|
||||
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
|
||||
</svg>
|
||||
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
|
||||
</svg>
|
||||
<svg width="39" height="38" viewBox="0 0 39 38" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5 0L25.7658 11.8759L38.9967 14.1652L29.6383 23.7941L31.5496 37.0848L19.5 31.16L7.4504 37.0848L9.36174 23.7941L0.00334167 14.1652L13.2342 11.8759L19.5 0Z" fill="#565656"/>
|
||||
</svg>
|
||||
<div>
|
||||
Оценок:
|
||||
|
||||
|
||||
<div class="rating-section mt-[24px] flex gap-[20px]">
|
||||
<div class="flex flex-col gap-[6px]">
|
||||
<div data-reviews="rating" class="flex gap-[4px] items-center">
|
||||
<?php
|
||||
echo $stars;
|
||||
for ($i = 0; $i < 5; $i++) {
|
||||
?>
|
||||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2307_14938)">
|
||||
<path d="M19.5654 9.6016C19.7579 9.41536 19.894 9.17868 19.9582 8.91867C20.0224 8.65866 20.012 8.38583 19.9283 8.13144C19.8465 7.87631 19.6944 7.64939 19.4896 7.4767C19.2847 7.30402 19.0354 7.19254 18.7701 7.15506L13.9275 6.45142C13.8259 6.43666 13.7294 6.39742 13.6464 6.33706C13.5634 6.27671 13.4963 6.19707 13.4509 6.105L11.2859 1.71734C11.1682 1.47672 10.9852 1.27411 10.7577 1.13273C10.5302 0.991358 10.2674 0.916931 9.99957 0.91798C9.73178 0.917006 9.46914 0.991469 9.24171 1.13284C9.01429 1.27421 8.83127 1.47678 8.71363 1.71734L6.54823 6.1054C6.45612 6.29243 6.2775 6.42178 6.07126 6.45182L1.22864 7.15547C0.963355 7.19294 0.713995 7.30442 0.509148 7.47711C0.304302 7.64979 0.152261 7.87671 0.0704546 8.13184C-0.0132531 8.38623 -0.0236151 8.65906 0.0405555 8.91907C0.104726 9.17908 0.240834 9.41576 0.43329 9.602L3.93709 13.0173C4.08647 13.1631 4.15496 13.3729 4.11971 13.578L3.29312 18.4006C3.25573 18.6055 3.26439 18.8161 3.31849 19.0173C3.37259 19.2184 3.47076 19.405 3.6059 19.5636C4.03281 20.071 4.7781 20.2255 5.37402 19.9124L9.70482 17.6352C9.79609 17.5887 9.8971 17.5644 9.99957 17.5644C10.102 17.5644 10.2031 17.5887 10.2943 17.6352L14.6255 19.9124C14.8309 20.0219 15.06 20.0793 15.2927 20.0794C15.716 20.0794 16.1173 19.8911 16.3932 19.5636C16.5284 19.4051 16.6266 19.2185 16.6807 19.0173C16.7348 18.8161 16.7434 18.6055 16.706 18.4006L15.879 13.578C15.8617 13.4767 15.8693 13.3728 15.9011 13.2751C15.9329 13.1774 15.988 13.0889 16.0616 13.0173L19.5654 9.6016Z"
|
||||
fill="url(#paint0_linear_2307_14938)"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_2307_14938" x1="-0.000976562" y1="10.4987"
|
||||
x2="19.9997" y2="10.4987"
|
||||
gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0.394231" stop-color="#FFD65A"/>
|
||||
<stop offset="0.929023" stop-color="#FFE595"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_2307_14938">
|
||||
<rect width="20" height="20" fill="white" transform="translate(0 0.5)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
<span class="ml-[8px] font-[600] text-[20px] leading-[115%]">5.0</span>
|
||||
</div>
|
||||
<div class="font-[500] ml-auto text-[16px] leading-[145%] text-[#6c6b6b]">
|
||||
(
|
||||
<span data-reviews="stars">
|
||||
<?php
|
||||
$star_count = $slider_tabs && !empty($slider_tabs['slider_tab'])
|
||||
? ($slider_tabs['slider_tab'][0]['stars'] ?? $stars)
|
||||
: $stars;
|
||||
echo esc_html($star_count);
|
||||
|
||||
// Функция для правильных окончаний
|
||||
$last_digit = $star_count % 10;
|
||||
$last_two_digits = $star_count % 100;
|
||||
|
||||
if ($last_two_digits >= 11 && $last_two_digits <= 19) {
|
||||
echo ' оценок';
|
||||
} elseif ($last_digit == 1) {
|
||||
echo ' оценка';
|
||||
} elseif ($last_digit >= 2 && $last_digit <= 4) {
|
||||
echo ' оценки';
|
||||
} else {
|
||||
echo ' оценок';
|
||||
}
|
||||
?>
|
||||
</span>
|
||||
)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<?php if ($slider_tabs && !empty($slider_tabs['slider_tab'])) : ?>
|
||||
<?php foreach ($slider_tabs['slider_tab'] as $tab_index => $tab) : ?>
|
||||
<div class="tab-content mt-[24px] <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
|
||||
<div class="tab-content mt-[45px] <?php echo $tab_index === 0 ? 'block' : 'hidden'; ?>"
|
||||
id="tab-<?php echo $tab_index; ?>">
|
||||
|
||||
<?php if (!empty($tab['slider_images'])) : ?>
|
||||
<div class="swiper reviews-swiper" id="swiper-<?php echo $tab_index; ?>">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($tab['slider_images'] as $image) : ?>
|
||||
<div class="swiper-slide max-w-[449px] cursor-pointer">
|
||||
<?php foreach ($tab['slider_images'] as $img_index => $image) : ?>
|
||||
<div class="swiper-slide max-w-[424px] cursor-pointer">
|
||||
<a href="<?php echo esc_url($image['url']); ?>"
|
||||
class="glightbox block w-full h-full relative"
|
||||
data-gallery="reviews-<?php echo $tab_index; ?>">
|
||||
<img src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-contain">
|
||||
class="w-full h-full object-contain rounded-[12px]">
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div class="swiper-scrollbar !static !mx-auto !cursor-grab mt-[45px] !w-full !p-0"></div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
@@ -103,50 +139,49 @@ $stars = get_field('stars');
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($slider_video_reviews) : ?>
|
||||
<div class="tab-content mt-[24px] hidden" id="tab-video">
|
||||
<div class="swiper reviews-swiper" id="swiper-video">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($slider_video_reviews as $video) : ?>
|
||||
<?php if (!empty($video['slider_video_review'])) : ?>
|
||||
<div class="swiper-slide max-w-[449px] cursor-pointer">
|
||||
<a href="<?php echo esc_url($video['slider_video_review']['url']); ?>"
|
||||
class="glightbox block w-full h-full relative"
|
||||
data-gallery="reviews-video"
|
||||
data-type="video">
|
||||
<div class="w-full h-[200px] relative overflow-hidden rounded-lg">
|
||||
<?php if (!empty($video['slider_video_prereview'])) : ?>
|
||||
<div class="w-full h-full bg-[#f3f4f6] flex items-center justify-center">
|
||||
<div class="text-center">
|
||||
<div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center mx-auto mb-[8px]">
|
||||
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M8 5v10l8-5-8-5z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<img src="<?php echo esc_url($video['slider_video_prereview']['url']); ?>"
|
||||
alt="<?php echo esc_attr($video['slider_video_prereview']['alt'] ?: 'Превью видеоотзыва'); ?>"
|
||||
class="w-full h-full object-cover">
|
||||
</div>
|
||||
</div>
|
||||
<?php else : ?>
|
||||
|
||||
<div class="w-full h-full bg-[#f3f4f6] flex justify-center">
|
||||
<div class="text-center">
|
||||
<div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center mx-auto mb-[8px]">
|
||||
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M8 5v10l8-5-8-5z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<p class="text-[14px] text-[#6b7280]">Видеоотзыв</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-content mt-[45px] hidden" id="tab-video">
|
||||
<div class="video-reviews-grid flex flex-wrap gap-[24px]">
|
||||
<?php foreach ($slider_video_reviews as $video_index => $video) : ?>
|
||||
<?php if (!empty($video['slider_video_review'])) : ?>
|
||||
<div class="video-review-item max-w-[424px] h-[358px] w-full bg-white rounded-[12px]">
|
||||
<a href="<?php echo esc_url($video['slider_video_review']['url']); ?>"
|
||||
class="glightbox hover:[&_svg]:fill-[#e21e24] p-[24px] !no-underline block w-full h-full relative"
|
||||
data-gallery="reviews-video"
|
||||
data-type="video">
|
||||
<?php if (!empty($video['author']) || !empty($video['data_otzyva'])) : ?>
|
||||
<div class="flex justify-between h-[46px] w-full items-center">
|
||||
<?php if (!empty($video['author'])) : ?>
|
||||
<div class="font-[600] text-[20px] leading-[115%]"><?php echo esc_html($video['author']); ?></div>
|
||||
<?php endif; ?>
|
||||
<?php if (!empty($video['data_otzyva'])) : ?>
|
||||
<div class="font-[500] text-[14px] leading-[125%] text-[#6c6b6b]"><?php echo esc_html($video['data_otzyva']); ?></div>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="w-full h-[240px] mt-[24px] rounded-[12px] relative overflow-hidden">
|
||||
<img src="<?php echo esc_url($video['slider_video_prereview']['url']); ?>"
|
||||
alt="<?php echo esc_attr($video['slider_video_prereview']['alt'] ?: 'Превью видеоотзыва'); ?>"
|
||||
class="w-full h-full object-cover">
|
||||
|
||||
<div class="absolute inset-0 flex items-center justify-center">
|
||||
<svg class="transition-all" width="76" height="76" viewBox="0 0 76 76" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 38C0 17.0132 17.0132 0 38 0C58.9868 0 76 17.0132 76 38C76 58.9868 58.9868 76 38 76C17.0132 76 0 58.9868 0 38Z" fill="url(#paint0_linear_4086_3690)" fill-opacity="0.32" />
|
||||
<path d="M38 0.379883C58.777 0.379883 75.6201 17.223 75.6201 38C75.6201 58.777 58.777 75.6201 38 75.6201C17.223 75.6201 0.379883 58.777 0.379883 38C0.379883 17.223 17.223 0.379883 38 0.379883Z" stroke="white" stroke-opacity="0.14" stroke-width="0.76" />
|
||||
<path d="M49.5 35.4019C51.5 36.5566 51.5 39.4434 49.5 40.5981L34.5 49.2583C32.5 50.413 30 48.9697 30 46.6603L30 29.3397C30 27.0303 32.5 25.587 34.5 26.7417L49.5 35.4019Z" fill="white" />
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4086_3690" x1="0" y1="38" x2="76" y2="38" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0.394231" stop-color="#9D9994" />
|
||||
<stop offset="0.929023" stop-color="#C5C5B9" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
@@ -0,0 +1,126 @@
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// Небольшая задержка для корректной инициализации GLightbox
|
||||
setTimeout(() => {
|
||||
document.querySelectorAll('.simple-gallery-block').forEach(function (block) {
|
||||
const blockId = block.getAttribute('data-gallery-id');
|
||||
initSimpleGallery(blockId);
|
||||
});
|
||||
}, 100);
|
||||
});
|
||||
|
||||
function initSimpleGallery(blockId) {
|
||||
const container = document.getElementById(blockId);
|
||||
if (!container) return;
|
||||
|
||||
let mainSwiper;
|
||||
let thumbnailSwiper;
|
||||
let lightbox;
|
||||
|
||||
// Проверяем, одно изображение или несколько
|
||||
const isSingleImage = container.querySelector('.single-image');
|
||||
const hasMultipleImages = container.querySelector('.gallery-swiper');
|
||||
|
||||
function initLightbox() {
|
||||
if (typeof GLightbox === 'undefined') {
|
||||
console.warn('GLightbox is not loaded');
|
||||
return;
|
||||
}
|
||||
|
||||
const selector = `#${blockId} .glightbox`;
|
||||
|
||||
if (lightbox) {
|
||||
lightbox.destroy();
|
||||
}
|
||||
|
||||
lightbox = GLightbox({
|
||||
selector: selector,
|
||||
preload: false,
|
||||
touchNavigation: true,
|
||||
loop: true
|
||||
});
|
||||
}
|
||||
|
||||
function updateThumbnails(activeIndex) {
|
||||
const thumbnails = container.querySelectorAll('.thumbnail');
|
||||
thumbnails.forEach((thumb, index) => {
|
||||
if (index === activeIndex) {
|
||||
thumb.classList.remove('opacity-50', 'hover:opacity-80');
|
||||
thumb.classList.add('opacity-100', 'active');
|
||||
} else {
|
||||
thumb.classList.remove('opacity-100', 'active');
|
||||
thumb.classList.add('opacity-50', 'hover:opacity-80');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function centerThumbnail(activeIndex) {
|
||||
if (thumbnailSwiper) {
|
||||
thumbnailSwiper.slideTo(activeIndex);
|
||||
}
|
||||
}
|
||||
|
||||
// Инициализация для одного изображения
|
||||
if (isSingleImage) {
|
||||
initLightbox();
|
||||
|
||||
window.addEventListener('beforeunload', () => {
|
||||
if (lightbox) lightbox.destroy();
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// Инициализация для множественных изображений
|
||||
if (hasMultipleImages) {
|
||||
// Thumbnail swiper
|
||||
thumbnailSwiper = new Swiper(`#${blockId} .thumbnail-swiper`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 6,
|
||||
freeMode: true,
|
||||
grabCursor: true,
|
||||
watchSlidesProgress: true,
|
||||
});
|
||||
|
||||
// Main swiper
|
||||
mainSwiper = new Swiper(`#${blockId} .gallery-swiper`, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 0,
|
||||
grabCursor: true,
|
||||
watchSlidesProgress: true,
|
||||
lazy: {
|
||||
loadPrevNext: true,
|
||||
loadOnTransitionStart: true,
|
||||
},
|
||||
on: {
|
||||
slideChange: function () {
|
||||
updateThumbnails(this.realIndex);
|
||||
centerThumbnail(this.realIndex);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Lightbox для множественных изображений
|
||||
initLightbox();
|
||||
|
||||
// Обработчик клика по thumbnail
|
||||
container.addEventListener('click', (e) => {
|
||||
const thumbnail = e.target.closest('.thumbnail');
|
||||
if (!thumbnail) return;
|
||||
|
||||
const index = parseInt(thumbnail.getAttribute('data-index'));
|
||||
|
||||
if (mainSwiper) {
|
||||
mainSwiper.slideTo(index);
|
||||
}
|
||||
|
||||
updateThumbnails(index);
|
||||
centerThumbnail(index);
|
||||
});
|
||||
|
||||
// Cleanup
|
||||
window.addEventListener('beforeunload', () => {
|
||||
if (mainSwiper) mainSwiper.destroy();
|
||||
if (thumbnailSwiper) thumbnailSwiper.destroy();
|
||||
if (lightbox) lightbox.destroy();
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,117 @@
|
||||
<?php
|
||||
|
||||
$id = 'simple-gallery-' . $block['id'];
|
||||
if (!empty($block['anchor'])) {
|
||||
$id = $block['anchor'];
|
||||
}
|
||||
|
||||
$classes = 'block-simple-gallery';
|
||||
if (!empty($block['className'])) {
|
||||
$classes .= ' ' . $block['className'];
|
||||
}
|
||||
if (!empty($block['align'])) {
|
||||
$classes .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
$heading = get_field('heading');
|
||||
$description = get_field('description');
|
||||
$gallery_images = get_field('gallery_images');
|
||||
|
||||
?>
|
||||
|
||||
<div class="simple-gallery-block pt-[90px]"
|
||||
id="<?php echo esc_attr($id); ?>"
|
||||
data-gallery-id="<?php echo esc_attr($id); ?>">
|
||||
|
||||
<div class="container mx-auto">
|
||||
<div class="flex gap-[48px] justify-between flex-wrap items-start">
|
||||
|
||||
|
||||
<div class="gallery-section w-full max-w-[535px]">
|
||||
<?php if ($gallery_images && !empty($gallery_images)) : ?>
|
||||
|
||||
<?php if (count($gallery_images) === 1) : ?>
|
||||
|
||||
<div class="single-image max-w-[535px] h-[500px]">
|
||||
<a href="<?php echo esc_url($gallery_images[0]['url']); ?>"
|
||||
class="glightbox block w-full h-full"
|
||||
data-gallery="simple-gallery-<?php echo esc_attr($id); ?>">
|
||||
<img src="<?php echo esc_url($gallery_images[0]['url']); ?>"
|
||||
alt="<?php echo esc_attr($gallery_images[0]['alt']); ?>"
|
||||
class="w-full h-full object-cover rounded-[24px]"
|
||||
width="<?php echo esc_attr($gallery_images[0]['width']); ?>"
|
||||
height="<?php echo esc_attr($gallery_images[0]['height']); ?>"
|
||||
fetchpriority="high">
|
||||
</a>
|
||||
</div>
|
||||
<?php else : ?>
|
||||
|
||||
<div class="swiper !m-0 max-w-[535px] gallery-swiper h-[500px] rounded-[24px]">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($gallery_images as $img_index => $image) : ?>
|
||||
<div class="swiper-slide max-w-[648px] cursor-pointer min-h-[500px]">
|
||||
<a href="<?php echo esc_url($image['url']); ?>"
|
||||
class="glightbox block w-full h-full"
|
||||
data-gallery="simple-gallery-<?php echo esc_attr($id); ?>">
|
||||
<?php if ($img_index === 0) : ?>
|
||||
<img src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover"
|
||||
width="<?php echo esc_attr($image['width']); ?>"
|
||||
height="<?php echo esc_attr($image['height']); ?>"
|
||||
fetchpriority="high">
|
||||
<?php else : ?>
|
||||
<img data-src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full h-full object-cover swiper-lazy"
|
||||
width="<?php echo esc_attr($image['width']); ?>"
|
||||
height="<?php echo esc_attr($image['height']); ?>">
|
||||
<div class="swiper-lazy-preloader"></div>
|
||||
<?php endif; ?>
|
||||
</a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Thumbnails -->
|
||||
<div class="relative mt-[8px]">
|
||||
<div class="swiper thumbnail-swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($gallery_images as $thumb_index => $image) : ?>
|
||||
<div class="swiper-slide max-w-[102px] !h-[62px]">
|
||||
<div class="thumbnail w-full h-full overflow-hidden cursor-pointer transition-opacity duration-[180ms] ease-in-out <?php echo $thumb_index === 0 ? 'active opacity-100' : 'opacity-50 hover:opacity-80'; ?>"
|
||||
data-index="<?php echo $thumb_index; ?>">
|
||||
<img src="<?php echo esc_url($image['sizes']['thumbnail'] ?? $image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt']); ?>"
|
||||
class="w-full rounded-[6px] h-full object-cover"
|
||||
width="102"
|
||||
height="62">
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<div class="content-section w-full max-w-[725px]">
|
||||
<div class="py-[48px] pr-[12px]">
|
||||
<?php if ($heading) : ?>
|
||||
<h2 class="text-[48px] font-[700] leading-[110%] mb-[24px]"><?php echo esc_html($heading); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($description) : ?>
|
||||
<div class="text-[18px] leading-[150%] text-gray-600">
|
||||
<?php echo $description ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,277 @@
|
||||
<?php
|
||||
/**
|
||||
* Блок с тренерами
|
||||
*/
|
||||
|
||||
// Получение полей ACF
|
||||
$block_id = 'trainer-block-' . $block['id'];
|
||||
$class_name = 'trainer-block';
|
||||
if (!empty($block['className'])) {
|
||||
$class_name .= ' ' . $block['className'];
|
||||
}
|
||||
if (!empty($block['align'])) {
|
||||
$class_name .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
if (!function_exists('get_trainers_for_current_language')) {
|
||||
function get_trainers_for_current_language()
|
||||
{
|
||||
$current_lang = pll_current_language();
|
||||
|
||||
$args = array(
|
||||
'post_type' => 'trainer',
|
||||
'posts_per_page' => -1,
|
||||
'lang' => $current_lang,
|
||||
'post_status' => 'publish',
|
||||
'sort' => 'menu_order',
|
||||
'order' => 'ASC',
|
||||
);
|
||||
|
||||
return get_posts($args);
|
||||
}
|
||||
}
|
||||
|
||||
$trainers = get_trainers_for_current_language();
|
||||
|
||||
// Получаем все поля short_info для каждого тренера
|
||||
$trainers_data = array();
|
||||
if ($trainers) {
|
||||
foreach ($trainers as $trainer) {
|
||||
$trainer_info = array(
|
||||
'post' => $trainer,
|
||||
'name' => '',
|
||||
'exp' => '',
|
||||
'short_desc' => ''
|
||||
);
|
||||
|
||||
if (have_rows('short_info', $trainer->ID)) {
|
||||
while (have_rows('short_info', $trainer->ID)) {
|
||||
the_row();
|
||||
$trainer_info['name'] = get_sub_field('name');
|
||||
$trainer_info['exp'] = get_sub_field('exp');
|
||||
$trainer_info['short_desc'] = get_sub_field('short_desc');
|
||||
}
|
||||
}
|
||||
|
||||
$trainers_data[] = $trainer_info;
|
||||
}
|
||||
}
|
||||
|
||||
$heading = get_field('heading', $block['id']);
|
||||
|
||||
$room = get_current_room();
|
||||
|
||||
if ($room === 'fitness') {
|
||||
$section_classes = 'radial-gradient';
|
||||
$style_attr = '';
|
||||
} else {
|
||||
$section_classes = '';
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<section id="<?php echo esc_attr($block_id); ?>"
|
||||
class="py-[96px] <?php echo esc_attr($section_classes); ?>" <?php echo $style_attr; ?>>
|
||||
<div class="container mx-auto">
|
||||
<?php if ($trainers_data): ?>
|
||||
<?php if (is_front_page()): ?>
|
||||
<div class="flex flex-col gap-[16px] ">
|
||||
<h2 class="text-[40px] leading-[120%] font-[500]">
|
||||
<?php
|
||||
echo $heading;
|
||||
?>
|
||||
</h2>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="mt-[40px] flex gap-[24px]">
|
||||
|
||||
<div class="swiper rounded-[20px] rounded-b-[0]" id="<?php echo esc_attr($block_id); ?>-swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($trainers_data as $trainer_data): ?>
|
||||
<?php $trainer = $trainer_data['post']; ?>
|
||||
<div class="max-w-[312px] swiper-slide">
|
||||
<div class="flex flex-col gap-[12px]">
|
||||
<div class="flex relative rounded-[20px] overflow-hidden shadow-[0_2px_32px_0_rgba(16,_15,_15,_0.03)]">
|
||||
<?php $photo_images = get_field('photo', $trainer->ID); ?>
|
||||
<?php if ($photo_images && !empty($photo_images[0])): ?>
|
||||
<div class="overflow-hidden h-[460px]">
|
||||
<img src="<?php echo esc_url($photo_images[0]['url']); ?>"
|
||||
alt="<?php echo esc_attr($photo_images[0]['alt']); ?>"
|
||||
loading="lazy"
|
||||
class="w-full h-full object-cover"/>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="flex gap-[4px] absolute left-[12px] bottom-[16px]">
|
||||
|
||||
|
||||
<div class="text-[15px] leading-[110%] font-[600] text-[#fff] px-[12px] h-[29px] flex items-center justify-center rounded-[32px] backdrop-blur-[8px] bg-[linear-gradient(90deg,rgba(157,153,148,0.7)_39.42%,rgba(197,197,185,0.7)_92.9%)]">
|
||||
<?php
|
||||
echo
|
||||
pll_current_language( 'name' );
|
||||
?>
|
||||
</div>
|
||||
|
||||
<?php $exp = $trainer_data['exp']; ?>
|
||||
<?php if ($exp): ?>
|
||||
<div class="text-[15px] leading-[110%] font-[600] text-[#fff] px-[12px] h-[29px] flex items-center justify-center rounded-[32px] backdrop-blur-[8px] bg-[linear-gradient(90deg,rgba(157,153,148,0.7)_39.42%,rgba(197,197,185,0.7)_92.9%)]">
|
||||
<?php echo esc_html($exp); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<?php $name = $trainer_data['name']; ?>
|
||||
<?php if ($name): ?>
|
||||
<div class="text-[24px] leading-[125%] font-[600]">
|
||||
<?php echo esc_html($name); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php $short_desc = $trainer_data['short_desc']; ?>
|
||||
<?php if ($short_desc): ?>
|
||||
<div class="text-[16px] leading-[145%] font-[500] mt-[4px] text-[#6c6b6b]">
|
||||
<?php echo wp_kses_post($short_desc); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col justify-between w-full max-w-[312px]">
|
||||
<div
|
||||
class="p-[24px] flex flex-col bg-cover bg-center bg-no-repeat rounded-[20px] h-[460px]"
|
||||
<?php
|
||||
if (get_current_room() === 'fitness') : ?>
|
||||
style="background-image: url('<?php echo get_template_directory_uri() . '/assets/images/trainer-bg-dark.png'; ?>')"
|
||||
<?php else : ?>
|
||||
style="background-image: url('<?php echo get_template_directory_uri() . '/assets/images/trainer-bg-light.png'; ?>')"
|
||||
<?php endif;
|
||||
?>
|
||||
>
|
||||
<?php
|
||||
|
||||
if (get_current_room() === 'fitness') :
|
||||
?>
|
||||
<svg width="138" height="14" viewBox="0 0 138 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2190_3090)">
|
||||
<mask id="mask0_2190_3090" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="84" height="14">
|
||||
<path d="M83.731 0.046875H0V13.9305H83.731V0.046875Z" fill="white" />
|
||||
</mask>
|
||||
<g mask="url(#mask0_2190_3090)">
|
||||
<path d="M48.2909 13.931C48.2909 13.931 48.349 13.7557 48.4943 13.4341C48.6397 13.0834 48.8142 12.645 49.0177 12.0896C49.2503 11.5343 49.4829 10.9205 49.7736 10.219C50.0643 9.51752 50.3551 8.78682 50.6458 8.05605C50.9365 7.32535 51.2273 6.59464 51.518 5.89315C51.8087 5.19166 52.0413 4.57786 52.2739 4.02251C52.5065 3.46718 52.6809 3.02874 52.8263 2.678C52.9717 2.32726 53.0298 2.18111 53.0298 2.18111C53.2914 1.59654 53.6985 1.15811 54.2218 0.807368C54.7451 0.456622 55.3266 0.310479 55.9371 0.310479H68.3514L67.5664 2.21034C67.3048 2.82414 66.9268 3.32103 66.3745 3.67177C65.822 4.05174 65.2115 4.22712 64.5719 4.22712H56.8384C56.4895 4.22712 56.2278 4.40249 56.0825 4.72401L55.7627 5.51318H62.3624L61.432 7.79303C61.3157 8.08533 61.1413 8.31913 60.8796 8.49453C60.618 8.66985 60.3563 8.75754 60.0365 8.75754H54.9777C54.6288 8.75754 54.3672 8.93293 54.2218 9.25443L53.902 10.0436H64.3393L63.5834 11.9142C63.3218 12.528 62.9438 13.0249 62.3914 13.4049C61.839 13.7849 61.2285 13.9603 60.5888 13.9603H48.2909V13.931ZM38.1443 1.21657C38.2606 0.924278 38.435 0.71968 38.6676 0.544308C38.9002 0.368935 39.1909 0.28125 39.4817 0.28125H42.6506L40.5573 5.51318L40.5865 5.54241L45.7615 0.631993C46.0231 0.398164 46.2848 0.28125 46.6046 0.28125H51.7215L43.4356 8.17295C43.4647 8.23144 43.6392 8.46525 43.9589 8.90372C44.0753 9.07904 44.2497 9.31292 44.4532 9.60522C44.6567 9.86823 44.8893 10.219 45.18 10.6282C45.4708 11.0374 45.7905 11.505 46.1976 12.0604C46.5755 12.6157 47.0407 13.2295 47.5349 13.9603H42.8542L39.22 8.81603L37.5628 12.9665C37.4465 13.2588 37.2721 13.4926 37.0104 13.668C36.7488 13.8433 36.4871 13.931 36.1673 13.931H32.9983L38.1443 1.21657ZM29.9165 5.51318C30.091 5.51318 30.2364 5.42549 30.2945 5.25012L30.7015 4.22712H24.7415C24.5671 4.22712 24.4217 4.3148 24.3636 4.49018L23.9565 5.51318H29.9165ZM16.3975 13.931L21.1073 2.29803C21.369 1.68422 21.747 1.18734 22.2703 0.836597C22.7936 0.48585 23.4042 0.28125 24.0728 0.28125H36.458L31.7773 11.8558C31.5156 12.4696 31.1376 12.9665 30.5852 13.3465C30.0329 13.7264 29.4223 13.9018 28.7827 13.9018H26.8057L28.899 8.69912H22.6482L20.9038 12.9665C20.7876 13.2588 20.6131 13.4634 20.3515 13.6387C20.0898 13.8141 19.8282 13.9018 19.5083 13.9018H16.3975V13.931Z" fill="white" />
|
||||
<path d="M3.60508 5.01441L4.6808 2.32537C4.94246 1.71157 5.32041 1.21468 5.8728 0.86394C6.42519 0.483965 7.03575 0.308594 7.67534 0.308594H9.65234L8.14049 4.04986L6.22168 8.84336C6.16353 8.96026 6.10538 9.07717 6.04724 9.19407L4.97153 11.8831C4.70987 12.4969 4.33192 12.9938 3.77952 13.3738C3.22713 13.7538 2.61659 13.9291 1.97698 13.9291H0L1.51181 10.1879L3.43064 5.39438C3.48879 5.24824 3.54694 5.13132 3.60508 5.01441Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.0601 0.046875C17.647 6.3018 12.4138 2.96974 8.31445 4.48963C9.50648 0.982194 11.6579 0.339161 14.071 0.309933C15.8735 0.280704 18.4029 0.485305 20.0601 0.046875Z" fill="white" />
|
||||
<path d="M83.7313 0.337822L79.0798 11.8831C78.8181 12.4969 78.4399 12.9938 77.8877 13.3738C77.3354 13.7537 76.725 13.9291 76.085 13.9291H74.1084L78.0041 4.25446H77.4224C77.1607 4.25446 76.899 4.31292 76.6379 4.42984C76.3762 4.54675 76.1727 4.72212 75.998 4.92672L68.6422 13.9291H63.6709L73.6719 1.5362C73.9631 1.15622 74.3406 0.863936 74.7771 0.630109C75.2128 0.425508 75.678 0.308594 76.1727 0.308594H83.7313V0.337822Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.9612 4.57812C14.1005 9.37161 10.1175 6.71181 6.97754 7.88093C8.60566 3.08746 12.3271 5.54267 15.9612 4.57812Z" fill="white" />
|
||||
</g>
|
||||
<mask id="mask1_2190_3090" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="84" height="14">
|
||||
<path d="M83.731 0.046875H0V13.9305H83.731V0.046875Z" fill="white" />
|
||||
</mask>
|
||||
<g mask="url(#mask1_2190_3090)">
|
||||
<path d="M48.2909 13.931C48.2909 13.931 48.349 13.7557 48.4943 13.4341C48.6397 13.0834 48.8142 12.645 49.0177 12.0896C49.2503 11.5343 49.4829 10.9205 49.7736 10.219C50.0643 9.51752 50.3551 8.78682 50.6458 8.05605C50.9365 7.32535 51.2273 6.59464 51.518 5.89315C51.8087 5.19166 52.0413 4.57786 52.2739 4.02251C52.5065 3.46718 52.6809 3.02874 52.8263 2.678C52.9717 2.32726 53.0298 2.18111 53.0298 2.18111C53.2914 1.59654 53.6985 1.15811 54.2218 0.807368C54.7451 0.456622 55.3266 0.310479 55.9371 0.310479H68.3514L67.5664 2.21034C67.3048 2.82414 66.9268 3.32103 66.3745 3.67177C65.822 4.05174 65.2115 4.22712 64.5719 4.22712H56.8384C56.4895 4.22712 56.2278 4.40249 56.0825 4.72401L55.7627 5.51318H62.3624L61.432 7.79303C61.3157 8.08533 61.1413 8.31913 60.8796 8.49453C60.618 8.66985 60.3563 8.75754 60.0365 8.75754H54.9777C54.6288 8.75754 54.3672 8.93293 54.2218 9.25443L53.902 10.0436H64.3393L63.5834 11.9142C63.3218 12.528 62.9438 13.0249 62.3914 13.4049C61.839 13.7849 61.2285 13.9603 60.5888 13.9603H48.2909V13.931ZM38.1443 1.21657C38.2606 0.924278 38.435 0.71968 38.6676 0.544308C38.9002 0.368935 39.1909 0.28125 39.4817 0.28125H42.6506L40.5573 5.51318L40.5865 5.54241L45.7615 0.631993C46.0231 0.398164 46.2848 0.28125 46.6046 0.28125H51.7215L43.4356 8.17295C43.4647 8.23144 43.6392 8.46525 43.9589 8.90372C44.0753 9.07904 44.2497 9.31292 44.4532 9.60522C44.6567 9.86823 44.8893 10.219 45.18 10.6282C45.4708 11.0374 45.7905 11.505 46.1976 12.0604C46.5755 12.6157 47.0407 13.2295 47.5349 13.9603H42.8542L39.22 8.81603L37.5628 12.9665C37.4465 13.2588 37.2721 13.4926 37.0104 13.668C36.7488 13.8433 36.4871 13.931 36.1673 13.931H32.9983L38.1443 1.21657ZM29.9165 5.51318C30.091 5.51318 30.2364 5.42549 30.2945 5.25012L30.7015 4.22712H24.7415C24.5671 4.22712 24.4217 4.3148 24.3636 4.49018L23.9565 5.51318H29.9165ZM16.3975 13.931L21.1073 2.29803C21.369 1.68422 21.747 1.18734 22.2703 0.836597C22.7936 0.48585 23.4042 0.28125 24.0728 0.28125H36.458L31.7773 11.8558C31.5156 12.4696 31.1376 12.9665 30.5852 13.3465C30.0329 13.7264 29.4223 13.9018 28.7827 13.9018H26.8057L28.899 8.69912H22.6482L20.9038 12.9665C20.7876 13.2588 20.6131 13.4634 20.3515 13.6387C20.0898 13.8141 19.8282 13.9018 19.5083 13.9018H16.3975V13.931Z" fill="white" />
|
||||
<path d="M3.60508 5.01441L4.6808 2.32537C4.94246 1.71157 5.32041 1.21468 5.8728 0.86394C6.42519 0.483965 7.03575 0.308594 7.67534 0.308594H9.65234L8.14049 4.04986L6.22168 8.84336C6.16353 8.96026 6.10538 9.07717 6.04724 9.19407L4.97153 11.8831C4.70987 12.4969 4.33192 12.9938 3.77952 13.3738C3.22713 13.7538 2.61659 13.9291 1.97698 13.9291H0L1.51181 10.1879L3.43064 5.39438C3.48879 5.24824 3.54694 5.13132 3.60508 5.01441Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.0601 0.046875C17.647 6.3018 12.4138 2.96974 8.31445 4.48963C9.50648 0.982194 11.6579 0.339161 14.071 0.309933C15.8735 0.280704 18.4029 0.485305 20.0601 0.046875Z" fill="white" />
|
||||
<path d="M83.7313 0.337822L79.0798 11.8831C78.8181 12.4969 78.4399 12.9938 77.8877 13.3738C77.3354 13.7537 76.725 13.9291 76.085 13.9291H74.1084L78.0041 4.25446H77.4224C77.1607 4.25446 76.899 4.31292 76.6379 4.42984C76.3762 4.54675 76.1727 4.72212 75.998 4.92672L68.6422 13.9291H63.6709L73.6719 1.5362C73.9631 1.15622 74.3406 0.863936 74.7771 0.630109C75.2128 0.425508 75.678 0.308594 76.1727 0.308594H83.7313V0.337822Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.9612 4.57812C14.1005 9.37161 10.1175 6.71181 6.97754 7.88093C8.60566 3.08746 12.3271 5.54267 15.9612 4.57812Z" fill="white" />
|
||||
</g>
|
||||
<path d="M87.531 2.59082C88.0887 1.22398 89.3809 0.335938 90.8122 0.335938H137.01L132.516 11.6376C131.966 13.0212 130.665 13.924 129.222 13.924H82.9062L87.531 2.59082Z" fill="white" />
|
||||
<path d="M96.3045 4.77025H93.4138L93.113 6.55436H95.9317L95.683 7.97304H92.8643L92.3772 10.8749H90.9473L92.2216 3.35156H96.5532L96.3045 4.77025Z" fill="#ADAAA4" />
|
||||
<path d="M97.5957 3.35156H99.0256L97.7512 10.8749H96.3213L97.5957 3.35156Z" fill="#ADAAA4" />
|
||||
<path d="M105.166 3.35156L104.927 4.77025H102.969L101.933 10.8749H100.503L101.539 4.77025H99.5908L99.8293 3.35156H105.166Z" fill="#ADAAA4" />
|
||||
<path d="M104.689 10.8749L105.964 3.35156H107.042L109.372 8.0483L110.16 3.35156H111.59L110.316 10.8749H109.238L106.917 6.17819L106.119 10.8749H104.689Z" fill="#ADAAA4" />
|
||||
<path d="M117.133 4.77025H114.128L113.847 6.38239H116.604L116.355 7.76887H113.62L113.329 9.45619H116.387L116.148 10.8749H111.661L112.936 3.35156H117.371L117.133 4.77025Z" fill="#ADAAA4" />
|
||||
<path d="M119.726 11.0235C118.994 11.0235 118.393 10.8587 117.923 10.5291C117.46 10.1923 117.163 9.73737 117.032 9.16415L118.327 8.4763C118.507 9.2215 119.011 9.59403 119.84 9.59403C120.22 9.59403 120.517 9.52239 120.731 9.37912C120.952 9.23578 121.084 9.0459 121.125 8.80946C121.18 8.53721 121.104 8.32586 120.897 8.17534C120.696 8.02489 120.344 7.86371 119.84 7.69173C119.163 7.4553 118.652 7.15796 118.307 6.79968C117.968 6.43426 117.854 5.92195 117.965 5.26276C118.082 4.58208 118.39 4.06978 118.887 3.72585C119.391 3.37476 119.964 3.19922 120.607 3.19922C121.201 3.19922 121.708 3.34611 122.13 3.63987C122.551 3.93364 122.855 4.34563 123.042 4.87585L121.788 5.5637C121.532 4.94034 121.101 4.62865 120.493 4.62865C120.202 4.62865 119.961 4.69314 119.767 4.82211C119.581 4.95108 119.463 5.12663 119.415 5.34874C119.36 5.61385 119.432 5.82522 119.633 5.98285C119.833 6.13332 120.172 6.29812 120.648 6.47724C120.772 6.5274 120.876 6.56681 120.959 6.59547C121.042 6.62413 121.146 6.66712 121.27 6.72444C121.395 6.7746 121.495 6.82475 121.571 6.87491C121.654 6.9179 121.747 6.97522 121.85 7.04687C121.954 7.11134 122.04 7.17942 122.109 7.25105C122.178 7.31558 122.248 7.39439 122.316 7.48749C122.392 7.57348 122.448 7.66665 122.482 7.76699C122.524 7.86727 122.558 7.97834 122.586 8.10015C122.613 8.21478 122.627 8.34376 122.627 8.48703C122.627 8.63037 122.613 8.78082 122.586 8.93844C122.468 9.61194 122.151 10.1279 121.632 10.4861C121.121 10.8444 120.486 11.0235 119.726 11.0235Z" fill="#ADAAA4" />
|
||||
<path d="M125.797 11.0235C125.064 11.0235 124.463 10.8587 123.994 10.5291C123.531 10.1923 123.233 9.73737 123.103 9.16415L124.397 8.4763C124.577 9.2215 125.082 9.59403 125.91 9.59403C126.291 9.59403 126.587 9.52239 126.802 9.37912C127.023 9.23578 127.154 9.0459 127.196 8.80946C127.25 8.53721 127.174 8.32586 126.967 8.17534C126.767 8.02489 126.415 7.86371 125.91 7.69173C125.233 7.4553 124.722 7.15796 124.377 6.79968C124.038 6.43426 123.925 5.92195 124.035 5.26276C124.152 4.58208 124.46 4.06978 124.957 3.72585C125.462 3.37476 126.035 3.19922 126.678 3.19922C127.272 3.19922 127.779 3.34611 128.201 3.63987C128.622 3.93364 128.926 4.34563 129.113 4.87585L127.859 5.5637C127.603 4.94034 127.171 4.62865 126.563 4.62865C126.273 4.62865 126.032 4.69314 125.838 4.82211C125.651 4.95108 125.534 5.12663 125.485 5.34874C125.431 5.61385 125.503 5.82522 125.703 5.98285C125.903 6.13332 126.242 6.29812 126.719 6.47724C126.843 6.5274 126.947 6.56681 127.03 6.59547C127.113 6.62413 127.216 6.66712 127.34 6.72444C127.465 6.7746 127.565 6.82475 127.641 6.87491C127.724 6.9179 127.817 6.97522 127.921 7.04687C128.025 7.11134 128.111 7.17942 128.18 7.25105C128.249 7.31558 128.318 7.39439 128.387 7.48749C128.463 7.57348 128.518 7.66665 128.553 7.76699C128.594 7.86727 128.629 7.97834 128.656 8.10015C128.684 8.21478 128.698 8.34376 128.698 8.48703C128.698 8.63037 128.684 8.78082 128.656 8.93844C128.539 9.61194 128.221 10.1279 127.703 10.4861C127.192 10.8444 126.556 11.0235 125.797 11.0235Z" fill="#ADAAA4" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3090">
|
||||
<rect width="137.03" height="14" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<?php
|
||||
else :
|
||||
?>
|
||||
<svg width="127" height="14" viewBox="0 0 127 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4006_20975)">
|
||||
<mask id="mask0_4006_20975" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="88" height="14">
|
||||
<path d="M87.4168 0H0V13.9745H87.4168V0Z" fill="white" />
|
||||
</mask>
|
||||
<g mask="url(#mask0_4006_20975)">
|
||||
<path d="M50.4164 13.9735C50.4164 13.9735 50.4771 13.797 50.6289 13.4733C50.7806 13.1203 50.9627 12.679 51.1752 12.12C51.4181 11.5611 51.6609 10.9432 51.9644 10.2372C52.268 9.53106 52.5715 8.79555 52.875 8.06005C53.1785 7.32461 53.4821 6.5891 53.7856 5.883C54.0891 5.17692 54.332 4.5591 54.5747 4.00012C54.8176 3.44115 54.9997 2.99985 55.1515 2.64681C55.3033 2.29377 55.3639 2.14667 55.3639 2.14667C55.6371 1.55827 56.0621 1.11698 56.6084 0.763936C57.1548 0.410894 57.7618 0.263795 58.3993 0.263795H71.3603L70.5405 2.17609C70.2674 2.79391 69.8726 3.29404 69.2963 3.64708C68.7192 4.02954 68.0817 4.20606 67.4138 4.20606H59.3402C58.976 4.20606 58.7028 4.38258 58.551 4.7062L58.2171 5.50055H65.107L64.1358 7.79531C64.0147 8.0895 63.8325 8.32485 63.5594 8.50136C63.2863 8.67788 63.0129 8.76617 62.679 8.76617H57.3976C57.0334 8.76617 56.7602 8.94268 56.6084 9.26632L56.2746 10.0607H67.171L66.3821 11.9435C66.109 12.5613 65.7143 13.0615 65.1379 13.4439C64.5609 13.8264 63.9233 14.0029 63.2554 14.0029H50.4164V13.9735ZM39.8232 1.17581C39.9446 0.881611 40.1268 0.675673 40.3695 0.499154C40.6124 0.322635 40.9159 0.234375 41.2194 0.234375H44.5279L42.3425 5.50055L42.3729 5.52996L47.7757 0.587414C48.0489 0.352054 48.322 0.234375 48.6559 0.234375H53.998L45.3474 8.17779C45.3778 8.23663 45.5599 8.47198 45.8938 8.91323C46.0152 9.08974 46.1973 9.32516 46.4098 9.61935C46.6223 9.88408 46.8651 10.2372 47.1686 10.649C47.4721 11.0609 47.8061 11.5316 48.231 12.0906C48.6256 12.6496 49.1112 13.2674 49.6272 14.0029H44.7404L40.9463 8.825L39.2161 13.0026C39.0947 13.2968 38.9126 13.5322 38.6394 13.7087C38.3663 13.8852 38.0931 13.9735 37.7592 13.9735H34.4507L39.8232 1.17581ZM31.2333 5.50055C31.4154 5.50055 31.5672 5.41228 31.6279 5.23576L32.0529 4.20606H25.8305C25.6484 4.20606 25.4966 4.29433 25.4359 4.47085L25.0109 5.50055H31.2333ZM17.1191 13.9735L22.0364 2.26435C22.3095 1.64653 22.7041 1.14639 23.2504 0.793355C23.7968 0.440314 24.4342 0.234375 25.1323 0.234375H38.0627L33.1759 11.8847C32.9027 12.5025 32.5081 13.0026 31.9314 13.3851C31.3547 13.7676 30.7173 13.9441 30.0495 13.9441H27.9855L30.1709 8.70733H23.645L21.8238 13.0026C21.7024 13.2968 21.5203 13.5028 21.2471 13.6793C20.974 13.8558 20.7008 13.9441 20.3669 13.9441H17.1191V13.9735Z" fill="#202020" />
|
||||
<path d="M3.76377 5.00224L4.88684 2.2956C5.16002 1.67778 5.5546 1.17764 6.13131 0.824605C6.70802 0.442144 7.34546 0.265625 8.01317 0.265625H10.0772L8.49882 4.03137L6.49556 8.85627C6.43483 8.97395 6.37416 9.09162 6.31343 9.2093L5.19037 11.9159C4.91719 12.5337 4.5226 13.0339 3.94589 13.4164C3.36919 13.7988 2.73177 13.9753 2.064 13.9753H0L1.57835 10.2095L3.58165 5.3847C3.64236 5.23759 3.70307 5.11991 3.76377 5.00224Z" fill="#202020" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.9433 0C18.424 6.29586 12.9604 2.94199 8.68066 4.47183C9.92515 0.941437 12.1713 0.294199 14.6906 0.264779C16.5724 0.23536 19.2132 0.441299 20.9433 0Z" fill="#202020" />
|
||||
<path d="M87.4169 0.295045L82.5604 11.9159C82.2873 12.5338 81.8926 13.0339 81.3162 13.4163C80.7391 13.7988 80.1022 13.9753 79.4344 13.9753H77.3703L81.4372 4.23732H80.8306C80.5575 4.23732 80.2838 4.29615 80.0108 4.41384C79.7377 4.53152 79.5252 4.70804 79.3429 4.91398L71.6637 13.9753H66.4736L76.915 1.50126C77.2183 1.1188 77.6131 0.824601 78.0684 0.589244C78.5237 0.383304 79.0093 0.265625 79.5252 0.265625H87.4169V0.295045Z" fill="#202020" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.6633 4.55859C14.7207 9.38344 10.5623 6.70622 7.28418 7.88304C8.98398 3.05818 12.8692 5.52945 16.6633 4.55859Z" fill="#202020" />
|
||||
</g>
|
||||
<mask id="mask1_4006_20975" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="88" height="14">
|
||||
<path d="M87.4168 0H0V13.9745H87.4168V0Z" fill="white" />
|
||||
</mask>
|
||||
<g mask="url(#mask1_4006_20975)">
|
||||
<path d="M50.4164 13.9735C50.4164 13.9735 50.4771 13.797 50.6289 13.4733C50.7806 13.1203 50.9627 12.679 51.1752 12.12C51.4181 11.5611 51.6609 10.9432 51.9644 10.2372C52.268 9.53106 52.5715 8.79555 52.875 8.06005C53.1785 7.32461 53.4821 6.5891 53.7856 5.883C54.0891 5.17692 54.332 4.5591 54.5747 4.00012C54.8176 3.44115 54.9997 2.99985 55.1515 2.64681C55.3033 2.29377 55.3639 2.14667 55.3639 2.14667C55.6371 1.55827 56.0621 1.11698 56.6084 0.763936C57.1548 0.410894 57.7618 0.263795 58.3993 0.263795H71.3603L70.5405 2.17609C70.2674 2.79391 69.8726 3.29404 69.2963 3.64708C68.7192 4.02954 68.0817 4.20606 67.4138 4.20606H59.3402C58.976 4.20606 58.7028 4.38258 58.551 4.7062L58.2171 5.50055H65.107L64.1358 7.79531C64.0147 8.0895 63.8325 8.32485 63.5594 8.50136C63.2863 8.67788 63.0129 8.76617 62.679 8.76617H57.3976C57.0334 8.76617 56.7602 8.94268 56.6084 9.26632L56.2746 10.0607H67.171L66.3821 11.9435C66.109 12.5613 65.7143 13.0615 65.1379 13.4439C64.5609 13.8264 63.9233 14.0029 63.2554 14.0029H50.4164V13.9735ZM39.8232 1.17581C39.9446 0.881611 40.1268 0.675673 40.3695 0.499154C40.6124 0.322635 40.9159 0.234375 41.2194 0.234375H44.5279L42.3425 5.50055L42.3729 5.52996L47.7757 0.587414C48.0489 0.352054 48.322 0.234375 48.6559 0.234375H53.998L45.3474 8.17779C45.3778 8.23663 45.5599 8.47198 45.8938 8.91323C46.0152 9.08974 46.1973 9.32516 46.4098 9.61935C46.6223 9.88408 46.8651 10.2372 47.1686 10.649C47.4721 11.0609 47.8061 11.5316 48.231 12.0906C48.6256 12.6496 49.1112 13.2674 49.6272 14.0029H44.7404L40.9463 8.825L39.2161 13.0026C39.0947 13.2968 38.9126 13.5322 38.6394 13.7087C38.3663 13.8852 38.0931 13.9735 37.7592 13.9735H34.4507L39.8232 1.17581ZM31.2333 5.50055C31.4154 5.50055 31.5672 5.41228 31.6279 5.23576L32.0529 4.20606H25.8305C25.6484 4.20606 25.4966 4.29433 25.4359 4.47085L25.0109 5.50055H31.2333ZM17.1191 13.9735L22.0364 2.26435C22.3095 1.64653 22.7041 1.14639 23.2504 0.793355C23.7968 0.440314 24.4342 0.234375 25.1323 0.234375H38.0627L33.1759 11.8847C32.9027 12.5025 32.5081 13.0026 31.9314 13.3851C31.3547 13.7676 30.7173 13.9441 30.0495 13.9441H27.9855L30.1709 8.70733H23.645L21.8238 13.0026C21.7024 13.2968 21.5203 13.5028 21.2471 13.6793C20.974 13.8558 20.7008 13.9441 20.3669 13.9441H17.1191V13.9735Z" fill="white" />
|
||||
<path d="M3.76377 5.00224L4.88684 2.2956C5.16002 1.67778 5.5546 1.17764 6.13131 0.824605C6.70802 0.442144 7.34546 0.265625 8.01317 0.265625H10.0772L8.49882 4.03137L6.49556 8.85627C6.43483 8.97395 6.37416 9.09162 6.31343 9.2093L5.19037 11.9159C4.91719 12.5337 4.5226 13.0339 3.94589 13.4164C3.36919 13.7988 2.73177 13.9753 2.064 13.9753H0L1.57835 10.2095L3.58165 5.3847C3.64236 5.23759 3.70307 5.11991 3.76377 5.00224Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.9433 0C18.424 6.29586 12.9604 2.94199 8.68066 4.47183C9.92515 0.941437 12.1713 0.294199 14.6906 0.264779C16.5724 0.23536 19.2132 0.441299 20.9433 0Z" fill="white" />
|
||||
<path d="M87.4169 0.295045L82.5604 11.9159C82.2873 12.5338 81.8926 13.0339 81.3162 13.4163C80.7391 13.7988 80.1022 13.9753 79.4344 13.9753H77.3703L81.4372 4.23732H80.8306C80.5575 4.23732 80.2838 4.29615 80.0108 4.41384C79.7377 4.53152 79.5252 4.70804 79.3429 4.91398L71.6637 13.9753H66.4736L76.915 1.50126C77.2183 1.1188 77.6131 0.824601 78.0684 0.589244C78.5237 0.383304 79.0093 0.265625 79.5252 0.265625H87.4169V0.295045Z" fill="white" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.6633 4.55859C14.7207 9.38344 10.5623 6.70622 7.28418 7.88304C8.98398 3.05818 12.8692 5.52945 16.6633 4.55859Z" fill="white" />
|
||||
</g>
|
||||
<path d="M91.6425 2.55319C92.2265 1.17364 93.5792 0.277344 95.0776 0.277344H126.127L121.454 11.6066C120.878 13.0031 119.517 13.9143 118.006 13.9143H86.834L91.6425 2.55319Z" fill="white" />
|
||||
<path d="M102.747 6.79809L102.65 7.3806C102.463 8.4808 101.974 9.36167 101.183 10.0232C100.392 10.6776 99.4394 11.0048 98.325 11.0048C97.1596 11.0048 96.2572 10.6129 95.6177 9.82909C94.9777 9.03809 94.7544 8.08167 94.9486 6.95991C95.1359 5.85971 95.6499 4.95006 96.4912 4.23097C97.3324 3.51189 98.3105 3.15234 99.4249 3.15234C100.173 3.15234 100.813 3.31414 101.345 3.63773C101.884 3.95413 102.294 4.40356 102.575 4.98602L101.216 5.69792C100.834 4.96445 100.191 4.59771 99.2849 4.59771C98.5584 4.59771 97.9296 4.82782 97.3974 5.28804C96.8721 5.74106 96.5486 6.33432 96.4262 7.06775C96.2969 7.80123 96.4155 8.39806 96.7825 8.8583C97.1565 9.31853 97.7171 9.54865 98.465 9.54865C99.7017 9.54865 100.529 9.07044 100.946 8.11403H98.735L98.9613 6.79809H102.747Z" fill="#2B2C35" />
|
||||
<path d="M110.181 3.30078L106.966 7.50743L106.373 10.8512H104.895L105.489 7.48587L103.752 3.30078H105.338L106.395 6.08365L108.412 3.30078H110.181Z" fill="#2B2C35" />
|
||||
<path d="M118.288 3.30078L116.961 10.8512H115.483L116.347 5.94343L113.564 9.45974H113.391L111.935 5.90028L111.061 10.8512H109.572L110.899 3.30078H112.42L113.844 6.9142L116.649 3.30078H118.288Z" fill="#2B2C35" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4006_20975">
|
||||
<rect width="126.126" height="14" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<?php
|
||||
endif;
|
||||
?>
|
||||
<div class="mt-auto text-[24px] font-[600] leading-[125%] text-[#f8f8f8]">
|
||||
Другие профессионалы нашего клуба
|
||||
</div>
|
||||
|
||||
<a class="!no-underline hover:[&>svg]:translate-x-[6px] mt-[40px] bg-[#f8f8f8] max-w-[179px] rounded-[90px] px-[24px] h-[59px] flex items-center justify-center gap-[8px] font-[600] text-[18px] leading-[195%] text-[#222] " href="<?php echo get_post_type_archive_link('trainer'); ?>">
|
||||
Все тренеры
|
||||
<svg class="transition" width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.4876 2.17896C6.73011 1.94034 7.12396 1.94035 7.36649 2.17896L11.3181 6.06809C11.5606 6.30671 11.5606 6.69329 11.3181 6.93191L7.36649 10.821C7.12396 11.0596 6.73011 11.0597 6.4876 10.821C6.24512 10.5824 6.24511 10.1949 6.4876 9.95626L9.38032 7.11093H1.1209C0.777923 7.11093 0.5 6.83747 0.5 6.5C0.5 6.16253 0.777923 5.88907 1.1209 5.88907H9.38032L6.4876 3.04374C6.24511 2.80512 6.24512 2.41758 6.4876 2.17896Z" fill="#222222" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<button class="group custom-prev-<?php echo esc_attr($block_id); ?> cursor-pointer">
|
||||
<?php display_icon('slider-prev') ?>
|
||||
</button>
|
||||
<button class="group custom-next-<?php echo esc_attr($block_id); ?> cursor-pointer">
|
||||
<?php display_icon('slider-next') ?>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const swiperContainer = document.querySelector('#<?php echo esc_attr($block_id); ?>-swiper');
|
||||
|
||||
if (swiperContainer && typeof Swiper !== 'undefined') {
|
||||
new Swiper('#<?php echo esc_attr($block_id); ?>-swiper', {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 24,
|
||||
grabCursor: true,
|
||||
freeMode: true,
|
||||
navigation: {
|
||||
nextEl: '.custom-next-<?php echo esc_attr($block_id); ?>',
|
||||
prevEl: '.custom-prev-<?php echo esc_attr($block_id); ?>',
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,168 @@
|
||||
<?php
|
||||
/**
|
||||
* Блок с тренерами
|
||||
*/
|
||||
|
||||
// Получение полей ACF
|
||||
$block_id = 'training-block-' . $block['id'];
|
||||
$class_name = 'training-block';
|
||||
if (!empty($block['className'])) {
|
||||
$class_name .= ' ' . $block['className'];
|
||||
}
|
||||
if (!empty($block['align'])) {
|
||||
$class_name .= ' align' . $block['align'];
|
||||
}
|
||||
|
||||
if (!function_exists('get_trainings_for_current_language')) {
|
||||
function get_trainings_for_current_language()
|
||||
{
|
||||
$current_lang = pll_current_language();
|
||||
|
||||
$args = array(
|
||||
'post_type' => 'training',
|
||||
'posts_per_page' => -1,
|
||||
'lang' => $current_lang,
|
||||
'post_status' => 'publish',
|
||||
'sort' => 'menu_order',
|
||||
'order' => 'ASC',
|
||||
);
|
||||
|
||||
return get_posts($args);
|
||||
}
|
||||
}
|
||||
|
||||
$trainings = get_trainings_for_current_language();
|
||||
|
||||
// Получаем все поля short_info для каждого тренера
|
||||
$trainings_data = array();
|
||||
if ($trainings) {
|
||||
foreach ($trainings as $training) {
|
||||
$training_info = array(
|
||||
'post' => $training,
|
||||
'name' => '',
|
||||
'exp' => '',
|
||||
'short_desc' => ''
|
||||
);
|
||||
|
||||
if (have_rows('short_info', $training->ID)) {
|
||||
while (have_rows('short_info', $training->ID)) {
|
||||
the_row();
|
||||
$training_info['name'] = get_sub_field('name');
|
||||
$training_info['exp'] = get_sub_field('exp');
|
||||
$training_info['short_desc'] = get_sub_field('short_desc');
|
||||
}
|
||||
}
|
||||
|
||||
$trainings_data[] = $training_info;
|
||||
}
|
||||
}
|
||||
|
||||
$heading = get_field('heading', $block['id']);
|
||||
|
||||
$room = get_current_room();
|
||||
|
||||
if ($room === 'fitness') {
|
||||
$section_classes = 'radial-gradient';
|
||||
$style_attr = '';
|
||||
} else {
|
||||
$section_classes = 'bg-cover bg-center bg-no-repeat';
|
||||
$bg_image = get_template_directory_uri() . '/assets/images/hero-bg.png';
|
||||
$style_attr = 'style="background-image: url(' . esc_url($bg_image) . ')"';
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<section id="<?php echo esc_attr($block_id); ?>"
|
||||
class="py-[96px] <?php echo esc_attr($section_classes); ?>" <?php echo $style_attr; ?>>
|
||||
<div class="container mx-auto">
|
||||
<?php if ($trainings_data): ?>
|
||||
<?php if (is_front_page()): ?>
|
||||
<div class="flex gap-[16px] justify-between">
|
||||
<h2 class="dark:text-[#F8F8F8] text-[40px] leading-[120%] font-[500] max-w-[760px] w-full">
|
||||
<?php
|
||||
echo $heading;
|
||||
?>
|
||||
</h2>
|
||||
<a class="!no-underline dark:text-[#F8F8F8] dark:max-w-[860px] dark:border-[#574348] flex mt-auto gap-[8px] border border-[#E0E0E0] hover:[&>svg]:translate-x-[6px] rounded-[90px] px-[32px] h-[59px] flex items-center justify-center text-[18px] font-[600] leading-[195%] text-[#222]"
|
||||
href="<?php echo get_post_type_archive_link('training'); ?>">
|
||||
Все тренировки
|
||||
|
||||
|
||||
<svg class="transition fill-[#222222] dark:fill-[#F8F8F8]" width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6.4876 2.17896C6.73011 1.94034 7.12396 1.94035 7.36649 2.17896L11.3181 6.06809C11.5606 6.30671 11.5606 6.69329 11.3181 6.93191L7.36649 10.821C7.12396 11.0596 6.73011 11.0597 6.4876 10.821C6.24512 10.5824 6.24511 10.1949 6.4876 9.95626L9.38032 7.11093H1.1209C0.777923 7.11093 0.5 6.83747 0.5 6.5C0.5 6.16253 0.777923 5.88907 1.1209 5.88907H9.38032L6.4876 3.04374C6.24511 2.80512 6.24512 2.41758 6.4876 2.17896Z"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="mt-[40px] flex flex-col">
|
||||
|
||||
<div class="swiper rounded-[20px] rounded-b-[0]" id="<?php echo esc_attr($block_id); ?>-swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<?php foreach ($trainings_data as $training_data): ?>
|
||||
<?php $training = $training_data['post']; ?>
|
||||
<div class="h-[540px] max-w-[312px] swiper-slide">
|
||||
<div class="flex flex-col bg-[#f8f8f8] relative h-[540px] rounded-[20px] overflow-hidden shadow-[0_2px_32px_0_rgba(16,_15,_15,_0.03)]">
|
||||
<?php $photo_images = get_field('photo', $training->ID); ?>
|
||||
<?php if ($photo_images && !empty($photo_images[0])): ?>
|
||||
<div class="overflow-hidden min-h-[260px]">
|
||||
<img src="<?php echo esc_url($photo_images[0]['url']); ?>"
|
||||
alt="<?php echo esc_attr($photo_images[0]['alt']); ?>"
|
||||
loading="lazy"
|
||||
class="w-full h-full object-cover"/>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="flex flex-col gap-[24px] h-full p-[24px]">
|
||||
<?php $name = $training_data['name']; ?>
|
||||
<?php if ($name): ?>
|
||||
<div class="text-[24px] leading-[125%] font-[600]">
|
||||
<?php echo esc_html($name); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php $short_desc = $training_data['short_desc']; ?>
|
||||
<?php if ($short_desc): ?>
|
||||
<div class="text-[16px] leading-[145%] font-[500] text-[#222]">
|
||||
<?php echo wp_kses_post($short_desc); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<a href="<?php echo get_permalink($training->ID); ?>" class="!no-underline mt-auto h-[59px] flex grey-gradient-hover w-full rounded-[90px] px-[12px] text-[18px] font-[600] leading-[195%] text-[#f8f8f8] bg-[0_2px_32px_0_rgba(16,_15,_15,_0.03)] items-center justify-center">
|
||||
Перейти
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiper-scrollbar [&_.swiper-scrollbar-drag]:dark:!bg-[#989597] !static !mx-auto !cursor-grab container mt-[44px] !w-full !p-0" id="swiper-scrollbar-<?php echo esc_attr($block_id); ?>"></div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const swiperContainer = document.querySelector('#<?php echo esc_attr($block_id); ?>-swiper');
|
||||
|
||||
if (swiperContainer && typeof Swiper !== 'undefined') {
|
||||
new Swiper('#<?php echo esc_attr($block_id); ?>-swiper', {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 24,
|
||||
grabCursor: true,
|
||||
freeMode: true,
|
||||
navigation: {
|
||||
nextEl: '.custom-next-<?php echo esc_attr($block_id); ?>',
|
||||
prevEl: '.custom-prev-<?php echo esc_attr($block_id); ?>',
|
||||
},
|
||||
scrollbar: {
|
||||
el: `#swiper-scrollbar-<?php echo esc_attr($block_id); ?>`,
|
||||
draggable: true,
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -1,27 +1,204 @@
|
||||
<?php
|
||||
//test
|
||||
?>
|
||||
<div class="bg-black text-white mt-[24px]">
|
||||
<div class="mx-auto container">
|
||||
<div>
|
||||
Время работы:
|
||||
<?php
|
||||
<div class="text-white relative min-h-[330px] bg-[linear-gradient(180deg,_#f9f9f9_69.59%,_#ededed_100%)] dark:bg-none dark:bg-[#141419]">
|
||||
<?php if (get_current_room() === 'gym'): ?>
|
||||
|
||||
$work_time = get_field('work_time', 'option');
|
||||
echo $work_time[get_current_room()];
|
||||
?>
|
||||
</div>
|
||||
<div class="flex w-full justify-between">
|
||||
<div>© 2025 fakelgym.ru. Все права защищены.</div>
|
||||
<div><a href="#">Политика Конфиденциальности</a></div>
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="13" viewBox="0 0 22 13" fill="none">
|
||||
<path
|
||||
d="M20.504 12.3814H18.222C17.359 12.3814 17.099 11.6824 15.552 10.1344C14.2 8.83144 13.629 8.66943 13.287 8.66943C12.814 8.66943 12.685 8.79943 12.685 9.45043V11.5024C12.685 12.0574 12.505 12.3824 11.055 12.3824C9.64829 12.2879 8.28416 11.8606 7.07497 11.1356C5.86578 10.4106 4.84612 9.4087 4.1 8.21243C2.32901 6.00706 1.09641 3.41928 0.5 0.654435C0.5 0.312435 0.63 0.00243485 1.282 0.00243485H3.562C4.148 0.00243485 4.359 0.263435 4.589 0.866435C5.696 4.12443 7.585 6.95844 8.352 6.95844C8.646 6.95844 8.774 6.82843 8.774 6.09544V2.73944C8.677 1.20844 7.864 1.07944 7.864 0.525435C7.87428 0.379276 7.94114 0.242883 8.05037 0.145228C8.15961 0.0475726 8.30261 -0.00365196 8.449 0.00243485H12.033C12.523 0.00243485 12.685 0.246435 12.685 0.832435V5.36244C12.685 5.85144 12.895 6.01343 13.043 6.01343C13.337 6.01343 13.563 5.85143 14.102 5.31343C15.2569 3.90409 16.2008 2.33435 16.904 0.653435C16.9756 0.451399 17.1116 0.278427 17.2909 0.161024C17.4703 0.0436209 17.6832 -0.0117363 17.897 0.00343477H20.178C20.862 0.00343477 21.007 0.345435 20.862 0.833435C20.0321 2.69173 19.0056 4.45579 17.8 6.09544C17.554 6.47044 17.456 6.66543 17.8 7.10543C18.026 7.44743 18.826 8.11543 19.363 8.75043C20.145 9.53043 20.794 10.4324 21.285 11.4204C21.481 12.0564 21.155 12.3814 20.504 12.3814Z"
|
||||
fill="white"/>
|
||||
</svg>
|
||||
<svg class="absolute right-0 top-0 z-[0] pointer-events-none" width="621" height="330" viewBox="0 0 621 330"
|
||||
fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.04" clip-path="url(#clip0_4018_16537)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M621 -0.00390625C506.463 285.064 258.06 133.205 63.4795 202.474C120.06 42.623 222.18 13.317 336.721 11.9849C422.28 10.6528 542.342 19.9775 621 -0.00390625Z" fill="#F8F8F8" />
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M426.423 206.469C338.102 424.931 149.041 303.71 0 356.995C77.2817 138.532 253.922 250.428 426.423 206.469Z" fill="#F8F8F8" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4018_16537">
|
||||
<rect width="621" height="357" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<?php else: ?>
|
||||
<svg class="absolute right-0 top-0 z-[0] pointer-events-none" width="621" height="330" viewBox="0 0 621 330"
|
||||
fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.02" clip-path="url(#clip0_2190_3228)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M621 -13.0039C506.463 272.064 258.06 120.205 63.4795 189.474C120.06 29.623 222.18 0.317019 336.721 -1.01508C422.28 -2.34716 542.342 6.97748 621 -13.0039Z"
|
||||
fill="#222222"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||||
d="M426.423 193.469C338.102 411.931 149.041 290.71 0 343.995C77.2817 125.532 253.922 237.428 426.423 193.469Z"
|
||||
fill="#222222"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3228">
|
||||
<rect width="621" height="357" fill="white" transform="translate(0 -13)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
<?php endif; ?>
|
||||
<div class="mx-auto container">
|
||||
|
||||
<div class="flex pt-[48px] pb-[24px] justify-between">
|
||||
<div>
|
||||
<a href="<?php echo esc_url(home_url('/')); ?>">
|
||||
<?php display_icon(get_current_room() === 'gym' ? 'dark_logo' : 'light_logo'); ?>
|
||||
</a>
|
||||
<div class="mt-[12px]"> <?php get_template_part('template-parts/la-components/language-switcher'); ?></div>
|
||||
<button data-modal="time"
|
||||
class="mt-[24px] text-[#222] dark:text-[#f8f8f8] dark:border-[rgba(248,_248,_248,_0.2)] font-[600] flex gap-[8px] h-[44px] px-[20px] items-center cursor-pointer border border-[#e0e0e0] rounded-[90px]"
|
||||
>
|
||||
<span class="dark:bg-[#f8f8f8] w-[8px] h-[8px] rounded-full bg-[#e21e24]"></span>
|
||||
Расписание
|
||||
</button>
|
||||
<div class="mt-[24px] text-[#222] dark:text-[#f8f8f8] text-[14px] leading-[125%] font-[600]">
|
||||
<?php
|
||||
|
||||
$work_time = get_field('work_time', 'option');
|
||||
echo $work_time[get_current_room()];
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="flex w-full max-w-[424px] flex-wrap gap-y-[16px] gap-x-[40px]"> <?php
|
||||
$menu_items = get_simple_menu_items();
|
||||
foreach ($menu_items as $item):
|
||||
?>
|
||||
<a class="!no-underline text-[#222] dark:text-[#f8f8f8] dark:hover:text-[#c7c7c7] hover:text-[#555] hover:text-[#555] font-[600] leading-[125%] text-[16px]"
|
||||
href="<?php echo esc_url($item['url']); ?>">
|
||||
<?php echo esc_html($item['title']); ?>
|
||||
</a>
|
||||
<?php endforeach; ?></div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col items-end">
|
||||
<button
|
||||
class="font-[600] dark:text-[#222] text-[#f8f8f8] dark-gradient-hover dark:!bg-none dark:!bg-[#f8f8f8] flex gap-[8px] h-[44px] px-[20px] items-center cursor-pointer rounded-[90px]"
|
||||
>
|
||||
<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path class="dark:fill-[#222222] fill-[#f8f8f8]" d="M8 0.5C9.06087 0.5 10.0783 0.921427 10.8284 1.67157C11.5786 2.42172 12 3.43913 12 4.5C12 5.56087 11.5786 6.57828 10.8284 7.32843C10.0783 8.07857 9.06087 8.5 8 8.5C6.93913 8.5 5.92172 8.07857 5.17157 7.32843C4.42143 6.57828 4 5.56087 4 4.5C4 3.43913 4.42143 2.42172 5.17157 1.67157C5.92172 0.921427 6.93913 0.5 8 0.5ZM8 10.5C12.42 10.5 16 12.29 16 14.5V16.5H0V14.5C0 12.29 3.58 10.5 8 10.5Z"
|
||||
/>
|
||||
</svg>
|
||||
Личный кабинет
|
||||
</button>
|
||||
|
||||
|
||||
<div class="mt-[24px] flex items-center gap-[12px] text-[#222] dark:text-[#f8f8f8]">
|
||||
<div class="leading-[145%] inline-flex text-[16px] font-[600]">
|
||||
<p>г. Томск, </p>
|
||||
<p>ул. Красноармейская, 120</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-[12px]">
|
||||
<a class="font-[700] dark:hover:text-[#c7c7c7] hover:text-[#555] text-[24px] leading-[125%] !decoration-transparent text-[#222] dark:text-[#f8f8f8] transition-colors"
|
||||
href="tel:+783822990019">
|
||||
+7 (3822) 99-00-19
|
||||
</a>
|
||||
</div>
|
||||
<div class="mt-[12px] flex gap-[4px]">
|
||||
<a class="dark:hover:[&>img]:brightness-90 hover:[&>img]:brightness-150 transition" href="#">
|
||||
<?php display_icon(get_current_room() === 'gym' ? 'tg_dark' : 'tg'); ?>
|
||||
</a>
|
||||
<a class="dark:hover:[&>img]:brightness-90 hover:[&>img]:brightness-150 transition" href="#">
|
||||
<?php display_icon(get_current_room() === 'gym' ? 'whatsapp_dark' : 'whatsapp'); ?>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-[#222] dark:text-[#f8f8f8] font-[500] text-[14px] leading-[125%] grid grid-cols-3 pt-[16px] pb-[16px] border-t border-[#e0e0e0]">
|
||||
<div class="flex items-center">© 2025 fakelgym.ru. Все права защищены.</div>
|
||||
<div class="flex items-center justify-center">
|
||||
<a class="hover:!no-underline skip-ink" href="/policy" target="_blank">
|
||||
Политика Конфиденциальности
|
||||
</a>
|
||||
</div>
|
||||
<div class="flex items-center justify-end">
|
||||
<a href="https://vk.ru/fakelgym" target="_blank">
|
||||
|
||||
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 18C0 8.05888 8.05888 0 18 0C27.9411 0 36 8.05888 36 18C36 27.9411 27.9411 36 18 36C8.05888 36 0 27.9411 0 18Z"
|
||||
fill="white"/>
|
||||
<g clip-path="url(#clip0_2190_3227)">
|
||||
<path d="M27.1299 24.0993H24.9401C24.1119 24.0993 23.8624 23.4286 22.3779 21.9431C21.0805 20.6927 20.5325 20.5372 20.2043 20.5372C19.7504 20.5372 19.6266 20.662 19.6266 21.2867V23.2558C19.6266 23.7884 19.4539 24.1003 18.0624 24.1003C16.7125 24.0096 15.4035 23.5995 14.2431 22.9038C13.0827 22.2081 12.1042 21.2466 11.3882 20.0987C9.68876 17.9823 8.50592 15.499 7.93359 12.8458C7.93359 12.5176 8.05835 12.2201 8.68402 12.2201H10.872C11.4343 12.2201 11.6368 12.4706 11.8575 13.0493C12.9198 16.1757 14.7325 18.8953 15.4686 18.8953C15.7507 18.8953 15.8735 18.7705 15.8735 18.0671V14.8466C15.7804 13.3775 15.0003 13.2537 15.0003 12.722C15.0101 12.5818 15.0743 12.4509 15.1791 12.3572C15.2839 12.2635 15.4212 12.2143 15.5617 12.2201H19.0009C19.4712 12.2201 19.6266 12.4543 19.6266 13.0166V17.3637C19.6266 17.833 19.8281 17.9885 19.9702 17.9885C20.2523 17.9885 20.4692 17.833 20.9864 17.3167C22.0947 15.9643 23.0004 14.4579 23.6753 12.8449C23.744 12.651 23.8745 12.485 24.0466 12.3723C24.2187 12.2597 24.423 12.2066 24.6282 12.2211H26.8171C27.4735 12.2211 27.6126 12.5493 27.4735 13.0176C26.6771 14.8009 25.692 16.4937 24.5351 18.0671C24.299 18.427 24.205 18.6141 24.5351 19.0364C24.752 19.3646 25.5197 20.0056 26.035 20.6149C26.7854 21.3635 27.4082 22.229 27.8794 23.1771C28.0675 23.7875 27.7546 24.0993 27.1299 24.0993Z"
|
||||
fill="#222222"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3227">
|
||||
<rect width="20" height="20" fill="white" transform="translate(8 8)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container mx-auto">
|
||||
<div class="min-h-[48px] flex items-center justify-center">
|
||||
<a class="!no-underline flex items-center gap-[12px]" href="https://ledoffsky.agency/"
|
||||
target="_blank">
|
||||
<span class="text-[14px] leading-[125%] text-[#6c6b6b]">Разработка и продвижение</span>
|
||||
|
||||
<svg width="145" height="24" viewBox="0 0 145 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2190_3233)">
|
||||
<mask id="mask0_2190_3233" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0"
|
||||
width="145" height="24">
|
||||
<path d="M144.603 0H0.5V23.8984H144.603V0Z" fill="white"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_2190_3233)">
|
||||
<path d="M3.95039 5.97656H10.8478L7.39741 11.9504L10.8478 17.9241H3.95039L0.5 11.9504L3.95039 5.97656Z"
|
||||
fill="black"/>
|
||||
<path d="M7.39648 0H14.2972L21.1947 11.9509L14.2972 23.8984H7.39648L14.2972 11.9509L7.39648 0Z"
|
||||
fill="black"/>
|
||||
<path d="M17.7483 5.97266L21.1954 11.9498H14.2979L17.7483 5.97266Z" fill="black"/>
|
||||
<path d="M14.2976 11.9498L10.8477 5.97266H17.748L14.2976 11.9498Z" fill="black"/>
|
||||
<path d="M3.95039 5.97266L7.39741 11.9499H0.5L3.95039 5.97266Z" fill="black"/>
|
||||
<path d="M14.2976 11.9492L17.7485 17.9229L10.8477 17.923L14.2976 11.9492Z" fill="black"/>
|
||||
<path d="M7.39722 11.9492L10.8476 17.9229H3.9502L7.39722 11.9492Z" fill="black"/>
|
||||
<path d="M14.2976 0L10.8477 5.97371H17.748L14.2976 0Z" fill="black"/>
|
||||
<path d="M10.8473 5.97371L7.39648 0H14.2972L10.8473 5.97371Z" fill="black"/>
|
||||
<path d="M17.7488 17.9229L21.1954 11.9492H14.2979L17.7488 17.9229Z" fill="black"/>
|
||||
<path d="M7.39722 11.9504L10.8476 5.97656H3.9502L7.39722 11.9504Z" fill="black"/>
|
||||
<path d="M3.95039 17.9229L7.39741 11.9492H0.5L3.95039 17.9229Z" fill="black"/>
|
||||
<path d="M14.2976 23.8996L10.8477 17.9259L17.7485 17.9258L14.2976 23.8996Z" fill="black"/>
|
||||
<path d="M10.8473 17.9258L7.39648 23.8995H14.2972L10.8473 17.9258Z" fill="black"/>
|
||||
<path d="M138.663 17.9567H137.853V16.5917H138.528C139.308 16.5917 139.638 16.5317 139.998 15.4817L140.088 15.2867L137.163 7.26172H139.113L140.943 13.0517L142.773 7.26172H144.603L141.768 15.3167C141.003 17.4017 140.478 17.9567 138.663 17.9567Z"
|
||||
fill="black"/>
|
||||
<path d="M133.253 7.08203C135.023 7.08203 136.553 8.23703 136.868 10.0221H135.128C134.963 9.16703 134.228 8.56703 133.253 8.56703C132.128 8.56703 131.138 9.39203 131.138 11.2971C131.138 13.2171 132.158 14.0421 133.208 14.0421C134.093 14.0421 134.948 13.6521 135.188 12.5721H136.928C136.568 14.4621 134.903 15.5271 133.178 15.5271C130.838 15.5271 129.293 13.7121 129.293 11.3121C129.293 8.91203 130.838 7.08203 133.253 7.08203Z"
|
||||
fill="black"/>
|
||||
<path d="M122.8 7.26203V8.38703C123.265 7.54703 124.105 7.08203 125.245 7.08203C127.195 7.08203 127.99 8.34203 127.99 10.2621V15.3321H126.205V10.6971C126.205 9.60203 126.055 8.53703 124.675 8.53703C123.295 8.53703 122.8 9.58703 122.8 11.0421V15.3321H121.015V7.26203H122.8Z"
|
||||
fill="black"/>
|
||||
<path d="M119.545 11.8071H113.53C113.65 13.3071 114.7 14.0421 115.72 14.0421C116.665 14.0421 117.385 13.6821 117.7 12.9171H119.455C119.095 14.2071 117.865 15.5271 115.795 15.5271C113.2 15.5271 111.715 13.5621 111.715 11.2371C111.715 8.80703 113.38 7.08203 115.675 7.08203C118.15 7.08203 119.71 9.10703 119.545 11.8071ZM115.675 8.47703C114.835 8.47703 113.695 8.98703 113.53 10.5021H117.73C117.685 9.24203 116.725 8.47703 115.675 8.47703Z"
|
||||
fill="black"/>
|
||||
<path d="M108.47 8.34203V7.26203H110.255V14.5221C110.255 15.8271 109.925 16.7721 109.28 17.3721C108.635 17.9721 107.675 18.2421 106.415 18.2421C104.645 18.2421 103.25 17.5371 102.965 15.7671H104.735C104.9 16.5321 105.38 16.8321 106.46 16.8321C107.255 16.8321 107.765 16.6071 108.065 16.2471C108.365 15.9021 108.47 15.4071 108.47 14.8821V13.9371C107.99 14.7321 107.15 15.1971 106.07 15.1971C104.15 15.1971 102.56 13.6521 102.56 11.1321C102.56 8.61203 104.15 7.08203 106.07 7.08203C107.15 7.08203 107.99 7.54703 108.47 8.34203ZM108.545 11.1321C108.545 9.33203 107.615 8.50703 106.46 8.50703C105.26 8.50703 104.42 9.51203 104.42 11.1321C104.42 12.7971 105.26 13.7871 106.46 13.7871C107.615 13.7871 108.545 12.9471 108.545 11.1321Z"
|
||||
fill="black"/>
|
||||
<path d="M99.5697 12.1535V11.5385C97.0197 11.7785 95.9847 12.1535 95.9847 13.0685C95.9847 13.7735 96.5697 14.1935 97.4697 14.1935C98.7897 14.1935 99.5697 13.5335 99.5697 12.1535ZM97.0797 15.5285C95.3247 15.5285 94.0947 14.5835 94.0947 13.1135C94.0947 11.0885 96.5847 10.6085 99.5247 10.2935V10.1435C99.5247 8.76344 98.7447 8.34344 97.8447 8.34344C96.9447 8.34344 96.2697 8.82344 96.2247 9.79844H94.4697C94.5897 8.16344 95.9547 7.02344 97.9047 7.02344C99.8397 7.02344 101.355 7.90844 101.31 10.4885C101.31 10.8785 101.28 11.8385 101.28 12.5735C101.28 13.5935 101.355 14.6585 101.52 15.3335H99.8847C99.8247 14.9885 99.7797 14.7935 99.7347 14.2385C99.2097 15.1235 98.2797 15.5285 97.0797 15.5285Z"
|
||||
fill="black"/>
|
||||
<path d="M92.7861 15.333H90.7461V13.293H92.7861V15.333Z" fill="black"/>
|
||||
<path d="M85.3721 17.9567H84.5621V16.5917H85.2371C86.0171 16.5917 86.3471 16.5317 86.7071 15.4817L86.7971 15.2867L83.8721 7.26172H85.8221L87.6521 13.0517L89.4821 7.26172H91.3121L88.4771 15.3167C87.7121 17.4017 87.1871 17.9567 85.3721 17.9567Z"
|
||||
fill="black"/>
|
||||
<path d="M76.7764 4.45703H78.5614V10.5021L81.5464 7.26203H83.6914L80.6014 10.5771L84.0364 15.3321H81.9514L79.4164 11.8371L78.5614 12.7521V15.3321H76.7764V4.45703Z"
|
||||
fill="black"/>
|
||||
<path d="M75.1664 9.46703H73.4864C73.2914 8.73203 72.6164 8.44703 71.7164 8.44703C70.9364 8.44703 70.2164 8.79203 70.2164 9.33203C70.2164 9.87203 70.5914 10.1571 71.2964 10.2921L72.4364 10.5171C74.0714 10.8321 75.3164 11.3421 75.3164 12.9171C75.3164 14.5971 73.7264 15.5271 71.8964 15.5271C69.9164 15.5271 68.5964 14.3871 68.4014 12.8721H70.1414C70.3064 13.7121 70.8914 14.1771 71.9564 14.1771C72.9014 14.1771 73.5764 13.7871 73.5764 13.1271C73.5764 12.4671 72.9764 12.1821 72.1814 12.0171L70.9664 11.7771C69.6014 11.4921 68.5364 10.9071 68.5364 9.42203C68.5364 7.99703 70.0814 7.08203 71.8214 7.08203C73.3964 7.08203 74.8364 7.84703 75.1664 9.46703Z"
|
||||
fill="black"/>
|
||||
<path d="M64.3896 7.26203V6.76703C64.3896 4.89203 65.0946 4.45703 67.0596 4.45703H67.7646V5.82203H67.2546C66.3696 5.82203 66.1746 5.98703 66.1746 6.82703V7.26203H67.7646V8.55203H66.1746V15.3321H64.3896V8.55203H63.2646V7.26203H64.3896Z"
|
||||
fill="black"/>
|
||||
<path d="M59.541 7.26203V6.76703C59.541 4.89203 60.246 4.45703 62.211 4.45703H62.916V5.82203H62.406C61.521 5.82203 61.326 5.98703 61.326 6.82703V7.26203H62.916V8.55203H61.326V15.3321H59.541V8.55203H58.416V7.26203H59.541Z"
|
||||
fill="black"/>
|
||||
<path d="M51.6555 11.3121C51.6555 13.1721 52.6455 14.0721 53.7855 14.0721C54.9255 14.0721 55.9155 13.1721 55.9155 11.3121C55.9155 9.45203 54.9255 8.53703 53.7855 8.53703C52.6455 8.53703 51.6555 9.45203 51.6555 11.3121ZM53.7855 7.08203C55.7505 7.08203 57.7605 8.40203 57.7605 11.3121C57.7605 14.2371 55.7505 15.5271 53.7855 15.5271C51.8205 15.5271 49.8105 14.2371 49.8105 11.3121C49.8105 8.40203 51.8205 7.08203 53.7855 7.08203Z"
|
||||
fill="black"/>
|
||||
<path d="M46.5506 8.34203V4.45703H48.3356V15.3321H46.5506V14.2671C46.0706 15.0621 45.2306 15.5271 44.1506 15.5271C42.2306 15.5271 40.6406 13.8921 40.6406 11.2971C40.6406 8.71703 42.2306 7.08203 44.1506 7.08203C45.2306 7.08203 46.0706 7.54703 46.5506 8.34203ZM46.6256 11.2971C46.6256 9.43703 45.6956 8.53703 44.5406 8.53703C43.3406 8.53703 42.5006 9.61703 42.5006 11.2971C42.5006 13.0221 43.3406 14.0721 44.5406 14.0721C45.6956 14.0721 46.6256 13.1571 46.6256 11.2971Z"
|
||||
fill="black"/>
|
||||
<path d="M39.6376 11.8071H33.6226C33.7426 13.3071 34.7926 14.0421 35.8126 14.0421C36.7576 14.0421 37.4776 13.6821 37.7926 12.9171H39.5476C39.1876 14.2071 37.9576 15.5271 35.8876 15.5271C33.2926 15.5271 31.8076 13.5621 31.8076 11.2371C31.8076 8.80703 33.4726 7.08203 35.7676 7.08203C38.2426 7.08203 39.8026 9.10703 39.6376 11.8071ZM35.7676 8.47703C34.9276 8.47703 33.7876 8.98703 33.6226 10.5021H37.8226C37.7776 9.24203 36.8176 8.47703 35.7676 8.47703Z"
|
||||
fill="black"/>
|
||||
<path d="M30.3387 4.45703V15.3321H28.5537V4.45703H30.3387Z" fill="black"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2190_3233">
|
||||
<rect width="145" height="24" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</a></div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -61,7 +61,7 @@ function register_acf_blocks() {
|
||||
acf_register_block_type(array(
|
||||
'name' => 'club-cards-block',
|
||||
'title' => __('Блок с клубными картами'),
|
||||
'description' => __('Блок с клубными картами для текущего языка'),
|
||||
'description' => __('Блок с клубными картами для текущего зала'),
|
||||
'render_template' => 'template-parts/la-components/blocks/club-cards-block/club-cards-block.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'id-alt',
|
||||
@@ -73,6 +73,36 @@ function register_acf_blocks() {
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'trainer-block',
|
||||
'title' => __('Блок с тренерами'),
|
||||
'description' => __('Блок с тренерами для текущего зала'),
|
||||
'render_template' => 'template-parts/la-components/blocks/trainers-block/trainer-block.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'id-alt',
|
||||
'keywords' => array('тренеры', 'тренер', 'trainers'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'training-block',
|
||||
'title' => __('Блок с тренировками'),
|
||||
'description' => __('Блок с тренировками для текущего зала'),
|
||||
'render_template' => 'template-parts/la-components/blocks/training-block/training-block.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'id-alt',
|
||||
'keywords' => array('тренировки', 'тренеровка', 'trainings'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'form-block',
|
||||
'title' => __('Блок формы'),
|
||||
@@ -93,6 +123,13 @@ function register_acf_blocks() {
|
||||
[],
|
||||
'1.0.0'
|
||||
);
|
||||
wp_enqueue_script(
|
||||
'form-block-js',
|
||||
get_template_directory_uri() . '/template-parts/la-components/blocks/form-block/form-block.js',
|
||||
['jquery'],
|
||||
'1.0.0',
|
||||
true
|
||||
);
|
||||
}
|
||||
));
|
||||
|
||||
@@ -111,6 +148,51 @@ function register_acf_blocks() {
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'line-block',
|
||||
'title' => __('Блок преимуществ в линию'),
|
||||
'description' => __('Блок преимуществ в линию'),
|
||||
'render_template' => 'template-parts/la-components/blocks/line-block/line-block.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'grid-view',
|
||||
'keywords' => array('плитки', 'преимущества', 'line', 'линия'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'masonry-tiles-block',
|
||||
'title' => __('Блок с высокой первой плиткой'),
|
||||
'description' => __('Блок с высокой первой плиткой'),
|
||||
'render_template' => 'template-parts/la-components/blocks/masonry-tiles-1/masonry-tiles-1.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'grid-view',
|
||||
'keywords' => array('плитки', 'карточки', 'tiles', 'cards'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'masonry-wide-tiles-block',
|
||||
'title' => __('Блок с широкой последней плиткой'),
|
||||
'description' => __('Блок с широкой последней плиткой'),
|
||||
'render_template' => 'template-parts/la-components/blocks/masonry-tiles-2/masonry-tiles-2.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'grid-view',
|
||||
'keywords' => array('плитки', 'карточки', 'tiles', 'cards'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
));
|
||||
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'advantages-block',
|
||||
@@ -148,6 +230,28 @@ function register_acf_blocks() {
|
||||
'1.0.0',
|
||||
true
|
||||
);
|
||||
wp_enqueue_style(
|
||||
'glightbox-css',
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.2.0/css/glightbox.min.css',
|
||||
[],
|
||||
'3.2.0'
|
||||
);
|
||||
|
||||
wp_enqueue_script(
|
||||
'glightbox-js',
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.2.0/js/glightbox.min.js',
|
||||
[],
|
||||
'3.2.0',
|
||||
true
|
||||
);
|
||||
|
||||
wp_enqueue_style(
|
||||
'reviews-block-css',
|
||||
get_template_directory_uri() . '/template-parts/la-components/blocks/reviews-block/reviews-block.css',
|
||||
[],
|
||||
'1.0.0'
|
||||
);
|
||||
|
||||
}
|
||||
));
|
||||
|
||||
@@ -182,6 +286,12 @@ function register_acf_blocks() {
|
||||
true
|
||||
);
|
||||
|
||||
wp_enqueue_style(
|
||||
'gallery-block-css',
|
||||
get_template_directory_uri() . '/template-parts/la-components/blocks/gallery-tabs/gallery-tabs.css',
|
||||
[],
|
||||
'1.0.0'
|
||||
);
|
||||
|
||||
wp_enqueue_script(
|
||||
'gallery-tabs-js',
|
||||
@@ -192,6 +302,46 @@ function register_acf_blocks() {
|
||||
);
|
||||
}
|
||||
));
|
||||
|
||||
acf_register_block_type(array(
|
||||
'name' => 'simple-gallery',
|
||||
'title' => __('Галерея с текстом'),
|
||||
'description' => __('Галерея с текстом'),
|
||||
'render_template' => 'template-parts/la-components/blocks/simple-gallery/simple-gallery.php',
|
||||
'category' => 'theme-blocks',
|
||||
'icon' => 'images-alt2',
|
||||
'keywords' => array('gallery', 'tabs', 'slider', 'галерея', 'слайдер'),
|
||||
'supports' => array(
|
||||
'align' => array('wide', 'full'),
|
||||
'anchor' => true,
|
||||
'customClassName' => true,
|
||||
),
|
||||
'enqueue_assets' => function() {
|
||||
|
||||
wp_enqueue_style(
|
||||
'glightbox-css',
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.2.0/css/glightbox.min.css',
|
||||
[],
|
||||
'3.2.0'
|
||||
);
|
||||
|
||||
wp_enqueue_script(
|
||||
'glightbox-js',
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.2.0/js/glightbox.min.js',
|
||||
[],
|
||||
'3.2.0',
|
||||
true
|
||||
);
|
||||
|
||||
wp_enqueue_script(
|
||||
'simple-gallery-js',
|
||||
get_template_directory_uri() . '/template-parts/la-components/blocks/simple-gallery/simple-gallery.js',
|
||||
['swiper-js', 'glightbox-js'],
|
||||
'1.0.0',
|
||||
true
|
||||
);
|
||||
}
|
||||
));
|
||||
}
|
||||
}
|
||||
add_action('acf/init', 'register_acf_blocks');
|
||||
|
||||
435
template-parts/la-components/functions/breadcrumbs.php
Normal file
435
template-parts/la-components/functions/breadcrumbs.php
Normal file
@@ -0,0 +1,435 @@
|
||||
<?php
|
||||
/**
|
||||
* хлебные крошки
|
||||
*/
|
||||
|
||||
// Проверяем, не объявлена ли уже функция
|
||||
if (!function_exists('generate_yandex_breadcrumbs')) {
|
||||
|
||||
function generate_yandex_breadcrumbs()
|
||||
{
|
||||
$current_region = 'RU';
|
||||
$home_title = 'Главная';
|
||||
$home_url = home_url('/');
|
||||
|
||||
$texts = array(
|
||||
'you_are_here' => 'Вы находитесь здесь:',
|
||||
'search_prefix' => 'Поиск:',
|
||||
'not_found' => 'Страница не найдена',
|
||||
'author_prefix' => 'Публикации автора',
|
||||
'breadcrumb_nav' => 'Навигация по разделам'
|
||||
);
|
||||
|
||||
$clean_title = function ($title) {
|
||||
return trim(preg_replace('/\s*\([^)]*\)/', '', $title));
|
||||
};
|
||||
|
||||
$separator_svg = '<svg width="7" height="14" viewBox="0 0 7 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0 13.9365L4.976 0.0644531H6.352L1.36 13.9365H0Z" fill="#6C6B6B" />
|
||||
</svg>';
|
||||
|
||||
if (get_current_room() === 'gym') {
|
||||
$home_icon_svg = '<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2307_15997)">
|
||||
<path d="M0.584984 10.087C0.584984 11.1419 1.4431 12 2.498 12H5.0487C5.40085 12 5.68637 11.7148 5.68637 11.3623V8.81164H6.96172V11.3623C6.96172 11.7148 7.24723 12 7.59938 12H10.1501C11.205 12 12.0631 11.1419 12.0631 10.087V4.06395C12.0631 3.62119 11.8389 3.21704 11.4637 2.98226L7.00004 0.192428C6.58934 -0.0641426 6.05879 -0.0641426 5.64809 0.192428L1.18435 2.98226C0.809164 3.21704 0.584961 3.62119 0.584961 4.06395V10.087H0.584984ZM1.86034 4.06395L6.32405 1.27412L10.7878 4.06395V10.087C10.7878 10.4388 10.502 10.7247 10.1501 10.7247H8.23709V8.17395C8.23709 7.82211 7.95158 7.53629 7.59943 7.53629H5.04873C4.69658 7.53629 4.41106 7.82211 4.41106 8.17395V10.7247H2.498C2.14616 10.7247 1.86034 10.4388 1.86034 10.087V4.06395Z" fill="#F8F8F8" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2307_15997">
|
||||
<rect width="12" height="12" fill="white" transform="translate(0.324219)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>';
|
||||
} else {
|
||||
$home_icon_svg = '<svg class="fill-[#222]" width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.584984 10.087C0.584984 11.1419 1.4431 12 2.498 12H5.0487C5.40085 12 5.68637 11.7148 5.68637 11.3623V8.81164H6.96172V11.3623C6.96172 11.7148 7.24723 12 7.59938 12H10.1501C11.205 12 12.0631 11.1419 12.0631 10.087V4.06395C12.0631 3.62119 11.8389 3.21704 11.4637 2.98226L7.00004 0.192428C6.58934 -0.0641426 6.05879 -0.0641426 5.64809 0.192428L1.18435 2.98226C0.809164 3.21704 0.584961 3.62119 0.584961 4.06395V10.087H0.584984ZM1.86034 4.06395L6.32405 1.27412L10.7878 4.06395V10.087C10.7878 10.4388 10.502 10.7247 10.1501 10.7247H8.23709V8.17395C8.23709 7.82211 7.95158 7.53629 7.59943 7.53629H5.04873C4.69658 7.53629 4.41106 7.82211 4.41106 8.17395V10.7247H2.498C2.14616 10.7247 1.86034 10.4388 1.86034 10.087V4.06395Z"
|
||||
/>
|
||||
</svg>';
|
||||
}
|
||||
|
||||
// Создаем элемент главной страницы отдельно
|
||||
$home_breadcrumb = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => 1,
|
||||
"name" => $home_title,
|
||||
"item" => $home_url
|
||||
);
|
||||
|
||||
// Массив для остальных крошек (без главной)
|
||||
$breadcrumbs = array();
|
||||
$position = 2; // Начинаем с позиции 2, так как главная уже позиция 1
|
||||
|
||||
if (is_post_type_archive()) {
|
||||
$post_type = get_queried_object();
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($post_type->labels->name),
|
||||
"item" => get_post_type_archive_link($post_type->name)
|
||||
);
|
||||
|
||||
// Категории (включая иерархические)
|
||||
} elseif (is_category()) {
|
||||
$category = get_queried_object();
|
||||
|
||||
// Родительские категории
|
||||
$parent_cats = array();
|
||||
$parent_id = $category->parent;
|
||||
while ($parent_id) {
|
||||
$parent_cat = get_category($parent_id);
|
||||
array_unshift($parent_cats, $parent_cat);
|
||||
$parent_id = $parent_cat->parent;
|
||||
}
|
||||
|
||||
foreach ($parent_cats as $parent_cat) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($parent_cat->name),
|
||||
"item" => get_category_link($parent_cat->term_id)
|
||||
);
|
||||
}
|
||||
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($category->name),
|
||||
"item" => get_category_link($category->term_id)
|
||||
);
|
||||
|
||||
// Теги
|
||||
} elseif (is_tag()) {
|
||||
$tag = get_queried_object();
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($tag->name),
|
||||
"item" => get_tag_link($tag->term_id)
|
||||
);
|
||||
|
||||
// Кастомные таксономии
|
||||
} elseif (is_tax()) {
|
||||
$term = get_queried_object();
|
||||
$taxonomy = $term->taxonomy;
|
||||
|
||||
// Архив типа поста для этой таксономии
|
||||
$taxonomy_obj = get_taxonomy($taxonomy);
|
||||
if (!empty($taxonomy_obj->object_type)) {
|
||||
$post_type = $taxonomy_obj->object_type[0];
|
||||
$post_type_obj = get_post_type_object($post_type);
|
||||
|
||||
if ($post_type_obj && $post_type_obj->has_archive) {
|
||||
$archive_link = get_post_type_archive_link($post_type);
|
||||
if ($archive_link) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($post_type_obj->labels->name),
|
||||
"item" => $archive_link
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Родительские термины для иерархических таксономий
|
||||
if (is_taxonomy_hierarchical($taxonomy)) {
|
||||
$parent_terms = array();
|
||||
$parent_id = $term->parent;
|
||||
while ($parent_id) {
|
||||
$parent_term = get_term($parent_id, $taxonomy);
|
||||
array_unshift($parent_terms, $parent_term);
|
||||
$parent_id = $parent_term->parent;
|
||||
}
|
||||
|
||||
foreach ($parent_terms as $parent_term) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($parent_term->name),
|
||||
"item" => get_term_link($parent_term)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($term->name),
|
||||
"item" => get_term_link($term)
|
||||
);
|
||||
|
||||
// Отдельные посты
|
||||
} elseif (is_single()) {
|
||||
global $post;
|
||||
$post_type = get_post_type($post);
|
||||
|
||||
if ($post_type === 'post') {
|
||||
// Обычные посты - категории
|
||||
$categories = get_the_category();
|
||||
if (!empty($categories)) {
|
||||
$main_category = $categories[0];
|
||||
|
||||
// Родительские категории
|
||||
$parent_cats = array();
|
||||
$parent_id = $main_category->parent;
|
||||
while ($parent_id) {
|
||||
$parent_cat = get_category($parent_id);
|
||||
array_unshift($parent_cats, $parent_cat);
|
||||
$parent_id = $parent_cat->parent;
|
||||
}
|
||||
|
||||
foreach ($parent_cats as $parent_cat) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($parent_cat->name),
|
||||
"item" => get_category_link($parent_cat->term_id)
|
||||
);
|
||||
}
|
||||
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($main_category->name),
|
||||
"item" => get_category_link($main_category->term_id)
|
||||
);
|
||||
}
|
||||
} else {
|
||||
// Кастомные типы постов
|
||||
$post_type_obj = get_post_type_object($post_type);
|
||||
|
||||
// Архив типа поста
|
||||
if ($post_type_obj && $post_type_obj->has_archive) {
|
||||
$archive_link = get_post_type_archive_link($post_type);
|
||||
if ($archive_link) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($post_type_obj->labels->name),
|
||||
"item" => $archive_link
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Основная таксономия для кастомного типа
|
||||
$taxonomies = get_object_taxonomies($post_type, 'objects');
|
||||
$main_taxonomy = null;
|
||||
|
||||
// Ищем основную таксономию (hierarchical в приоритете)
|
||||
foreach ($taxonomies as $taxonomy) {
|
||||
if ($taxonomy->public && !in_array($taxonomy->name, array('post_tag', 'post_format'))) {
|
||||
if ($taxonomy->hierarchical) {
|
||||
$main_taxonomy = $taxonomy->name;
|
||||
break;
|
||||
} elseif (!$main_taxonomy) {
|
||||
$main_taxonomy = $taxonomy->name;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ($main_taxonomy) {
|
||||
$terms = get_the_terms($post, $main_taxonomy);
|
||||
if (!empty($terms) && !is_wp_error($terms)) {
|
||||
$main_term = $terms[0];
|
||||
|
||||
// Родительские термины для иерархических таксономий
|
||||
if (is_taxonomy_hierarchical($main_taxonomy)) {
|
||||
$parent_terms = array();
|
||||
$parent_id = $main_term->parent;
|
||||
while ($parent_id) {
|
||||
$parent_term = get_term($parent_id, $main_taxonomy);
|
||||
array_unshift($parent_terms, $parent_term);
|
||||
$parent_id = $parent_term->parent;
|
||||
}
|
||||
|
||||
foreach ($parent_terms as $parent_term) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($parent_term->name),
|
||||
"item" => get_term_link($parent_term)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title($main_term->name),
|
||||
"item" => get_term_link($main_term)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Текущий пост
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title(get_the_title()),
|
||||
"item" => get_permalink()
|
||||
);
|
||||
|
||||
// Страницы
|
||||
} elseif (is_page()) {
|
||||
global $post;
|
||||
|
||||
$ancestors = get_post_ancestors($post);
|
||||
$ancestors = array_reverse($ancestors);
|
||||
|
||||
foreach ($ancestors as $ancestor_id) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title(get_the_title($ancestor_id)),
|
||||
"item" => get_permalink($ancestor_id)
|
||||
);
|
||||
}
|
||||
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $clean_title(get_the_title()),
|
||||
"item" => get_permalink()
|
||||
);
|
||||
|
||||
// Авторы
|
||||
} elseif (is_author()) {
|
||||
$author = get_queried_object();
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $texts['author_prefix'] . ' ' . $author->display_name,
|
||||
"item" => get_author_posts_url($author->ID)
|
||||
);
|
||||
|
||||
// Поиск
|
||||
} elseif (is_search()) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $texts['search_prefix'] . ' ' . get_search_query(),
|
||||
"item" => home_url('?s=' . urlencode(get_search_query()))
|
||||
);
|
||||
|
||||
// 404
|
||||
} elseif (is_404()) {
|
||||
$breadcrumbs[] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position++,
|
||||
"name" => $texts['not_found'],
|
||||
"item" => home_url($_SERVER['REQUEST_URI'])
|
||||
);
|
||||
}
|
||||
|
||||
// Объединяем главную страницу с остальными крошками для JSON-LD
|
||||
$all_breadcrumbs = array_merge(array($home_breadcrumb), $breadcrumbs);
|
||||
|
||||
if (empty($all_breadcrumbs)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
$yandex_schema = array(
|
||||
"@context" => "https://schema.org",
|
||||
"@type" => "BreadcrumbList",
|
||||
"name" => "Навигация по разделам сайта",
|
||||
"description" => "Путь навигации к текущей странице",
|
||||
"areaServed" => array(
|
||||
"@type" => "Country",
|
||||
"name" => $current_region
|
||||
),
|
||||
"itemListElement" => $all_breadcrumbs
|
||||
);
|
||||
?>
|
||||
|
||||
<nav class="h-[30px] rounded-[24px] max-w-fit flex items-center bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)] dark:bg-none dark:bg-[transparent] px-[12px]"
|
||||
role="navigation"
|
||||
aria-label="<?php echo esc_attr($texts['breadcrumb_nav']); ?>"
|
||||
itemscope
|
||||
itemtype="https://schema.org/BreadcrumbList"
|
||||
data-region="<?php echo esc_attr($current_region); ?>">
|
||||
|
||||
<span class="absolute !w-[1px] !h-[1px] !p-0 !m-[-1px] overflow-hidden !clip-[rect(0,0,0,0)] !border-0">
|
||||
<?php echo esc_html($texts['you_are_here']); ?>
|
||||
</span>
|
||||
|
||||
<ol class="[&>li>a]:!no-underline flex items-center gap-[8px] text-[14px] leading-[20px] flex-wrap" role="list">
|
||||
|
||||
<!-- Главная -->
|
||||
<li class="flex items-center"
|
||||
itemscope
|
||||
itemprop="itemListElement"
|
||||
itemtype="https://schema.org/ListItem">
|
||||
|
||||
<a href="<?php echo esc_url($home_breadcrumb['item']); ?>"
|
||||
class="font-[600] text-[14px] leading-[125%] text-[#222] hover:text-[#9d9994] dark:hover:text-[#9d9994] dark:text-[#f8f8f8] flex gap-[6px] items-center"
|
||||
itemprop="item"
|
||||
title="<?php echo esc_attr('Перейти на главную страницу'); ?>">
|
||||
|
||||
<?php echo $home_icon_svg; ?>
|
||||
<span itemprop="name"><?php echo esc_html($home_breadcrumb['name']); ?></span>
|
||||
</a>
|
||||
|
||||
<meta itemprop="position" content="<?php echo esc_attr($home_breadcrumb['position']); ?>">
|
||||
|
||||
<?php if (!empty($breadcrumbs)): ?>
|
||||
<span class="select-none ml-[8px] flex items-center" aria-hidden="true">
|
||||
<?php echo $separator_svg; ?>
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
</li>
|
||||
|
||||
<?php foreach ($breadcrumbs as $index => $crumb):
|
||||
$is_last = ($index === count($breadcrumbs) - 1);
|
||||
?>
|
||||
<li class="flex items-center"
|
||||
itemscope
|
||||
itemprop="itemListElement"
|
||||
itemtype="https://schema.org/ListItem">
|
||||
|
||||
<?php if (!$is_last): ?>
|
||||
<a href="<?php echo esc_url($crumb['item']); ?>"
|
||||
class="hover:text-[#222] text-[#6c6b6b] dark:text-[#6c6b6b] dark:hover:text-[#f8f8f8] transition font-[500] leading-[125%] text-[14px]"
|
||||
itemprop="item"
|
||||
title="<?php echo esc_attr('Перейти в раздел: ' . $crumb['name']); ?>">
|
||||
<span itemprop="name"><?php echo esc_html($crumb['name']); ?></span>
|
||||
</a>
|
||||
<?php else: ?>
|
||||
<span class="text-[#6c6b6b] dark:text-[#6c6b6b] font-[500] leading-[125%] text-[14px]"
|
||||
itemprop="name"
|
||||
aria-current="page">
|
||||
<?php echo esc_html($crumb['name']); ?>
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
|
||||
<meta itemprop="position" content="<?php echo esc_attr($crumb['position']); ?>">
|
||||
|
||||
<?php if (!$is_last): ?>
|
||||
<span class="select-none ml-[8px] flex items-center"
|
||||
aria-hidden="true">
|
||||
<?php echo $separator_svg; ?>
|
||||
</span>
|
||||
<?php endif; ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<script type="application/ld+json">
|
||||
<?php echo json_encode($yandex_schema, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>
|
||||
</script>
|
||||
|
||||
<?php
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
if (!function_exists('display_yandex_breadcrumbs')) {
|
||||
function display_yandex_breadcrumbs()
|
||||
{
|
||||
if (is_front_page() || is_home() || is_admin()) {
|
||||
return;
|
||||
}
|
||||
|
||||
generate_yandex_breadcrumbs();
|
||||
}
|
||||
}
|
||||
@@ -25,9 +25,9 @@ function modal_system_container() {
|
||||
}
|
||||
|
||||
?>
|
||||
<div id="modal-overlay" class="fixed inset-0 bg-[rgba(0,0,0,0.5)] backdrop-blur-sm z-50 flex items-center justify-center p-4 opacity-0 invisible transition-all duration-300">
|
||||
<div class="bg-white rounded-lg shadow-2xl max-w-2xl w-full max-h-[90vh] relative transform scale-90 transition-transform duration-300 overflow-hidden">
|
||||
<button id="modal-close" class="absolute top-4 right-4 z-10 w-8 h-8 flex items-center justify-center rounded-full hover:bg-gray-100 transition-colors text-gray-500 hover:text-gray-700">
|
||||
<div id="modal-overlay" class="fixed inset-0 bg-[rgba(0,0,0,0.5)] backdrop-blur-sm z-50 flex items-center justify-center p-4 opacity-0 invisible transition-all ">
|
||||
<div class="bg-[#f9f9f9] rounded-[20px] max-w-[970px] w-full max-h-[90vh] relative transform scale-90 transition-transform overflow-hidden">
|
||||
<button id="modal-close" class="absolute top-4 right-4 z-10 w-8 h-8 flex items-center cursor-pointer justify-center rounded-full hover:bg-gray-100 transition-colors text-gray-500 hover:text-gray-700">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</svg>
|
||||
|
||||
@@ -12,9 +12,13 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
if (!this.overlay) return;
|
||||
|
||||
this.content = document.getElementById('modal-content');
|
||||
this.container = this.overlay.querySelector('.bg-white');
|
||||
this.container = this.content ? this.content.parentElement : null;
|
||||
this.closeBtn = document.getElementById('modal-close');
|
||||
|
||||
if (!this.content || !this.container) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.bindEvents();
|
||||
this.initFormHandling();
|
||||
},
|
||||
@@ -37,8 +41,16 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
if (modalTrigger) {
|
||||
e.preventDefault();
|
||||
const modalName = modalTrigger.getAttribute('data-modal');
|
||||
const cardId = modalTrigger.getAttribute('data-card-id');
|
||||
this.open(modalName, { cardId });
|
||||
|
||||
const params = {};
|
||||
Array.from(modalTrigger.attributes).forEach(attr => {
|
||||
if (attr.name.startsWith('data-') && attr.name !== 'data-modal') {
|
||||
const key = attr.name.replace('data-', '').replace(/-([a-z])/g, (g) => g[1].toUpperCase());
|
||||
params[key] = attr.value;
|
||||
}
|
||||
});
|
||||
|
||||
this.open(modalName, params);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -51,45 +63,52 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
},
|
||||
|
||||
initFormHandling() {
|
||||
console.log('Form handling initialized');
|
||||
|
||||
document.addEventListener('fluentform_submission_success', (e) => {
|
||||
const form = e.target.closest('.ff-el-form-wrapper form');
|
||||
if (form) {
|
||||
setTimeout(() => {
|
||||
if (this.isOpen()) {
|
||||
this.replace('form-success');
|
||||
} else {
|
||||
this.open('form-success');
|
||||
}
|
||||
const thankYouUrl = this.getLocalizedUrl('/thank-you');
|
||||
window.location.href = thankYouUrl;
|
||||
}, 300);
|
||||
}
|
||||
}, true);
|
||||
|
||||
if (typeof jQuery !== 'undefined') {
|
||||
jQuery(document).ajaxSuccess((event, xhr, settings) => {
|
||||
|
||||
if (settings.url && settings.url.includes('admin-ajax.php') &&
|
||||
settings.data && settings.data.includes('fluentform_submit')) {
|
||||
try {
|
||||
const response = JSON.parse(xhr.responseText);
|
||||
console.log('Response:', response);
|
||||
if (response.success && response.data && response.data.insert_id) {
|
||||
setTimeout(() => {
|
||||
if (this.isOpen()) {
|
||||
this.replace('form-success');
|
||||
} else {
|
||||
this.open('form-success');
|
||||
}
|
||||
const thankYouUrl = this.getLocalizedUrl('/thank-you');
|
||||
window.location.href = thankYouUrl;
|
||||
}, 300);
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
}
|
||||
},
|
||||
getLocalizedUrl(path) {
|
||||
const htmlLang = document.documentElement.lang;
|
||||
const currentLang = window.pll_current_language || this.getCurrentLangFromUrl();
|
||||
|
||||
if (currentLang) {
|
||||
return `/${currentLang}${path}`;
|
||||
}
|
||||
|
||||
return path;
|
||||
},
|
||||
|
||||
getCurrentLangFromUrl() {
|
||||
const currentPath = window.location.pathname;
|
||||
const languageCodes = ['gym'];
|
||||
const pathParts = currentPath.split('/').filter(part => part.length > 0);
|
||||
|
||||
return pathParts.length > 0 && languageCodes.includes(pathParts[0]) ? pathParts[0] : null;
|
||||
},
|
||||
|
||||
open(modalName, params = {}) {
|
||||
const template = document.getElementById(`modal-template-${modalName}`);
|
||||
@@ -130,25 +149,121 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
},
|
||||
|
||||
injectParams(params) {
|
||||
if (params.cardId) {
|
||||
setTimeout(() => {
|
||||
const hiddenInput = this.content.querySelector('input[name="hidden"]');
|
||||
if (hiddenInput && !hiddenInput.dataset.cardInjected) {
|
||||
const currentValue = hiddenInput.value || '';
|
||||
hiddenInput.value = currentValue + ` | Карта ID: ${params.cardId}`;
|
||||
hiddenInput.dataset.cardInjected = 'true';
|
||||
}
|
||||
}, 100);
|
||||
if (params.cardTitle) {
|
||||
const titleElements = this.content.querySelectorAll('[data-inject="card-title"]');
|
||||
titleElements.forEach(el => {
|
||||
el.textContent = params.cardTitle;
|
||||
});
|
||||
}
|
||||
|
||||
if (params.cardTime) {
|
||||
this.fillTimeInfo(JSON.parse(params.cardTime));
|
||||
}
|
||||
|
||||
if (params.cardPrices) {
|
||||
this.fillPrices(JSON.parse(params.cardPrices), params.cardTitle, params.cardId);
|
||||
}
|
||||
},
|
||||
|
||||
fillTimeInfo(timeSlots) {
|
||||
if (!timeSlots.length) return;
|
||||
|
||||
const firstSlot = timeSlots[0];
|
||||
|
||||
if (firstSlot.normal_days) {
|
||||
const normalDaysEl = this.content.querySelector('[data-inject="normal-days"]');
|
||||
if (normalDaysEl) normalDaysEl.textContent = firstSlot.normal_days;
|
||||
}
|
||||
|
||||
if (firstSlot.vacation_days) {
|
||||
const vacationDaysEl = this.content.querySelector('[data-inject="vacation-days"]');
|
||||
if (vacationDaysEl) vacationDaysEl.textContent = firstSlot.vacation_days;
|
||||
}
|
||||
},
|
||||
|
||||
fillPrices(prices, cardTitle, cardId) {
|
||||
Object.keys(prices).forEach(period => {
|
||||
const price = prices[period];
|
||||
if (!price.full || !price.day) return;
|
||||
|
||||
const fullElements = this.content.querySelectorAll(`[data-inject="price-${period.replace('_', '-')}-full"]`);
|
||||
const dayElements = this.content.querySelectorAll(`[data-inject="price-${period.replace('_', '-')}-day"]`);
|
||||
|
||||
fullElements.forEach(el => el.textContent = price.full);
|
||||
dayElements.forEach(el => el.textContent = price.day);
|
||||
});
|
||||
|
||||
this.content.querySelectorAll('.price-option').forEach(option => {
|
||||
option.addEventListener('click', () => {
|
||||
const period = option.dataset.period;
|
||||
const price = prices[period];
|
||||
if (price) {
|
||||
this.selectPrice(option, period, price, cardTitle, cardId);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const firstOption = this.content.querySelector('.price-option');
|
||||
if (firstOption && prices['1_month']) {
|
||||
this.selectPrice(firstOption, '1_month', prices['1_month'], cardTitle, cardId);
|
||||
}
|
||||
},
|
||||
|
||||
selectPrice(selectedOption, period, price, cardTitle, cardId) {
|
||||
this.content.querySelectorAll('.price-option').forEach(option => {
|
||||
option.classList.remove('bg-[linear-gradient(90deg,_#2b2c35_39.42%,_#6e7996_92.9%)]', '[&_div]:text-[#f8f8f8]', '[&_p]:text-[#bcbcc0]');
|
||||
option.classList.add('bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]', '[&_div]:text-[#222]', '[&_p]:text-[#6c6b6b]');
|
||||
});
|
||||
|
||||
selectedOption.classList.remove('bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]', '[&_div]:text-[#222]', '[&_p]:text-[#6c6b6b]');
|
||||
selectedOption.classList.add('bg-[linear-gradient(90deg,_#2b2c35_39.42%,_#6e7996_92.9%)]', '[&_div]:text-[#f8f8f8]', '[&_p]:text-[#bcbcc0]');
|
||||
|
||||
const periodNames = {
|
||||
'1_month': '1 месяц',
|
||||
'3_month': '3 месяца',
|
||||
'6_month': '6 месяцев',
|
||||
'12_month': '12 месяцев'
|
||||
};
|
||||
|
||||
const selectedPeriodEl = this.content.querySelector('#selected-period');
|
||||
const selectedFullPriceEl = this.content.querySelector('#selected-full-price');
|
||||
const selectedDayPriceEl = this.content.querySelector('#selected-day-price');
|
||||
|
||||
if (selectedPeriodEl) selectedPeriodEl.textContent = periodNames[period];
|
||||
if (selectedFullPriceEl) selectedFullPriceEl.textContent = price.full;
|
||||
if (selectedDayPriceEl) selectedDayPriceEl.textContent = price.day;
|
||||
|
||||
setTimeout(() => {
|
||||
const hiddenInput = this.content.querySelector('input[name="hidden"]');
|
||||
if (hiddenInput) {
|
||||
const formWrapper = this.content.querySelector('.form-block-wrapper');
|
||||
const baseValue = formWrapper ? formWrapper.dataset.hiddenValue : '';
|
||||
|
||||
const normalDays = this.content.querySelector('[data-inject="normal-days"]')?.textContent || '';
|
||||
const vacationDays = this.content.querySelector('[data-inject="vacation-days"]')?.textContent || '';
|
||||
const daysInfo = normalDays || vacationDays ? ` | Дни: обычные ${normalDays}, выходные ${vacationDays}` : '';
|
||||
|
||||
const tariffInfo = `Карта: ${cardTitle} | Тариф: ${periodNames[period]} | Цена: ${price.full} ₽ (${price.day} ₽/день)${daysInfo} | ID карты: ${cardId}`;
|
||||
hiddenInput.value = `${baseValue} | ${tariffInfo}`;
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
|
||||
camelToKebab(str) {
|
||||
return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
|
||||
},
|
||||
|
||||
show() {
|
||||
if (!this.overlay || !this.container) return;
|
||||
|
||||
this.overlay.classList.remove('opacity-0', 'invisible');
|
||||
this.overlay.classList.add('opacity-100', 'visible');
|
||||
|
||||
setTimeout(() => {
|
||||
this.container.classList.remove('scale-90');
|
||||
this.container.classList.add('scale-100');
|
||||
if (this.container) {
|
||||
this.container.classList.remove('scale-90');
|
||||
this.container.classList.add('scale-100');
|
||||
}
|
||||
}, 10);
|
||||
|
||||
setTimeout(() => {
|
||||
@@ -171,6 +286,8 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
},
|
||||
|
||||
hide() {
|
||||
if (!this.container || !this.overlay) return;
|
||||
|
||||
this.container.classList.remove('scale-100');
|
||||
this.container.classList.add('scale-90');
|
||||
|
||||
|
||||
@@ -2,14 +2,18 @@
|
||||
|
||||
/**
|
||||
* Переключает язык (регионы) необходим плагин Polylang
|
||||
*
|
||||
* Поддерживает множественные вызовы на одной странице
|
||||
*/
|
||||
|
||||
|
||||
// Проверяем существование функций Polylang
|
||||
if (!function_exists('pll_languages_list') || !function_exists('pll_current_language')) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
static $instance_counter = 0;
|
||||
$instance_counter++;
|
||||
$unique_id = 'plLangSwitcher' . $instance_counter;
|
||||
?>
|
||||
|
||||
<style>
|
||||
@@ -19,8 +23,6 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 90px;
|
||||
padding: 6px;
|
||||
--pl-slider-width: 0px;
|
||||
--pl-slider-x: 0px;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
@@ -61,11 +63,6 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
color: #b9b7b9;
|
||||
}
|
||||
|
||||
.pl-lang-switcher-button:hover,
|
||||
.pl-lang-switcher-container a(not:.pl-lang-switcher-current):hover {
|
||||
color: #222;
|
||||
}
|
||||
|
||||
|
||||
.pl-lang-switcher-button.pl-lang-switcher-active,
|
||||
.pl-lang-switcher-container a.pl-lang-switcher-active,
|
||||
@@ -83,8 +80,6 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
background: linear-gradient(90deg, #2b2c35 67.31%, #4f5870 92.9%);
|
||||
border-radius: 90px;
|
||||
z-index: 1;
|
||||
width: var(--pl-slider-width);
|
||||
transform: translateX(var(--pl-slider-x));
|
||||
transition: all 180ms cubic-bezier(0.4, 0.0, 0.2, 1);
|
||||
}
|
||||
|
||||
@@ -93,8 +88,8 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="pl-lang-switcher-container" id="plLangSwitcherContainer">
|
||||
<div class="pl-lang-switcher-slider" id="plLangSwitcherSlider"></div>
|
||||
<div class="pl-lang-switcher-container" data-switcher-id="<?php echo $unique_id; ?>">
|
||||
<div class="pl-lang-switcher-slider"></div>
|
||||
<?php
|
||||
$languages = pll_languages_list();
|
||||
$current_lang = pll_current_language('slug');
|
||||
@@ -146,9 +141,15 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const container = document.getElementById('plLangSwitcherContainer');
|
||||
if (!container) return;
|
||||
// Инициализируем все переключатели языков на странице
|
||||
const containers = document.querySelectorAll('.pl-lang-switcher-container[data-switcher-id="<?php echo $unique_id; ?>"]');
|
||||
|
||||
containers.forEach(function(container) {
|
||||
initLanguageSwitcher(container);
|
||||
});
|
||||
});
|
||||
|
||||
function initLanguageSwitcher(container) {
|
||||
let isInitialized = false;
|
||||
|
||||
function updateSliderPosition(target = null, animate = false) {
|
||||
@@ -157,7 +158,7 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
}
|
||||
if (!target) return;
|
||||
|
||||
const slider = container.querySelector('#plLangSwitcherSlider');
|
||||
const slider = container.querySelector('.pl-lang-switcher-slider');
|
||||
const width = target.offsetWidth;
|
||||
const x = target.offsetLeft - 6;
|
||||
|
||||
@@ -167,8 +168,8 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
slider.style.transition = 'none';
|
||||
}
|
||||
|
||||
container.style.setProperty('--pl-slider-width', width + 'px');
|
||||
container.style.setProperty('--pl-slider-x', x + 'px');
|
||||
slider.style.width = width + 'px';
|
||||
slider.style.transform = 'translateX(' + x + 'px)';
|
||||
}
|
||||
|
||||
function initialize() {
|
||||
@@ -208,8 +209,8 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
// Обновляем только в текущем контейнере
|
||||
container.querySelectorAll('a').forEach(a => a.classList.remove('pl-lang-switcher-current'));
|
||||
|
||||
link.classList.add('pl-lang-switcher-current');
|
||||
|
||||
updateSliderPosition(link, true);
|
||||
@@ -219,5 +220,5 @@ if (!function_exists('pll_languages_list') || !function_exists('pll_current_lang
|
||||
}
|
||||
|
||||
initialize();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -1,22 +1,90 @@
|
||||
<?php
|
||||
|
||||
$form_id = '4';
|
||||
$form_title = 'Заявка на клубную карту';
|
||||
|
||||
$current_url = home_url($_SERVER['REQUEST_URI']);
|
||||
$page_title = get_the_title() ?: 'Главная страница';
|
||||
|
||||
$hidden_value = "Форма: {$form_title} | Страница: {$page_title} | URL: {$current_url}";
|
||||
$hidden_value = "Страница: {$page_title} | URL: {$current_url}";
|
||||
?>
|
||||
|
||||
<div class="p-[30px] max-[768px]:p-[20px]">
|
||||
<h3 class="text-[24px] max-[768px]:text-[20px] font-bold text-[#1f2937] mb-[24px] text-center">
|
||||
<?php echo esc_html($form_title); ?>
|
||||
<div class="p-[40px] max-[768px]:p-[20px]">
|
||||
<h3 class="font-[500] text-[40px] leading-[120%] text-[#222]">
|
||||
Оформить карту “<span class="font-[700]" data-inject="card-title">не выбрана</span>”
|
||||
</h3>
|
||||
|
||||
<div class="form-block-wrapper"
|
||||
data-form-id="<?php echo esc_attr($form_id); ?>"
|
||||
data-hidden-value="<?php echo esc_attr($hidden_value); ?>">
|
||||
<?php echo do_shortcode('[fluentform id="' . esc_attr($form_id) . '"]'); ?>
|
||||
<div class="bg-[#fff] max-w-fit px-[20px] rounded-[8px] h-[74px] flex items-center mt-[32px] gap-[24px]"
|
||||
id="card-time-info">
|
||||
<h4 class="font-[600] text-[24px] leading-[125%] text-[#222] ">Время посещений</h4>
|
||||
<svg width="2" height="50" viewBox="0 0 2 50" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="0.5" width="1" height="50" fill="#E0E0E0"/>
|
||||
</svg>
|
||||
<div class="flex flex-col gap-[4px] font-[500] text-[16px] leading-[145%] text-[#222]">
|
||||
<span>Будние дни: <strong data-inject="normal-days">-</strong></span>
|
||||
<span>Выходные: <strong data-inject="vacation-days">-</strong></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-[32px]">
|
||||
<div id="price-options" class="flex flex-wrap gap-[4px] justify-between">
|
||||
<div class="price-option [&_div]:text-[#f8f8f8] [&_p]:text-[#bcbcc0] w-full max-w-[213px] h-[147px] rounded-[12px] flex items-center justify-center flex-col cursor-pointer bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]"
|
||||
data-period="1_month">
|
||||
<div class="text-center flex flex-col gap-[6px]">
|
||||
<div class="font-[600] text-[24px] leading-[125%]">1 месяц</div>
|
||||
<div class="font-[700] text-[32px] leading-[115%]">
|
||||
<span data-inject="price-1-month-full">-</span> ₽
|
||||
</div>
|
||||
<p class="font-[500] text-[20px] leading-[140%]">
|
||||
<span data-inject="price-1-month-day">-</span> ₽ в день
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="price-option [&_div]:text-[#f8f8f8] [&_p]:text-[#bcbcc0] w-full max-w-[213px] h-[147px] rounded-[12px] flex items-center justify-center flex-col cursor-pointer bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]"
|
||||
data-period="3_month">
|
||||
<div class="text-center flex flex-col gap-[6px]">
|
||||
<div class="font-[600] text-[24px] leading-[125%]">3 месяца</div>
|
||||
<div class="font-[700] text-[32px] leading-[115%]">
|
||||
<span data-inject="price-1-month-full">-</span> ₽
|
||||
</div>
|
||||
<p class="font-[500] text-[20px] leading-[140%]">
|
||||
<span data-inject="price-1-month-day">-</span> ₽ в день
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="price-option [&_div]:text-[#f8f8f8] [&_p]:text-[#bcbcc0] w-full max-w-[213px] h-[147px] rounded-[12px] flex items-center justify-center flex-col cursor-pointer bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]"
|
||||
data-period="6_month">
|
||||
<div class="text-center flex flex-col gap-[6px]">
|
||||
<div class="font-[600] text-[24px] leading-[125%]">6 месяцев</div>
|
||||
<div class="font-[700] text-[32px] leading-[115%]">
|
||||
<span data-inject="price-1-month-full">-</span> ₽
|
||||
</div>
|
||||
<p class="font-[500] text-[20px] leading-[140%]">
|
||||
<span data-inject="price-1-month-day">-</span> ₽ в день
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="price-option [&_div]:text-[#f8f8f8] [&_p]:text-[#bcbcc0] w-full max-w-[213px] h-[147px] rounded-[12px] flex items-center justify-center flex-col cursor-pointer bg-[linear-gradient(180deg,_#f2f2f2_69.59%,_#ededed_100%)]"
|
||||
data-period="12_month">
|
||||
<div class="text-center flex flex-col gap-[6px]">
|
||||
<div class="font-[600] text-[24px] leading-[125%]">12 месяцев</div>
|
||||
<div class="font-[700] text-[32px] leading-[115%]">
|
||||
<span data-inject="price-1-month-full">-</span> ₽
|
||||
</div>
|
||||
<p class="font-[500] text-[20px] leading-[140%]">
|
||||
<span data-inject="price-1-month-day">-</span> ₽ в день
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Выбранный тариф -->
|
||||
<div class="mt-[32px] font-[500] text-[20px] leading-[140%]">
|
||||
Выбрано <span data-inject="card-title">-</span> на <span id="selected-period">-</span>
|
||||
</div>
|
||||
|
||||
<div class="form-block-wrapper mt-[32px]"
|
||||
data-form-id="4"
|
||||
data-hidden-value="<?php echo esc_attr($hidden_value); ?>">
|
||||
<?php echo do_shortcode('[fluentform id="4"]'); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,7 +1,6 @@
|
||||
<?php
|
||||
/**
|
||||
* Навигационное меню с сео
|
||||
* По умолчанию названию меню Шапка сайта
|
||||
* Навигационное меню с SEO
|
||||
*/
|
||||
|
||||
$menu = wp_get_nav_menu_object('Шапка сайта');
|
||||
@@ -11,14 +10,13 @@ if ($menu) {
|
||||
$current_lang = function_exists('pll_current_language') ? pll_current_language() : null;
|
||||
|
||||
if ($menu_items) {
|
||||
// Чистим заголовок от (переводов)
|
||||
$clean_title = function($title) {
|
||||
return trim(preg_replace('/\s*\([^)]*\)/', '', $title));
|
||||
};
|
||||
|
||||
$current_region = 'RU';
|
||||
|
||||
// Навигационная схема для Яндекса
|
||||
|
||||
$navigation_schema = array(
|
||||
"@context" => "https://schema.org",
|
||||
"@type" => "SiteNavigationElement",
|
||||
@@ -28,13 +26,6 @@ if ($menu) {
|
||||
"areaServed" => $current_region,
|
||||
"url" => array()
|
||||
);
|
||||
|
||||
// Хлебные крошки для Яндекса
|
||||
$breadcrumb_schema = array(
|
||||
"@context" => "https://schema.org",
|
||||
"@type" => "BreadcrumbList",
|
||||
"itemListElement" => array()
|
||||
);
|
||||
?>
|
||||
|
||||
<nav class="main-navigation primary-navigation h-full"
|
||||
@@ -55,7 +46,7 @@ if ($menu) {
|
||||
$url = $item->url;
|
||||
$title = $clean_title($item->title);
|
||||
|
||||
// Polylang
|
||||
// Polylang обработка
|
||||
if ($current_lang && $item->object == 'page' && function_exists('pll_get_post')) {
|
||||
$translated_page_id = pll_get_post($item->object_id, $current_lang);
|
||||
if ($translated_page_id) {
|
||||
@@ -67,15 +58,14 @@ if ($menu) {
|
||||
}
|
||||
}
|
||||
|
||||
// Дата изменения для Яндекса
|
||||
// Дата изменения
|
||||
$last_modified = '';
|
||||
if ($item->object == 'page') {
|
||||
$last_modified = get_the_modified_time('c', $item->object_id);
|
||||
}
|
||||
|
||||
// Активный пункт меню
|
||||
// Определение активного пункта
|
||||
$is_current = false;
|
||||
$current_classes = '';
|
||||
$aria_current = '';
|
||||
|
||||
if (is_page()) {
|
||||
@@ -84,7 +74,6 @@ if ($menu) {
|
||||
if (($current_lang && function_exists('pll_get_post') && pll_get_post($item->object_id, $current_lang) == $post->ID) ||
|
||||
$item->object_id == $post->ID) {
|
||||
$is_current = true;
|
||||
$current_classes = ' current-menu-item active current_page_item';
|
||||
$aria_current = ' aria-current="page"';
|
||||
}
|
||||
}
|
||||
@@ -102,14 +91,14 @@ if ($menu) {
|
||||
if ($is_current) {
|
||||
$css_classes[] = 'current-menu-item';
|
||||
$css_classes[] = 'current_page_item';
|
||||
$css_classes[] = 'active';
|
||||
$css_classes[] = 'border-b border-b-[2px] !border-b-[#e21e24] dark:!border-b-[#fff]';
|
||||
}
|
||||
|
||||
if (!empty($item->classes)) {
|
||||
$css_classes = array_merge($css_classes, array_filter($item->classes));
|
||||
}
|
||||
|
||||
// Схема для Яндекса
|
||||
// Схема навигации
|
||||
$page_data = array(
|
||||
"@type" => "WebPage",
|
||||
"name" => $title,
|
||||
@@ -122,18 +111,11 @@ if ($menu) {
|
||||
}
|
||||
|
||||
$navigation_schema['url'][] = $page_data;
|
||||
|
||||
$breadcrumb_schema['itemListElement'][] = array(
|
||||
"@type" => "ListItem",
|
||||
"position" => $position,
|
||||
"name" => $title,
|
||||
"item" => $url
|
||||
);
|
||||
?>
|
||||
|
||||
<li class="hover:translate-y-[-1px] transition h-full <?php echo esc_attr(implode(' ', $css_classes)); ?>" role="none">
|
||||
<li class="h-full transition border-b border-b-[2px] border-b-[transparent] hover:border-b-[#e21e24] dark:hover:border-b-[#fff] <?php echo esc_attr(implode(' ', $css_classes)); ?>" role="none">
|
||||
<a href="<?php echo esc_url($url); ?>"
|
||||
class="menu-link !no-underline h-full flex items-center"
|
||||
class="menu-link !no-underline h-full flex items-center"
|
||||
role="menuitem"
|
||||
itemprop="url"
|
||||
tabindex="0"<?php echo $aria_current; ?>
|
||||
@@ -143,7 +125,7 @@ if ($menu) {
|
||||
onclick="if(typeof yaCounter !== 'undefined') { yaCounter.reachGoal('menu_click', {item: '<?php echo esc_js($title); ?>'}); }"
|
||||
<?php if ($item->target): ?>target="<?php echo esc_attr($item->target); ?>"<?php endif; ?>
|
||||
<?php if ($item->attr_title): ?>title="<?php echo esc_attr($item->attr_title); ?>"<?php endif; ?>>
|
||||
<span itemprop="name"><?php echo esc_html($title); ?></span>
|
||||
<span class="translate-y-[2px]" itemprop="name"><?php echo esc_html($title); ?></span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
@@ -151,11 +133,12 @@ if ($menu) {
|
||||
// Сепаратор
|
||||
if ($index < count($menu_items) - 1): ?>
|
||||
<li class="menu-separator" role="none" aria-hidden="true">
|
||||
<span class="separator"><svg width="7" height="15" viewBox="0 0 7 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.574219 14.4345L5.55022 0.5625H6.92622L1.93422 14.4345H0.574219Z"
|
||||
class="fill-[#E0E0E0] dark:fill-[#F8F8F8] dark:opacity-20" />
|
||||
</svg>
|
||||
</span>
|
||||
<span class="separator">
|
||||
<svg width="7" height="15" viewBox="0 0 7 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.574219 14.4345L5.55022 0.5625H6.92622L1.93422 14.4345H0.574219Z"
|
||||
class="fill-[#E0E0E0] dark:fill-[#F8F8F8] dark:opacity-20" />
|
||||
</svg>
|
||||
</span>
|
||||
</li>
|
||||
<?php endif;
|
||||
|
||||
@@ -165,16 +148,12 @@ if ($menu) {
|
||||
</nav>
|
||||
|
||||
<?php
|
||||
// Cео
|
||||
// Только схема навигации
|
||||
?>
|
||||
<script type="application/ld+json">
|
||||
<?php echo json_encode($navigation_schema, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES); ?>
|
||||
</script>
|
||||
|
||||
<script type="application/ld+json">
|
||||
<?php echo json_encode($breadcrumb_schema, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES); ?>
|
||||
</script>
|
||||
|
||||
<?php
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user