блоки в админку и фиксы стилей

This commit is contained in:
GP_DEV
2025-06-03 21:52:23 +03:00
parent 32e9eba2ac
commit 9aa5906efa
16 changed files with 3797 additions and 436 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -142,13 +142,10 @@ function enqueue_swiper_assets() {
);
}
// Frontend
add_action('wp_enqueue_scripts', 'enqueue_swiper_assets');
// Admin area
add_action('admin_enqueue_scripts', 'enqueue_swiper_assets');
// Block Editor
add_action('enqueue_block_editor_assets', 'enqueue_swiper_assets');
function display_icon($field_name)
@@ -160,4 +157,12 @@ function display_icon($field_name)
}
}
//test
function wider_language_cols() {
echo '<style>
.wp-list-table td[class*=column-language_],
.wp-list-table th[class*=column-language_] {
width: 3em !important;
}
</style>';
}
add_action('admin_head', 'wider_language_cols');

192
js/app.js
View File

@@ -1 +1,191 @@
(()=>{var e,r={547:()=>{},566:()=>{},988:()=>{window.addEventListener("load",(function(){var e=document.querySelector("#primary-menu");document.querySelector("#primary-menu-toggle").addEventListener("click",(function(r){r.preventDefault(),e.classList.toggle("hidden")}))}))}},t={};function n(e){var o=t[e];if(void 0!==o)return o.exports;var i=t[e]={exports:{}};return r[e](i,i.exports,n),i.exports}n.m=r,e=[],n.O=(r,t,o,i)=>{if(!t){var a=1/0;for(u=0;u<e.length;u++){for(var[t,o,i]=e[u],l=!0,s=0;s<t.length;s++)(!1&i||a>=i)&&Object.keys(n.O).every((e=>n.O[e](t[s])))?t.splice(s--,1):(l=!1,i<a&&(a=i));if(l){e.splice(u--,1);var v=o();void 0!==v&&(r=v)}}return r}i=i||0;for(var u=e.length;u>0&&e[u-1][2]>i;u--)e[u]=e[u-1];e[u]=[t,o,i]},n.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),(()=>{var e={847:0,992:0,252:0};n.O.j=r=>0===e[r];var r=(r,t)=>{var o,i,[a,l,s]=t,v=0;if(a.some((r=>0!==e[r]))){for(o in l)n.o(l,o)&&(n.m[o]=l[o]);if(s)var u=s(n)}for(r&&r(t);v<a.length;v++)i=a[v],n.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return n.O(u)},t=self.webpackChunktailpress=self.webpackChunktailpress||[];t.forEach(r.bind(null,0)),t.push=r.bind(null,t.push.bind(t))})(),n.O(void 0,[992,252],(()=>n(988))),n.O(void 0,[992,252],(()=>n(547)));var o=n.O(void 0,[992,252],(()=>n(566)));o=n.O(o)})();
/******/ (() => { // webpackBootstrap
/******/ var __webpack_modules__ = ({
/***/ "./resources/css/app.css":
/*!*******************************!*\
!*** ./resources/css/app.css ***!
\*******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./resources/css/editor-style.css":
/*!****************************************!*\
!*** ./resources/css/editor-style.css ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./resources/js/app.js":
/*!*****************************!*\
!*** ./resources/js/app.js ***!
\*****************************/
/***/ (() => {
// Navigation toggle
window.addEventListener('load', function () {
var main_navigation = document.querySelector('#primary-menu');
document.querySelector('#primary-menu-toggle').addEventListener('click', function (e) {
e.preventDefault();
main_navigation.classList.toggle('hidden');
});
});
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var [chunkIds, fn, priority] = deferred[i];
/******/ var fulfilled = true;
/******/ for (var j = 0; j < chunkIds.length; j++) {
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ var r = fn();
/******/ if (r !== undefined) result = r;
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "/js/app": 0,
/******/ "css/editor-style": 0,
/******/ "css/app": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var [chunkIds, moreModules, runtime] = data;
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ }
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunktailpress"] = self["webpackChunktailpress"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ __webpack_require__.O(undefined, ["css/editor-style","css/app"], () => (__webpack_require__("./resources/js/app.js")))
/******/ __webpack_require__.O(undefined, ["css/editor-style","css/app"], () => (__webpack_require__("./resources/css/app.css")))
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["css/editor-style","css/app"], () => (__webpack_require__("./resources/css/editor-style.css")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })()
;

View File

@@ -21,3 +21,5 @@
border-color: var(--color-gray-200, currentColor);
}
}

View File

@@ -18,3 +18,4 @@
border-color: var(--color-gray-200, currentColor);
}
}

View File

@@ -4,7 +4,7 @@
padding-right: 5px;
}
@utility alignfull {
/*@utility alignfull {
width: 100vw;
margin: 0 calc(50% - 50vw) !important;
}
@@ -28,4 +28,4 @@
@utility aligncenter {
margin: 0.5rem auto !important;
}
}*/

View File

@@ -13,8 +13,8 @@ if (!empty($block['align'])) {
$class_name .= ' align' . $block['align'];
}
// Получение карт для текущего языка
function get_club_cards_for_current_language() {
if (!function_exists('get_club_cards_for_current_language')) {
function get_club_cards_for_current_language() {
$current_lang = pll_current_language();
$args = array(
@@ -25,16 +25,17 @@ function get_club_cards_for_current_language() {
);
return get_posts($args);
}
}
$cards = get_club_cards_for_current_language();
?>
<div id="<?php echo esc_attr($block_id); ?>" class="container mx-auto <?php echo esc_attr($class_name); ?>">
<div id="<?php echo esc_attr($block_id); ?>" class="container mx-auto mt-[24px] <?php echo esc_attr($class_name); ?>">
<?php if ($cards): ?>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-[24px]">
<?php foreach ($cards as $card): ?>
<div class="club-card rounded-[8px] overflow-hidden hover:shadow-xl transition-shadow duration-[300ms]">
<div class="club-card rounded-[8px] overflow-hidden border transition-shadow ">
<?php if (has_post_thumbnail($card->ID)): ?>
<div class="aspect-video overflow-hidden">
<?php echo get_the_post_thumbnail($card->ID, 'medium', ['class' => 'w-full h-full object-cover']); ?>
@@ -56,7 +57,7 @@ $cards = get_club_cards_for_current_language();
<div class="text-center">
<button data-modal="club-card"
data-card-id="<?php echo $card->ID; ?>"
class="inline-block px-[24px] py-[12px] bg-blue-500 text-white rounded-[6px] hover:bg-blue-600 transition-colors duration-[300ms]">
class="inline-block px-[24px] py-[12px] bg-blue-500 text-white rounded-[6px] hover:bg-blue-600 transition-colors ">
Подробнее
</button>
</div>

View File

@@ -1,7 +1,22 @@
<?php
/**
* Шаблон для блока преимуществ
*/
$id = 'contacts-block-' . $block['id'];
if ( ! empty($block['anchor'] ) ) {
$id = $block['anchor'];
}
$classes = 'block-contacts-block';
if ( ! empty( $block['className'] ) ) {
$classes .= ' ' . $block['className'];
}
if ( ! empty( $block['align'] ) ) {
$classes .= ' align' . $block['align'];
}
$heading = get_field('heading');
$work_time = get_field('work_time');
$address = get_field('address');
$contacts = get_field('contacts');
$blocks = parse_blocks(get_the_content());
$is_first_block = false;
@@ -10,116 +25,122 @@ if (!empty($blocks) && isset($blocks[0]['blockName']) && $blocks[0]['blockName']
$is_first_block = true;
}
$section_padding = $is_first_block ? "pt-[65px] max-[768px]:pt-[35px]" : "pt-[120px] max-[768px]:pt-[70px]";
$section_padding = $is_first_block ? "pt-[64px] max-[768px]:pt-[40px]" : "pt-[80px] max-[768px]:pt-[64px]";
?>
<style>
/* Скрываем, но лучше не нужно по копирайту */
.ymaps-2-1-79-copyright, .ymaps-2-1-79-gototech, .ymaps-2-1-79-gototaxi, .ymaps-2-1-79-gotoymaps,
.ymaps-2-1-79-map-copyrights-promo, .ymaps-2-1-79-copyright__wrap, .ymaps-2-1-79-copyright__content-cell,
[class*="ymaps-2"][class*="copyright"], [class*="ymaps-2"][class*="gototech"],
[class*="ymaps-2"][class*="gototaxi"], [class*="ymaps-2"][class*="gotoymaps"] {
<style type="text/css">
<?php echo '#' . $id; ?> {
}
.ymaps-2-1-79-copyright,
.ymaps-2-1-79-gototech,
.ymaps-2-1-79-gototaxi,
.ymaps-2-1-79-gotoymaps,
.ymaps-2-1-79-map-copyrights-promo,
.ymaps-2-1-79-copyright__wrap,
.ymaps-2-1-79-copyright__content-cell,
[class*="ymaps-2"][class*="copyright"],
[class*="ymaps-2"][class*="gototech"],
[class*="ymaps-2"][class*="gototaxi"],
[class*="ymaps-2"][class*="gotoymaps"] {
display: none !important;
opacity: 0 !important;
visibility: hidden !important;
}
</style>
<section class="<?php echo $section_padding ?> full-layout">
<div class="max-[1200px]:max-w-[640px] max-[768px]:max-w-[340px] hidden max-[1200px]:block mx-auto mb-[-120px] bg-white w-full max-w-[378px] simple-shadow rounded-[25px] relative z-10">
<div class="max-[768px]:pl-[30px] max-[768px]:pt-[30px] max-[768px]:rounded-[20px] pl-[45px] pt-[40px] pb-[40px] relative rounded-[25px] overflow-hidden">
<svg class="absolute bottom-[-55px] right-[-65px]" width="126" height="129" viewBox="0 0 126 129"
fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="60.8145" width="82.2698" height="98.6297" transform="rotate(38.0681 60.8145 0)"
fill="url(#paint0_linear_2001_4983)"/>
<defs>
<linearGradient id="paint0_linear_2001_4983" x1="62.7686" y1="4.14594" x2="131.553" y2="37.4035"
gradientUnits="userSpaceOnUse">
<stop stop-color="#F41C1B"/>
<stop offset="0.435" stop-color="#F72D2C"/>
<stop offset="1" stop-color="#FA4242"/>
</linearGradient>
</defs>
</svg>
<div class="py-[10px] px-[25px] w-full max-w-fit gap-[19px] border border-[#dedede] rounded-[1111px] flex items-center justify-center">
<?php
display_icon('dot');
?>
<span class="font-light text-[14px] leading-[140%] text-[#565656]">Связь с нами</span>
</div>
<div class="max-[768px]:max-w-[240px] flex flex-col gap-[20px]">
<h2 class="max-[768px]:text-[28px] font-bold mt-[25px] text-[45px] leading-[130%] text-[#3f3f3f]">
Контакты</h2>
<div class="max-[768px]:text-[24px] flex flex-col font-semibold text-[28px] leading-[165%] text-[#3f3f3f]">
<p class="max-[768px]:text-[15px] font-light text-[18px] text-[#828282]">Номер телефона:</p>
<a target="_blank" href="tel:<?php echo get_field('phones', 'options')['main_phone'] ?>"
class="hover:text-[#f62322] !decoration-transparent skip-ink transition-colors"
href="tel:+7(800)302-11-85"><?php echo get_field('phones', 'options')['main_phone'] ?></a>
<a target="_blank" href="tel:<?php echo get_field('phones', 'options')['phone'] ?>"
class="hover:text-[#f62322] !decoration-transparent skip-ink transition-colors"
href="tel:+7(911)098-59-77"><?php echo get_field('phones', 'options')['phone'] ?></a>
</div>
<div class="flex flex-col gap-[10px]">
<p class="max-[768px]:text-[15px] font-light text-[18px] text-[#828282]">Головной офис:</p>
<div class="max-[768px]:text-[19px] font-normal text-[23px] leading-[137%] text-[#3f3f3f]">
<?php echo get_field('address', 'options') ?>
</div>
</div>
<div class="flex flex-col gap-[10px]">
<p class="max-[768px]:text-[15px] font-light text-[18px] text-[#828282]">E-mail:</p>
<a class="max-[768px]:text-[19px] hover:text-[#f62322] !decoration-transparent skip-ink transition-colors font-normal text-[23px] leading-[137%] text-[#3f3f3f]"
href="mailto:info@mylogistika2010.ru"><?php echo get_field('email', 'options') ?></a>
</div>
</div>
</div>
</div>
<div id="map-container"
class="max-[1200px]:p-0 max-[1200px]:h-[600px] pt-[90px] pl-[62px] pb-[89px] rounded-[35px] relative">
<div id="map" class="absolute top-0 left-0 w-full h-full rounded-[35px] overflow-hidden z-0"></div>
<div class="max-[1200px]:hidden bg-white w-full max-w-[378px] simple-shadow rounded-[25px] relative z-10">
<div class=" pl-[45px] pt-[40px] pb-[40px] relative rounded-[25px] overflow-hidden">
<svg class="absolute bottom-[-55px] right-[-65px]" width="126" height="129" viewBox="0 0 126 129"
fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="60.8145" width="82.2698" height="98.6297" transform="rotate(38.0681 60.8145 0)"
fill="url(#paint0_linear_2001_4983)"/>
<defs>
<linearGradient id="paint0_linear_2001_4983" x1="62.7686" y1="4.14594" x2="131.553" y2="37.4035"
gradientUnits="userSpaceOnUse">
<stop stop-color="#F41C1B"/>
<stop offset="0.435" stop-color="#F72D2C"/>
<stop offset="1" stop-color="#FA4242"/>
</linearGradient>
</defs>
</svg>
<div class="py-[10px] px-[25px] w-full max-w-fit gap-[19px] border border-[#dedede] rounded-[1111px] flex items-center justify-center">
<?php
display_icon('dot');
?>
<span class="font-light text-[14px] leading-[140%] text-[#565656]">Свяжитесь с нами</span>
</div>
<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 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">
<?php if ($heading) : ?>
<h2 class="text-[36px] max-[768px]:text-[28px] font-bold mb-[30px] text-[#1f2937]">
<?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; ?>
<div class="flex flex-col gap-[20px]">
<h2 class="max-[768px]:text-[28px] max-[1200px]:mb-[20px] font-bold mt-[25px] text-[45px] leading-[130%] text-[#3f3f3f]">
Контакты</h2>
<div class="flex flex-col font-semibold text-[28px] leading-[165%] text-[#3f3f3f]">
<p class=" font-light text-[18px] text-[#828282]">Номер телефона:</p>
<a target="_blank" href="tel:<?php echo get_field('phones', 'options')['main_phone'] ?>"
class="hover:text-[#f62322] !decoration-transparent skip-ink transition-colors"
href="tel:+7(800)302-11-85"><?php echo get_field('phones', 'options')['main_phone'] ?></a>
<a target="_blank" href="tel:<?php echo get_field('phones', 'options')['phone'] ?>"
class="hover:text-[#f62322] !decoration-transparent skip-ink transition-colors"
href="tel:+7(911)098-59-77"><?php echo get_field('phones', 'options')['phone'] ?></a>
<?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 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>
</div>
<div class="flex flex-col gap-[10px]">
<p class="font-light text-[18px] text-[#828282]">Головной офис:</p>
<div class="font-normal text-[23px] leading-[137%] text-[#3f3f3f]">
<?php echo get_field('address', 'options') ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
</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 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; ?>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php endif; ?>
<?php if ($contacts) : ?>
<div>
<?php if (!empty($contacts['phone'])) : ?>
<div class="mb-[16px]">
<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">
<?php echo esc_html($contacts['phone']); ?>
</a>
</div>
<?php endif; ?>
<?php if (!empty($contacts['social_repeater'])) : ?>
<div>
<div class="flex gap-[12px]">
<?php foreach ($contacts['social_repeater'] as $social_item) : ?>
<?php if (!empty($social_item['url'])) : ?>
<a href="<?php echo esc_url($social_item['url']); ?>"
target="_blank"
class="hover:[&>img]:brightness-150 transition">
<?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" />
<?php endif; ?>
</a>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
<div class="flex flex-col gap-[10px]">
<p class="font-light text-[18px] text-[#828282]">E-mail:</p>
<a class="hover:text-[#f62322] !decoration-transparent skip-ink transition-colors font-normal text-[23px] leading-[137%] text-[#3f3f3f]"
href="mailto:info@mylogistika2010.ru"><?php echo get_field('email', 'options') ?></a>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</div>
</div>

View File

@@ -12,7 +12,22 @@ function initGalleryBlock(blockId) {
const swipers = {};
let lightbox;
function initSwiper(tabId) {
function initAllSwipers() {
const tabs = container.querySelectorAll('.tab-button');
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);
}
@@ -22,6 +37,10 @@ function initGalleryBlock(blockId) {
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`,
@@ -32,6 +51,15 @@ function initGalleryBlock(blockId) {
}
}
});
if (wasHidden) {
tabContent.style.visibility = '';
tabContent.style.position = '';
tabContent.classList.add('hidden');
tabContent.classList.remove('block');
}
}
});
}
function initLightbox(tabId) {
@@ -57,7 +85,14 @@ function initGalleryBlock(blockId) {
});
}
// Табы
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', () => {
const tabId = button.getAttribute('data-tab');
@@ -73,17 +108,21 @@ function initGalleryBlock(blockId) {
content.classList.remove('block');
content.classList.add('hidden');
});
container.querySelector(`#tab-${tabId}`).classList.remove('hidden');
container.querySelector(`#tab-${tabId}`).classList.add('block');
setTimeout(() => {
initSwiper(tabId);
const targetTab = container.querySelector(`#tab-${tabId}`);
targetTab.classList.remove('hidden');
targetTab.classList.add('block');
if (swipers[tabId]) {
requestAnimationFrame(() => {
swipers[tabId].update();
});
}
initLightbox(tabId);
}, 100);
});
});
// Thumbnails
container.addEventListener('click', (e) => {
if (e.target.closest('.thumbnail')) {
const thumbnail = e.target.closest('.thumbnail');
@@ -98,13 +137,4 @@ function initGalleryBlock(blockId) {
updateThumbnails(tabId, index);
}
});
const firstTab = container.querySelector('.tab-button.active');
if (firstTab) {
const tabId = firstTab.getAttribute('data-tab');
setTimeout(() => {
initSwiper(tabId);
initLightbox(tabId);
}, 100);
}
}

View File

@@ -1,115 +1,60 @@
<?php
// Моковые данные (потом заменить на ACF поля)
$galleryData = [
'reception' => [
'title' => 'Зона ресепшен',
'images' => [
[
'src' => 'https://placehold.co/800x600/4a5568/ffffff?text=Ресепшен+1',
'thumb' => 'https://placehold.co/150x100/4a5568/ffffff?text=Р1',
'alt' => 'Ресепшен 1'
],
[
'src' => 'https://placehold.co/800x600/2d3748/ffffff?text=Ресепшен+2',
'thumb' => 'https://placehold.co/150x100/2d3748/ffffff?text=Р2',
'alt' => 'Ресепшен 2'
],
[
'src' => 'https://placehold.co/800x600/1a202c/ffffff?text=Ресепшен+3',
'thumb' => 'https://placehold.co/150x100/1a202c/ffffff?text=Р3',
'alt' => 'Ресепшен 3'
],
[
'src' => 'https://placehold.co/800x600/718096/ffffff?text=Ресепшен+4',
'thumb' => 'https://placehold.co/150x100/718096/ffffff?text=Р4',
'alt' => 'Ресепшен 4'
]
]
],
'gym' => [
'title' => 'Зона тренажерного зала',
'images' => [
[
'src' => 'https://placehold.co/800x600/dc2626/ffffff?text=Тренажёрный+1',
'thumb' => 'https://placehold.co/150x100/dc2626/ffffff?text=Т1',
'alt' => 'Тренажерный зал 1'
],
[
'src' => 'https://placehold.co/800x600/b91c1c/ffffff?text=Тренажёрный+2',
'thumb' => 'https://placehold.co/150x100/b91c1c/ffffff?text=Т2',
'alt' => 'Тренажерный зал 2'
],
[
'src' => 'https://placehold.co/800x600/991b1b/ffffff?text=Тренажёрный+3',
'thumb' => 'https://placehold.co/150x100/991b1b/ffffff?text=Т3',
'alt' => 'Тренажерный зал 3'
],
[
'src' => 'https://placehold.co/800x600/7f1d1d/ffffff?text=Тренажёрный+4',
'thumb' => 'https://placehold.co/150x100/7f1d1d/ffffff?text=Т4',
'alt' => 'Тренажерный зал 4'
],
[
'src' => 'https://placehold.co/800x600/ef4444/ffffff?text=Тренажёрный+5',
'thumb' => 'https://placehold.co/150x100/ef4444/ffffff?text=Т5',
'alt' => 'Тренажерный зал 5'
]
]
],
'group' => [
'title' => 'Залы для групповых тренировок',
'images' => [
[
'src' => 'https://placehold.co/800x600/059669/ffffff?text=Групповые+1',
'thumb' => 'https://placehold.co/150x100/059669/ffffff?text=Г1',
'alt' => 'Групповые тренировки 1'
],
[
'src' => 'https://placehold.co/800x600/047857/ffffff?text=Групповые+2',
'thumb' => 'https://placehold.co/150x100/047857/ffffff?text=Г2',
'alt' => 'Групповые тренировки 2'
],
[
'src' => 'https://placehold.co/800x600/065f46/ffffff?text=Групповые+3',
'thumb' => 'https://placehold.co/150x100/065f46/ffffff?text=Г3',
'alt' => 'Групповые тренировки 3'
]
]
]
];
$id = 'gallery-tabs-' . $block['id'];
if ( ! empty($block['anchor'] ) ) {
$id = $block['anchor'];
}
$classes = 'block-gallery-tabs';
if ( ! empty( $block['className'] ) ) {
$classes .= ' ' . $block['className'];
}
if ( ! empty( $block['align'] ) ) {
$classes .= ' align' . $block['align'];
}
$heading = get_field('heading');
$slider_tabs = get_field('slider_tabs');
$block_id = 'gallery-' . $block['id'];
?>
<div class="gallery-block"
id="<?php echo $block_id; ?>"
data-gallery-id="<?php echo $block_id; ?>">
<div class="gallery-block mt-[24px]"
id="<?php echo esc_attr( $id ); ?>"
data-gallery-id="<?php echo esc_attr( $id ); ?>">
<div class="container mx-auto">
<h2 class="text-[32px] font-bold mb-[30px]">Галерея</h2>
<div class="flex gap-[10px] mb-[30px]">
<?php foreach ($galleryData as $index => $tab): ?>
<button class="tab-button px-[24px] py-[12px] border-0 rounded-[25px] cursor-pointer transition-all <?php echo $index === 'reception' ? 'active underline' : ''; ?>"
data-tab="<?php echo $index; ?>">
<?php echo esc_html($tab['title']); ?>
<?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; ?>
</div>
<?php foreach ($galleryData as $tab_id => $tab_data): ?>
<div class="tab-content <?php echo $tab_id === 'reception' ? 'block' : 'hidden'; ?>"
id="tab-<?php echo $tab_id; ?>">
<?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'; ?>"
id="tab-<?php echo $tab_index; ?>">
<div class="swiper gallery-swiper mb-[20px] h-[440px]" id="swiper-<?php echo $tab_id; ?>">
<?php if (!empty($tab['slider_images'])) : ?>
<div class="swiper mt-[24px] gallery-swiper h-[440px]" id="swiper-<?php echo $tab_index; ?>">
<div class="swiper-wrapper">
<?php foreach ($tab_data['images'] as $image): ?>
<?php foreach ($tab['slider_images'] as $image) : ?>
<div class="swiper-slide cursor-pointer min-h-[440px]">
<a href="<?php echo esc_url($image['src']); ?>"
<a href="<?php echo esc_url($image['url']); ?>"
class="glightbox block w-full h-full"
data-gallery="gallery-<?php echo $tab_id; ?>">
<img src="<?php echo esc_url($image['src']); ?>"
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">
</a>
@@ -120,17 +65,22 @@ $block_id = 'gallery-' . $block['id'];
<div class="swiper-button-prev"></div>
</div>
<div class="flex gap-[8px] overflow-x-auto">
<?php foreach ($tab_data['images'] as $thumb_index => $image): ?>
<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['thumb']); ?>"
<img src="<?php echo esc_url($image['sizes']['thumbnail']); ?>"
alt="<?php echo esc_attr($image['alt']); ?>"
class="w-full h-full object-cover">
</div>
<?php endforeach; ?>
</div>
<?php if (!empty($image['caption'])) : ?>
<p><?php echo esc_html($image['caption']); ?></p>
<?php endif; ?>
<?php endif; ?>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>

View File

@@ -12,16 +12,43 @@ function initReviewsBlock(blockId) {
const swipers = {};
let lightbox;
function initSwiper(tabId) {
function initAllSwipers() {
const tabs = container.querySelectorAll('.tab-button');
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: 3,
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');
}
}
});
}
@@ -64,8 +91,14 @@ function initReviewsBlock(blockId) {
});
}
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', () => {
const tabId = button.getAttribute('data-tab');
@@ -81,24 +114,18 @@ function initReviewsBlock(blockId) {
content.classList.remove('block');
content.classList.add('hidden');
});
container.querySelector(`#tab-${tabId}`).classList.remove('hidden');
container.querySelector(`#tab-${tabId}`).classList.add('block');
setTimeout(() => {
initSwiper(tabId);
initLightbox(tabId);
}, 100);
const targetTab = container.querySelector(`#tab-${tabId}`);
targetTab.classList.remove('hidden');
targetTab.classList.add('block');
if (swipers[tabId]) {
requestAnimationFrame(() => {
swipers[tabId].update();
});
});
const firstTab = container.querySelector('.tab-button.active');
if (firstTab) {
const tabId = firstTab.getAttribute('data-tab');
setTimeout(() => {
initSwiper(tabId);
initLightbox(tabId);
}, 100);
}
initLightbox(tabId);
});
});
}

View File

@@ -1,136 +1,153 @@
<?php
// Моковые данные отзывов (потом заменить на ACF поля)
$reviewsData = [
'google' => [
'title' => 'Отзывы Google',
'reviews' => [
[
'src' => 'https://placehold.co/800x600/4f46e5/ffffff?text=Отзыв+Google+1',
'thumb' => 'https://placehold.co/300x200/4f46e5/ffffff?text=G1',
'alt' => 'Отзыв Google 1'
],
[
'src' => 'https://placehold.co/800x600/7c3aed/ffffff?text=Отзыв+Google+2',
'thumb' => 'https://placehold.co/300x200/7c3aed/ffffff?text=G2',
'alt' => 'Отзыв Google 2'
],
[
'src' => 'https://placehold.co/800x600/8b5cf6/ffffff?text=Отзыв+Google+3',
'thumb' => 'https://placehold.co/300x200/8b5cf6/ffffff?text=G3',
'alt' => 'Отзыв Google 3'
],
[
'src' => 'https://placehold.co/800x600/a855f7/ffffff?text=Отзыв+Google+4',
'thumb' => 'https://placehold.co/300x200/a855f7/ffffff?text=G4',
'alt' => 'Отзыв Google 4'
]
]
],
'yandex' => [
'title' => 'Отзывы Яндекс',
'reviews' => [
[
'src' => 'https://placehold.co/800x600/f59e0b/ffffff?text=Отзыв+Яндекс+1',
'thumb' => 'https://placehold.co/300x200/f59e0b/ffffff?text=Я1',
'alt' => 'Отзыв Яндекс 1'
],
[
'src' => 'https://placehold.co/800x600/d97706/ffffff?text=Отзыв+Яндекс+2',
'thumb' => 'https://placehold.co/300x200/d97706/ffffff?text=Я2',
'alt' => 'Отзыв Яндекс 2'
],
[
'src' => 'https://placehold.co/800x600/b45309/ffffff?text=Отзыв+Яндекс+3',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=Я3',
'alt' => 'Отзыв Яндекс 3'
]
]
],
'video' => [
'title' => 'Видеоотзывы',
'reviews' => [
[
'src' => '/path/to/video1.mp4', // Путь к видеофайлу
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В1',
'alt' => 'Видеоотзыв 1',
'type' => 'video',
'video_type' => 'mp4' // Тип видео
],
[
'src' => '/path/to/video2.webm',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В2',
'alt' => 'Видеоотзыв 2',
'type' => 'video',
'video_type' => 'webm'
],
[
'src' => '/path/to/video3.mov',
'thumb' => 'https://placehold.co/300x200/b45309/ffffff?text=В3',
'alt' => 'Видеоотзыв 3',
'type' => 'video',
'video_type' => 'mov'
]
]
]
];
$id = 'reviews-block-' . $block['id'];
if ( ! empty($block['anchor'] ) ) {
$id = $block['anchor'];
}
$block_id = 'reviews-' . $block['id'];
$classes = 'block-reviews-block';
if ( ! empty( $block['className'] ) ) {
$classes .= ' ' . $block['className'];
}
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');
$stars = get_field('stars');
?>
<div class="reviews-block container mx-auto"
id="<?php echo $block_id; ?>"
data-reviews-id="<?php echo $block_id; ?>">
<div class="reviews-block container mx-auto mt-[24px]"
id="<?php echo esc_attr( $id ); ?>"
data-reviews-id="<?php echo esc_attr( $id ); ?>">
<div>
<h2 class="text-[32px] font-bold mb-[30px]">Отзывы клиентов</h2>
<!-- Табы -->
<div class="flex gap-[10px] mb-[30px]">
<?php foreach ($reviewsData as $index => $tab): ?>
<button class="tab-button px-[24px] py-[12px] border-0 rounded-[25px] cursor-pointer transition-all <?php echo $index === 'google' ? 'active underline' : ''; ?>"
data-tab="<?php echo $index; ?>">
<?php echo esc_html($tab['title']); ?>
</button>
<?php endforeach; ?>
</div>
</div>
<!-- Контент табов -->
<?php foreach ($reviewsData as $tab_id => $tab_data): ?>
<div class="tab-content <?php echo $tab_id === 'google' ? 'block' : 'hidden'; ?>"
id="tab-<?php echo $tab_id; ?>">
<!-- Swiper для отзывов -->
<div class="swiper reviews-swiper mb-[20px] h-[440px]" id="swiper-<?php echo $tab_id; ?>">
<div class="swiper-wrapper">
<?php foreach ($tab_data['reviews'] as $review): ?>
<div class="swiper-slide cursor-pointer min-h-[440px]">
<a href="<?php echo esc_url($review['src']); ?>"
class="glightbox block w-full h-full relative"
data-gallery="reviews-<?php echo $tab_id; ?>"
<?php if (isset($review['type']) && $review['type'] === 'video'): ?>
data-type="video"
data-description="<?php echo esc_attr($review['alt']); ?>"
<?php endif; ?>>
<img src="<?php echo esc_url($review['thumb']); ?>"
alt="<?php echo esc_attr($review['alt']); ?>"
class="w-full h-full object-cover rounded-lg">
<?php if (isset($review['type']) && $review['type'] === 'video'): ?>
<!-- Иконка воспроизведения для видео -->
<div class="absolute inset-0 flex items-center justify-center bg-[rgba(0,0,0,0.5)] hover:bg-[rgba(0,0,0,0.1)] transition-all">
<div class="w-[60px] h-[60px] bg-white bg-opacity-90 rounded-full flex items-center justify-center shadow-lg">
<svg class="w-[24px] h-[24px]" fill="currentColor" viewBox="0 0 20 20">
<path d="M8 5v10l8-5-8-5z"/>
</svg>
</div>
</div>
<?php if ($heading) : ?>
<h2 class="text-[32px] font-bold mt-[24px]"><?php echo esc_html($heading); ?></h2>
<?php endif; ?>
<div class="flex gap-[10px] mt-[24px]">
<?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; ?>">
<?php echo esc_html($tab['tab_name']); ?>
</button>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
<?php if ($slider_video_reviews) : ?>
<button class="tab-button px-[24px] py-[12px] border rounded-[25px] 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>
Оценок:  
<?php
echo $stars;
?>
</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'; ?>"
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">
<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">
</a>
</div>
<?php endforeach; ?>
</div>
</div>
<?php endif; ?>
</div>
<?php endforeach; ?>
<?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>
<?php endif; ?>
</div>
</a>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
</div>
</div>
<?php endif; ?>
</div>

View File

@@ -0,0 +1,62 @@
<?php
$id = 'tiles-block-' . $block['id'];
if ( ! empty($block['anchor'] ) ) {
$id = $block['anchor'];
}
$classes = 'block-tiles-block';
if ( ! empty( $block['className'] ) ) {
$classes .= ' ' . $block['className'];
}
if ( ! empty( $block['align'] ) ) {
$classes .= ' align' . $block['align'];
}
$heading = get_field('heading');
$tiles_repeater = get_field('tiles_repeater');
?>
<section id="<?php echo esc_attr( $id ); ?>" class="<?php echo esc_attr( $classes ); ?>">
<div class="container mx-auto mt-[24px]">
<?php if ($heading) : ?>
<h2 class="text-[48px] max-[768px]:text-[36px] font-bold text-center text-[#1f2937]">
<?php echo esc_html($heading); ?>
</h2>
<?php endif; ?>
<?php if ($tiles_repeater) : ?>
<div class="mt-[24px] grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-[30px] max-[768px]:gap-[20px]">
<?php foreach ($tiles_repeater as $tile) : ?>
<div class="bg-[#ffffff] border-[1px] border-[#e5e7eb] rounded-[16px] p-[30px] max-[768px]:p-[20px] shadow-lg hover:shadow-xl transition-shadow duration-300">
<?php if (!empty($tile['image'])) : ?>
<div class="w-[80px] h-[80px] rounded-full overflow-hidden mb-[20px] mx-auto bg-[#f3f4f6] flex items-center justify-center">
<img src="<?php echo esc_url($tile['image']['url']); ?>"
alt="<?php echo esc_attr($tile['image']['alt']); ?>"
class="w-full h-full object-cover" />
</div>
<?php endif; ?>
<?php if (!empty($tile['title'])) : ?>
<h3 class="text-[24px] max-[768px]:text-[20px] font-semibold text-[#1f2937] mb-[16px] text-center">
<?php echo esc_html($tile['title']); ?>
</h3>
<?php endif; ?>
<?php if (!empty($tile['text'])) : ?>
<div class="text-[16px] max-[768px]:text-[14px] text-[#6b7280] leading-[150%] text-center">
<?php echo wp_kses_post($tile['text']); ?>
</div>
<?php endif; ?>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
</section>

View File

@@ -1,7 +1,7 @@
<?php
//test
?>
<div class="bg-black text-white">
<div class="bg-black text-white mt-[24px]">
<div class="mx-auto container">
<div>
Время работы:
@@ -25,4 +25,3 @@
</div>
</div>
/

View File

@@ -73,6 +73,21 @@ function register_acf_blocks() {
),
));
acf_register_block_type(array(
'name' => 'tiles-block',
'title' => __('Блок с плитками'),
'description' => __('Блок с плитками'),
'render_template' => 'template-parts/la-components/blocks/tiles-block/tiles-block.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' => 'reviews-block',
'title' => __('Блок с отзывами'),