Compare commits
5
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 web_103.2
|
2cddd87893 | ||
|
web_103.2
|
709a6e5ecb | ||
 web_55
|
39e8d5a8e1 | ||
|
web_55
|
32834090a1 | ||
|
web_55
|
bea6a20a24 |
No files matched your search
File diff suppressed because it is too large.
Load diff
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
@@ -544,6 +544,36 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}, sizeLG);
|
||||
|
||||
|
||||
// Форматы доставки: слайдер на телефонах и планшетах.
|
||||
document.querySelectorAll('.delivery-orders__slider').forEach(slider => {
|
||||
new ResponsiveSwiper(slider, {
|
||||
slidesPerView: 'auto',
|
||||
spaceBetween: 10,
|
||||
watchOverflow: true,
|
||||
grabCursor: true,
|
||||
breakpoints: {
|
||||
576: { spaceBetween: 20 }
|
||||
}
|
||||
}, sizeLG);
|
||||
});
|
||||
|
||||
|
||||
// Похожие статьи: слайдер на всех экранах
|
||||
document.querySelectorAll('.related-slider').forEach(slider => {
|
||||
new ResponsiveSwiper(slider.querySelector('.related-slider__container'), {
|
||||
slidesPerView: 1.25,
|
||||
spaceBetween: 15,
|
||||
watchOverflow: true,
|
||||
grabCursor: true,
|
||||
breakpoints: {
|
||||
576: { slidesPerView: 1.25, spaceBetween: 20 },
|
||||
768: { slidesPerView: 2.25, spaceBetween: 20 },
|
||||
1024: { slidesPerView: 3, spaceBetween: 20 }
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Слайдер блога
|
||||
const blogSlider = new ResponsiveSwiper('.blog-slider__container', {
|
||||
loop: true,
|
||||
@@ -600,23 +630,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
});
|
||||
|
||||
|
||||
// Скролл длинного содержания статей
|
||||
function initScrollableToc() {
|
||||
const list = document.querySelector('.article-toc__list');
|
||||
if (!list) return;
|
||||
function updateScrollableState() {
|
||||
const isScrollable = list.scrollHeight > list.clientHeight;
|
||||
list.classList.toggle('is-scrollable', isScrollable);
|
||||
}
|
||||
updateScrollableState();
|
||||
window.addEventListener('resize', updateScrollableState);
|
||||
if (document.fonts) {
|
||||
document.fonts.ready.then(updateScrollableState);
|
||||
}
|
||||
}
|
||||
initScrollableToc();
|
||||
|
||||
|
||||
// AJAX-фильтр статей
|
||||
function initArticlesFilter() {
|
||||
const filter = document.querySelector('.articles-filter');
|
||||
|
||||
@@ -0,0 +1,378 @@
|
||||
.courier-services {
|
||||
--services-heading: #172d38;
|
||||
--services-text: #595757;
|
||||
--services-accent: #ae001b;
|
||||
--services-card: #f5f5f9;
|
||||
--logo-size: 70px;
|
||||
box-sizing: border-box;
|
||||
width: min(1280px, calc(100% - 80px));
|
||||
margin: 0 auto;
|
||||
padding: 120px 0 40px;
|
||||
color: var(--services-heading);
|
||||
font-family: "Onest", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.courier-services *,
|
||||
.courier-services *::before,
|
||||
.courier-services *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.courier-services__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.courier-services__title {
|
||||
margin: 0;
|
||||
font-size: 56px;
|
||||
font-weight: 700;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.courier-services__description {
|
||||
margin: 0;
|
||||
color: var(--services-text);
|
||||
font-size: 20px;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.courier-services__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32px;
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.courier-services__navigation {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 12px 20px;
|
||||
}
|
||||
|
||||
.courier-services__navigation-title {
|
||||
margin: 0;
|
||||
font-size: 26px;
|
||||
font-weight: 600;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.courier-services__topics {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.courier-services__topic {
|
||||
display: inline-block;
|
||||
padding: 8px 12px;
|
||||
border: 0;
|
||||
border-radius: 10px;
|
||||
background: #f6f6f6;
|
||||
color: #798079;
|
||||
font: 600 20px / 1.3 "Onest", sans-serif;
|
||||
letter-spacing: -0.01em;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.courier-services__topic:hover {
|
||||
color: var(--services-accent);
|
||||
background: #fff0f2;
|
||||
}
|
||||
|
||||
.courier-services__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 20px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.courier-services__card {
|
||||
position: relative;
|
||||
display: flex;
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
gap: 24px;
|
||||
padding: 24px 32px;
|
||||
border-radius: 20px;
|
||||
background: var(--services-card);
|
||||
box-shadow: inset 0 0 0 1px #ededed;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.courier-services__card:hover,
|
||||
.courier-services__card:active {
|
||||
box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
|
||||
}
|
||||
|
||||
.courier-services__name {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.courier-services__logo {
|
||||
position: relative;
|
||||
display: block;
|
||||
flex: 0 0 var(--logo-size);
|
||||
width: var(--logo-size);
|
||||
height: var(--logo-size);
|
||||
transition: transform 0.25s ease;
|
||||
}
|
||||
|
||||
.courier-services__card:is(:hover, :focus-visible) .courier-services__logo {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.courier-services__logo {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.courier-services picture,
|
||||
.courier-services picture img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.courier-services__logo > img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.courier-services__logo--samokat {
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
background: #ff335f;
|
||||
}
|
||||
|
||||
.courier-services__samokat-symbol {
|
||||
position: absolute;
|
||||
top: 22.857143%;
|
||||
left: calc(50% - 0.5px);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.courier-services__logo--eda {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.courier-services__eda-clip {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0.101429%;
|
||||
width: 99.898571%;
|
||||
height: 100%;
|
||||
mask: url("../img/aggregators/desktop-eda-mask.svg") 0 0 / 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.courier-services__eda-symbol {
|
||||
position: absolute;
|
||||
top: 6.5%;
|
||||
left: -3.5%;
|
||||
width: 87.5%;
|
||||
height: 87.5%;
|
||||
mask: url("../img/aggregators/desktop-eda-symbol-mask.svg") 0 0 / 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.courier-services__lavka-clip {
|
||||
position: absolute;
|
||||
top: 0.04%;
|
||||
left: 0.05%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
mask: url("../img/aggregators/desktop-lavka-mask.svg") 0 0 / 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.courier-services__arrow {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 21px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
color: var(--services-accent);
|
||||
transition: background-color 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
.courier-services__arrow svg {
|
||||
display: block;
|
||||
width: 25%;
|
||||
height: 25%;
|
||||
}
|
||||
|
||||
.courier-services__card:is(:hover, :active, :focus-visible) .courier-services__arrow {
|
||||
background: var(--services-accent);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.courier-services :is(a, button):focus-visible {
|
||||
outline: 2px solid var(--services-accent);
|
||||
outline-offset: 4px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.courier-services__title {
|
||||
font-size: 44px;
|
||||
}
|
||||
|
||||
.courier-services__grid {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.courier-services__navigation-title {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.courier-services__topic {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 899px) {
|
||||
.courier-services {
|
||||
width: calc(100% - 48px);
|
||||
padding-top: 80px;
|
||||
}
|
||||
|
||||
.courier-services__title {
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.courier-services__header {
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.courier-services__description {
|
||||
font-size: 18px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.courier-services__content {
|
||||
margin-top: 40px;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.courier-services__grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.courier-services__navigation {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.courier-services {
|
||||
--logo-size: 32px;
|
||||
width: calc(100% - 40px);
|
||||
padding: 60px 0 40px;
|
||||
}
|
||||
|
||||
.courier-services__header {
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.courier-services__title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.courier-services__description {
|
||||
font-size: 14px;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.courier-services__content {
|
||||
gap: 14px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.courier-services__navigation {
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.courier-services__navigation-title {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.courier-services__topics {
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.courier-services__topic {
|
||||
padding: 4px 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.courier-services__grid {
|
||||
gap: 9px;
|
||||
}
|
||||
|
||||
.courier-services__card {
|
||||
gap: 16px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.courier-services__name {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.courier-services__arrow {
|
||||
top: 11px;
|
||||
right: 13px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.courier-services__eda-clip {
|
||||
mask-image: url("../img/aggregators/mobile-eda-mask.svg");
|
||||
}
|
||||
|
||||
.courier-services__eda-symbol {
|
||||
mask-image: url("../img/aggregators/mobile-eda-symbol-mask.svg");
|
||||
}
|
||||
|
||||
.courier-services__lavka-clip {
|
||||
mask-image: url("../img/aggregators/mobile-lavka-mask.svg");
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 359px) {
|
||||
.courier-services__topics {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.courier-services__topic {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.courier-services__card {
|
||||
padding-right: 12px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,428 @@
|
||||
.delivery-orders {
|
||||
--orders-heading: #172d38;
|
||||
--orders-text: #595757;
|
||||
--orders-accent: #ae001b;
|
||||
box-sizing: border-box;
|
||||
width: min(1280px, calc(100% - 40px));
|
||||
margin: var(--space-section) auto 0;
|
||||
color: var(--orders-heading);
|
||||
font-family: "Onest", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.delivery-orders *,
|
||||
.delivery-orders *::before,
|
||||
.delivery-orders *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.delivery-orders__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 40px;
|
||||
margin-bottom: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.delivery-orders__title {
|
||||
margin: 0;
|
||||
font-size: 56px;
|
||||
font-weight: 700;
|
||||
line-height: 62px;
|
||||
letter-spacing: -0.56px;
|
||||
}
|
||||
|
||||
.delivery-orders__description {
|
||||
margin: 0;
|
||||
color: var(--orders-text);
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
line-height: 30px;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
.delivery-orders__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
grid-template-rows: 396px 285px;
|
||||
grid-auto-rows: 396px;
|
||||
gap: 20px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.delivery-orders__wide {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.delivery-orders__card {
|
||||
--blur-start: 229px;
|
||||
--blur-end: 462px;
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 40px;
|
||||
background: linear-gradient(#f5f5f9, #f9f9f9);
|
||||
color: #fff;
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.delivery-orders__card::after {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
inset: 0;
|
||||
background: rgb(174 0 27 / 50%);
|
||||
content: "";
|
||||
opacity: 0;
|
||||
transition: opacity 180ms ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__image {
|
||||
position: absolute;
|
||||
display: block;
|
||||
max-width: none;
|
||||
object-fit: cover;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__image--cover {
|
||||
inset: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.delivery-orders__card:not(a) {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.delivery-orders__image--food {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 537px;
|
||||
height: 732px;
|
||||
}
|
||||
|
||||
.delivery-orders__image--groceries-backdrop {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 414px;
|
||||
height: 421px;
|
||||
}
|
||||
|
||||
.delivery-orders__image--groceries {
|
||||
top: 0;
|
||||
left: -118px;
|
||||
width: 710px;
|
||||
height: 396px;
|
||||
}
|
||||
|
||||
.delivery-orders__image--parcels {
|
||||
bottom: 0;
|
||||
left: -403px;
|
||||
width: 1409px;
|
||||
height: 786px;
|
||||
}
|
||||
|
||||
.delivery-orders__image--documents {
|
||||
bottom: -229px;
|
||||
left: -11px;
|
||||
width: 1296px;
|
||||
height: 723px;
|
||||
}
|
||||
|
||||
.delivery-orders__blur,
|
||||
.delivery-orders__blur > span {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__blur > span {
|
||||
--blur-step: calc((var(--blur-end) - var(--blur-start)) / 4);
|
||||
-webkit-backdrop-filter: blur(var(--blur-radius));
|
||||
backdrop-filter: blur(var(--blur-radius));
|
||||
mask-image: linear-gradient(
|
||||
transparent calc(var(--blur-start) + var(--blur-step) * var(--blur-index)),
|
||||
#000 calc(var(--blur-start) + var(--blur-step) * (var(--blur-index) + 1))
|
||||
);
|
||||
}
|
||||
|
||||
.delivery-orders__blur > span:nth-child(1) {
|
||||
--blur-index: 0;
|
||||
--blur-radius: 1.8px;
|
||||
}
|
||||
|
||||
.delivery-orders__blur > span:nth-child(2) {
|
||||
--blur-index: 1;
|
||||
--blur-radius: 3.6px;
|
||||
}
|
||||
|
||||
.delivery-orders__blur > span:nth-child(3) {
|
||||
--blur-index: 2;
|
||||
--blur-radius: 5.4px;
|
||||
}
|
||||
|
||||
.delivery-orders__blur > span:nth-child(4) {
|
||||
--blur-index: 3;
|
||||
--blur-radius: 7.2px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--groceries {
|
||||
--blur-start: 233px;
|
||||
--blur-end: 423px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--parcels {
|
||||
--blur-start: 236px;
|
||||
--blur-end: 428px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--documents {
|
||||
--blur-start: 151px;
|
||||
--blur-end: 364px;
|
||||
}
|
||||
|
||||
.delivery-orders__shade {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 163px;
|
||||
background: linear-gradient(transparent, #000);
|
||||
opacity: 0.9;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__card--groceries .delivery-orders__shade {
|
||||
height: 187px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.delivery-orders__card--documents .delivery-orders__shade {
|
||||
height: 138px;
|
||||
}
|
||||
|
||||
.delivery-orders__copy {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
right: 95px;
|
||||
bottom: 32px;
|
||||
left: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__card-title {
|
||||
font-size: 26px;
|
||||
font-weight: 600;
|
||||
line-height: 29px;
|
||||
letter-spacing: -0.26px;
|
||||
}
|
||||
|
||||
.delivery-orders__card-description {
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
line-height: 28px;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--groceries .delivery-orders__copy {
|
||||
right: 40px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--groceries .delivery-orders__card-description {
|
||||
width: 213px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--parcels .delivery-orders__copy {
|
||||
right: 50px;
|
||||
}
|
||||
|
||||
.delivery-orders__card--documents .delivery-orders__copy {
|
||||
right: 103px;
|
||||
}
|
||||
|
||||
.delivery-orders__arrow {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
top: 32px;
|
||||
right: 32px;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.delivery-orders__card--documents .delivery-orders__arrow {
|
||||
right: 33px;
|
||||
}
|
||||
|
||||
.delivery-orders__arrow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
color: var(--orders-accent);
|
||||
transition: color 180ms ease, background-color 180ms ease;
|
||||
}
|
||||
|
||||
.delivery-orders__arrow svg {
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.delivery-orders__card:is(:hover, :focus-visible, :active)::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.delivery-orders__card:is(:hover, :focus-visible, :active) .delivery-orders__arrow {
|
||||
background: var(--orders-accent);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.delivery-orders__card:focus-visible {
|
||||
outline: 3px solid var(--orders-accent);
|
||||
outline-offset: 5px;
|
||||
}
|
||||
|
||||
@media (max-width: 1023.98px) {
|
||||
.delivery-orders__title {
|
||||
font-size: 40px;
|
||||
line-height: 1.1;
|
||||
}
|
||||
.delivery-orders__slider {
|
||||
overflow: visible;
|
||||
}
|
||||
.delivery-orders__grid {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
grid-template-rows: none;
|
||||
}
|
||||
.delivery-orders__grid > li {
|
||||
flex-shrink: 0;
|
||||
width: 340px;
|
||||
height: 300px;
|
||||
}
|
||||
.delivery-orders__card {
|
||||
--blur-start: 120px;
|
||||
--blur-end: 300px;
|
||||
border-radius: 24px;
|
||||
}
|
||||
.delivery-orders__card-title {
|
||||
font-size: 22px;
|
||||
line-height: 1.15;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.delivery-orders__card-description {
|
||||
font-size: 16px;
|
||||
line-height: 1.4;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.delivery-orders__grid.is-grid {
|
||||
gap: 20px;
|
||||
overflow-x: auto;
|
||||
scroll-snap-type: x mandatory;
|
||||
}
|
||||
.delivery-orders__grid.is-grid > li {
|
||||
scroll-snap-align: start;
|
||||
}
|
||||
.delivery-orders__wide {
|
||||
grid-column: auto;
|
||||
}
|
||||
.delivery-orders__copy,
|
||||
.delivery-orders__card--groceries .delivery-orders__copy,
|
||||
.delivery-orders__card--parcels .delivery-orders__copy,
|
||||
.delivery-orders__card--documents .delivery-orders__copy {
|
||||
left: 24px;
|
||||
right: 24px;
|
||||
bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
.delivery-orders {
|
||||
width: calc(100% - 40px);
|
||||
}
|
||||
.delivery-orders__header {
|
||||
gap: 14px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.delivery-orders__title {
|
||||
font-size: 24px;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.24px;
|
||||
}
|
||||
.delivery-orders__description {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
letter-spacing: -0.14px;
|
||||
}
|
||||
.delivery-orders__slider {
|
||||
overflow: visible;
|
||||
}
|
||||
.delivery-orders__grid {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
}
|
||||
.delivery-orders__grid > li {
|
||||
flex-shrink: 0;
|
||||
width: 278px;
|
||||
height: 218px;
|
||||
}
|
||||
.delivery-orders__card {
|
||||
--blur-start: 90px;
|
||||
--blur-end: 218px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
.delivery-orders__grid.is-grid {
|
||||
gap: 10px;
|
||||
}
|
||||
.delivery-orders__copy {
|
||||
gap: 8px;
|
||||
}
|
||||
.delivery-orders__card-title {
|
||||
font-size: 16px;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.16px;
|
||||
}
|
||||
.delivery-orders__card-description {
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: -0.14px;
|
||||
}
|
||||
.delivery-orders__shade {
|
||||
height: 126px;
|
||||
}
|
||||
.delivery-orders__arrow,
|
||||
.delivery-orders__card--documents .delivery-orders__arrow {
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: var(--orders-accent);
|
||||
color: #fff;
|
||||
}
|
||||
.delivery-orders__arrow svg {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.delivery-orders__card::after,
|
||||
.delivery-orders__arrow {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,232 @@
|
||||
.work-formats {
|
||||
--formats-heading: #172d38;
|
||||
--formats-text: #595757;
|
||||
--formats-border: #ededed;
|
||||
--formats-accent: #ae001b;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
width: min(1280px, calc(100% - 80px));
|
||||
margin: var(--space-section) auto 0;
|
||||
flex-direction: column;
|
||||
gap: 60px;
|
||||
color: var(--formats-heading);
|
||||
font-family: "Onest", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.work-formats *,
|
||||
.work-formats *::before,
|
||||
.work-formats *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.work-formats__header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.work-formats__title {
|
||||
width: 964px;
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
font-size: 56px;
|
||||
font-weight: 700;
|
||||
line-height: 62px;
|
||||
letter-spacing: -0.56px;
|
||||
}
|
||||
|
||||
.work-formats__description {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
color: var(--formats-text);
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
.work-formats__groups {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 40px;
|
||||
}
|
||||
|
||||
.work-formats__group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.work-formats__group-title {
|
||||
margin: 0;
|
||||
font-size: 26px;
|
||||
font-weight: 600;
|
||||
line-height: 29px;
|
||||
letter-spacing: -0.26px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.work-formats__links {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.work-formats__links > li {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.work-formats__link {
|
||||
display: flex;
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
min-height: 54px;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 16px 16px 16px 24px;
|
||||
border-radius: 100px;
|
||||
box-shadow: inset 0 0 0 1px var(--formats-border);
|
||||
color: inherit;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 20px;
|
||||
letter-spacing: -0.18px;
|
||||
text-decoration: none;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.work-formats__link:is(:hover, :focus-visible) {
|
||||
background: #f5f5f9;
|
||||
color: var(--formats-accent);
|
||||
}
|
||||
|
||||
.work-formats__link:focus-visible {
|
||||
outline: 2px solid var(--formats-accent);
|
||||
outline-offset: 4px;
|
||||
}
|
||||
|
||||
.work-formats__arrow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 22px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.work-formats__arrow svg {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.work-formats__link {
|
||||
transition: color 0.2s ease, background-color 0.2s ease;
|
||||
}
|
||||
|
||||
.work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
|
||||
transform: translateX(3px);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.work-formats__link,
|
||||
.work-formats__arrow {
|
||||
transition: none;
|
||||
}
|
||||
.work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.work-formats__title {
|
||||
font-size: 44px;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 899px) {
|
||||
.work-formats {
|
||||
width: calc(100% - 48px);
|
||||
gap: 40px;
|
||||
}
|
||||
|
||||
.work-formats__header {
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.work-formats__title {
|
||||
font-size: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.work-formats {
|
||||
width: calc(100% - 40px);
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.work-formats__header {
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.work-formats__title {
|
||||
font-size: 24px;
|
||||
line-height: 26px;
|
||||
letter-spacing: -0.24px;
|
||||
}
|
||||
|
||||
.work-formats__description {
|
||||
font-size: 14px;
|
||||
line-height: 15px;
|
||||
letter-spacing: -0.14px;
|
||||
}
|
||||
|
||||
.work-formats__groups {
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.work-formats__group {
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.work-formats__group-title {
|
||||
font-size: 16px;
|
||||
line-height: 18px;
|
||||
letter-spacing: -0.16px;
|
||||
}
|
||||
|
||||
.work-formats__links {
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.work-formats__link {
|
||||
min-height: 36px;
|
||||
gap: 4px;
|
||||
padding: 11px 11px 11px 16px;
|
||||
font-size: 13px;
|
||||
line-height: 14px;
|
||||
letter-spacing: -0.13px;
|
||||
}
|
||||
|
||||
.work-formats__arrow {
|
||||
flex-basis: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
@@ -0,0 +1,237 @@
|
||||
.work-directions {
|
||||
--directions-background: #f5f5f9;
|
||||
--directions-heading: #172d38;
|
||||
--directions-accent: #ae001b;
|
||||
width: 100%;
|
||||
margin: 0 0 40px;
|
||||
color: var(--directions-heading);
|
||||
font-family: "Onest", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.work-directions,
|
||||
.work-directions *,
|
||||
.work-directions *::before,
|
||||
.work-directions *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.work-directions__grid {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 413fr) minmax(0, 414fr) minmax(0, 413fr);
|
||||
gap: 20px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.work-directions__card {
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
aspect-ratio: 413 / 290;
|
||||
min-height: 200px;
|
||||
align-items: flex-end;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
padding: 32px 16px;
|
||||
border-radius: 20px;
|
||||
background: var(--directions-background);
|
||||
color: inherit;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.work-directions__card--taxi {
|
||||
aspect-ratio: 414 / 290;
|
||||
}
|
||||
|
||||
.work-directions__label {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
.work-directions__vehicle {
|
||||
position: absolute;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
background: var(--directions-background);
|
||||
transform: translateX(-50%);
|
||||
transition: transform 240ms ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.work-directions__vehicle img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
mix-blend-mode: darken;
|
||||
}
|
||||
|
||||
.work-directions__vehicle--scooter {
|
||||
top: 20%;
|
||||
left: calc(50% + 0.5px);
|
||||
width: 55.205811%;
|
||||
aspect-ratio: 228 / 152;
|
||||
}
|
||||
|
||||
|
||||
.work-directions__vehicle--taxi {
|
||||
top: 20%;
|
||||
left: calc(50% - 1px);
|
||||
width: 83.091787%;
|
||||
aspect-ratio: 344 / 151;
|
||||
}
|
||||
|
||||
|
||||
.work-directions__vehicle--van {
|
||||
top: 13.448276%;
|
||||
left: calc(50% - 6.5px);
|
||||
width: 87.651332%;
|
||||
aspect-ratio: 362 / 174;
|
||||
}
|
||||
|
||||
|
||||
.work-directions__arrow {
|
||||
--arrow-scale: 1;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
top: 24px;
|
||||
right: 24px;
|
||||
display: block;
|
||||
width: 51px;
|
||||
height: 51px;
|
||||
}
|
||||
|
||||
.work-directions__arrow {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
color: var(--directions-accent);
|
||||
transition: color 180ms ease, background-color 180ms ease;
|
||||
}
|
||||
.work-directions__arrow svg {
|
||||
display: block;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
.work-directions__card:is(:hover, :focus-visible, :active, .is-active) .work-directions__arrow {
|
||||
background: var(--directions-accent);
|
||||
color: #fff;
|
||||
}
|
||||
.work-directions__card.is-active {
|
||||
box-shadow: inset 0 0 0 1px var(--directions-accent);
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
.work-directions__card:hover {
|
||||
box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
|
||||
}
|
||||
|
||||
|
||||
.work-directions__card:hover .work-directions__vehicle {
|
||||
transform: translateX(-50%) scale(1.04);
|
||||
}
|
||||
}
|
||||
|
||||
.work-directions__card:active {
|
||||
box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
|
||||
}
|
||||
|
||||
.work-directions__card:focus-visible {
|
||||
outline: 2px solid var(--directions-accent);
|
||||
outline-offset: 4px;
|
||||
}
|
||||
|
||||
|
||||
.work-directions__card:is(:active, :focus-visible) .work-directions__vehicle {
|
||||
transform: translateX(-50%) scale(1.04);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 1199px) {
|
||||
|
||||
.work-directions__grid {
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.work-directions__card {
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
|
||||
.work-directions__label {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.work-directions__arrow {
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.work-directions__vehicle,
|
||||
.work-directions__arrow {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
|
||||
.work-directions__grid {
|
||||
grid-template-columns: minmax(0, 163fr) minmax(0, 162fr);
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.work-directions__cargo {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.work-directions__card {
|
||||
height: 155px;
|
||||
min-height: 0;
|
||||
aspect-ratio: auto;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.work-directions__label {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.work-directions__vehicle--scooter {
|
||||
top: 36px;
|
||||
left: calc(50% + 0.5px);
|
||||
width: min(106px, 70%);
|
||||
aspect-ratio: 106 / 70;
|
||||
}
|
||||
|
||||
.work-directions__vehicle--taxi {
|
||||
top: 39px;
|
||||
left: 50%;
|
||||
width: min(138px, 85.185185%);
|
||||
aspect-ratio: 138 / 61;
|
||||
}
|
||||
|
||||
.work-directions__vehicle--van {
|
||||
top: 22px;
|
||||
left: 50%;
|
||||
width: min(181px, 80%);
|
||||
aspect-ratio: 181 / 87;
|
||||
}
|
||||
|
||||
.work-directions__arrow {
|
||||
--arrow-scale: 0.5882352941;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,9 @@
|
||||
@use "mixins" as *;
|
||||
@use "config" as *;
|
||||
@use "courier-services";
|
||||
@use "delivery-orders";
|
||||
@use "formats";
|
||||
@use "work-directions";
|
||||
|
||||
*,
|
||||
*::before,
|
||||
@@ -4232,6 +4236,30 @@ h4 {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.getapp--custom-title .getapp-body__left {
|
||||
min-width: 0;
|
||||
}
|
||||
.getapp--custom-title .getapp-title {
|
||||
font-size: clamp(24px, 11.5691px + 3.3149vw, 54px);
|
||||
font-weight: 700;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -0.01em;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.getapp-title__ending {
|
||||
display: block;
|
||||
}
|
||||
@media (min-width: 1280px) {
|
||||
.getapp--custom-title .getapp-title {
|
||||
width: 731px;
|
||||
max-width: none;
|
||||
}
|
||||
.getapp--custom-title .getapp-stores {
|
||||
margin-top: 55px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
.blog-item__img-link:hover img {
|
||||
transform: scale(1.15);
|
||||
|
||||
@@ -340,17 +340,15 @@ function theme_yandex_metrika() {
|
||||
<!-- Yandex.Metrika counter -->
|
||||
<script type="text/javascript">
|
||||
(function(m,e,t,r,i,k,a){
|
||||
m = mfunction(){ (m.a = m.a[]).push(arguments) };
|
||||
m.l = 1 * new Date();
|
||||
m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
|
||||
m[i].l=1*new Date();
|
||||
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
|
||||
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
|
||||
})(window, document,'script','https://mc.yandex.ru/metrika/tag.js?id=113689913', 'ym');
|
||||
|
||||
ym(113689913, 'init', {ssr:true, webvisor:true, clickmap:true, ecommerce:"dataLayer", referrer: document.referrer, url: location.href, accurateTrackBounce:true, trackLinks:true});
|
||||
</script>
|
||||
<noscript>
|
||||
<div><img src="https://mc.yandex.ru/watch/113689913" style="position:absolute; left:-9999px;" alt="" /></div>
|
||||
</noscript>
|
||||
<noscript><div><img src="https://mc.yandex.ru/watch/113689913" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
|
||||
<!-- /Yandex.Metrika counter -->
|
||||
<?php }
|
||||
add_action('wp_head', 'theme_yandex_metrika', 1);
|
||||
|
||||
@@ -134,7 +134,7 @@
|
||||
<?php if ($toc_items) : ?>
|
||||
<div class="article-toc">
|
||||
<div class="article-toc__title">Содержание</div>
|
||||
<ul class="article-toc__list">
|
||||
<ul class="article-toc__list is-scrollable">
|
||||
<?php foreach ($toc_items as $item) : ?>
|
||||
<li class="article-toc__item">
|
||||
<a href="#<?php echo $item['id']; ?>" class="article-toc__link">
|
||||
|
||||
@@ -0,0 +1,148 @@
|
||||
<?php
|
||||
$page_id = get_queried_object_id();
|
||||
|
||||
$audience = get_field('hero_audience', $page_id);
|
||||
$order_type = get_field('hero_type', $page_id);
|
||||
$hero_title = get_field('hero_title', $page_id);
|
||||
$hero_descr = get_field('hero_descr', $page_id);
|
||||
|
||||
$hero_features = get_field('hero_features', 'option');
|
||||
$hero_scroller = get_field('hero_scroller', 'option');
|
||||
$hero_stores = get_field('download', 'option');
|
||||
$hero_qrcode = get_field('download_qrcode', 'option');
|
||||
?>
|
||||
<section class="hero">
|
||||
<div class="hero-main">
|
||||
<div class="container">
|
||||
<div class="hero-main__body">
|
||||
<div class="hero-main__left">
|
||||
<h1 class="hero-title"><?php
|
||||
echo $audience
|
||||
? 'Приложение для ' . esc_html($audience)
|
||||
: wp_kses_post($hero_title);
|
||||
?></h1>
|
||||
<div class="hero-descr"><?php
|
||||
echo $order_type
|
||||
? 'Скачай Hantico и начни получать заказы ' . esc_html($order_type) . ' уже завтра!'
|
||||
: wp_kses_post($hero_descr);
|
||||
?></div>
|
||||
<div class="hero-buttons">
|
||||
<a href="<?php echo get_permalink(87); ?>" class="hero-buttons__download-btn btn btn--lg btn--red">Скачать приложение</a>
|
||||
<a href="#specs" class="hero-buttons__info-btn btn btn--lg btn--transp-red">Как это работает</a>
|
||||
</div>
|
||||
<?php if ($hero_qrcode) { ?>
|
||||
<div class="hero-qrcode">
|
||||
<div class="hero-qrcode__img">
|
||||
<img
|
||||
src="<?php echo $hero_qrcode['url']; ?>"
|
||||
alt="<?php echo $hero_qrcode['alt']; ?>"
|
||||
width="<?php echo $hero_qrcode['width']; ?>"
|
||||
height="<?php echo $hero_qrcode['height']; ?>"
|
||||
/>
|
||||
</div>
|
||||
<div class="hero-qrcode__info">Наведите камеру<br> на QR-код</div>
|
||||
</div>
|
||||
<?php } if ($hero_stores) { ?>
|
||||
<div class="hero-stores">
|
||||
<a href="<?php echo $hero_stores['rustore']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/rustore.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">RuStore</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['appstore']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/appstore.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">App Store</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['gplay']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/gplay.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">Google Play</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['appgallery']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/appgallery.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">AppGallery</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<div class="hero-main__right">
|
||||
<div class="hero-img">
|
||||
<img
|
||||
src="/wp-content/uploads/main.webp"
|
||||
width="1280"
|
||||
height="1094"
|
||||
alt="фоновое изображение"
|
||||
fetchpriority="high"
|
||||
/>
|
||||
</div>
|
||||
<?php if ($hero_features) : ?>
|
||||
<div class="hero-features">
|
||||
<?php $i = 1; foreach ($hero_features as $item) : ?>
|
||||
<div class="hero-feature">
|
||||
<div class="<?php echo $i === 3 ? 'hero-feature__img' : 'hero-feature__icon'; ?>">
|
||||
<img
|
||||
src="<?php echo $item['icon']['sizes']['medium']; ?>"
|
||||
width="<?php echo $item['icon']['sizes']['medium-width']; ?>"
|
||||
height="<?php echo $item['icon']['sizes']['medium-height']; ?>"
|
||||
alt="<?php echo $item['icon']['alt']; ?>"
|
||||
/>
|
||||
</div>
|
||||
<div class="hero-feature__title"><?php echo $item['title']; ?></div>
|
||||
</div>
|
||||
<?php $i++; endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php if ($hero_scroller) : ?>
|
||||
<div class="hero-scroller" data-scroller data-speed="60">
|
||||
<div class="hero-scroller__track">
|
||||
<ul class="hero-scroller__group">
|
||||
<?php foreach ($hero_scroller as $item) : ?>
|
||||
<li class="hero-scroller__item"><?php echo $item['text']; ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div class="hero-footer">
|
||||
<div class="container">
|
||||
<?php if ($hero_stores) : ?>
|
||||
<div class="hero-stores">
|
||||
<a href="<?php echo $hero_stores['rustore']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/rustore.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">RuStore</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['appstore']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/appstore.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">App Store</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['gplay']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/gplay.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">Google Play</div>
|
||||
</a>
|
||||
<a href="<?php echo $hero_stores['appgallery']; ?>" class="hero-store" target="_blank" rel="noopener">
|
||||
<div class="hero-store__icon">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/appgallery.svg'); ?>" alt="">
|
||||
</div>
|
||||
<div class="hero-store__name">AppGallery</div>
|
||||
</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,65 @@
|
||||
<?php
|
||||
$services_title_fields = get_field('services_title');
|
||||
$services_audience = is_array($services_title_fields) ? ($services_title_fields['audience'] ?? '') : '';
|
||||
$services_order_type = is_array($services_title_fields) ? ($services_title_fields['order_type'] ?? '') : '';
|
||||
$services_title = ($services_audience || $services_order_type)
|
||||
? sprintf('Быстрая регистрация и заказы для %s из популярных агрегаторов %s', $services_audience, $services_order_type)
|
||||
: '';
|
||||
$services_description = get_field('services_description');
|
||||
$services_title_links = get_field('services_title_links');
|
||||
$services_links = get_field('services_links') ?: [];
|
||||
$services_repeat = get_field('services_repeat') ?: [];
|
||||
if (!$services_title && !$services_repeat) {
|
||||
return;
|
||||
}
|
||||
?>
|
||||
<section class="courier-services"<?php if ($services_title) : ?> aria-labelledby="courier-services-title"<?php endif; ?>>
|
||||
<?php if ($services_title || $services_description) : ?>
|
||||
<header class="courier-services__header">
|
||||
<?php if ($services_title) : ?>
|
||||
<h2 class="courier-services__title" id="courier-services-title"><?php echo esc_html($services_title); ?></h2>
|
||||
<?php endif; ?>
|
||||
<?php if ($services_description) : ?>
|
||||
<p class="courier-services__description">С Hantico проще выбрать подходящий сервис <?php echo esc_html($services_description); ?>, пройти регистрацию и начать получать заказы.</p>
|
||||
<?php endif; ?>
|
||||
</header>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($services_links || $services_repeat) : ?>
|
||||
<div class="courier-services__content">
|
||||
<?php if ($services_links) : ?>
|
||||
<nav class="courier-services__navigation" aria-label="О работе курьером">
|
||||
<?php if ($services_title_links) : ?>
|
||||
<p class="courier-services__navigation-title"><?php echo esc_html($services_title_links); ?></p>
|
||||
<?php endif; ?>
|
||||
<div class="courier-services__topics">
|
||||
<?php foreach ($services_links as $item) : ?>
|
||||
<?php if (empty($item['name']) || empty($item['url'])) continue; ?>
|
||||
<a class="courier-services__topic" href="<?php echo esc_url($item['url']); ?>"><?php echo esc_html($item['name']); ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</nav>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($services_repeat) : ?>
|
||||
<ul class="courier-services__grid" aria-label="Сервисы доставки">
|
||||
<?php foreach ($services_repeat as $item) : ?>
|
||||
<?php
|
||||
if (empty($item['name']) || empty($item['link'])) continue;
|
||||
$logo = $item['img'] ?? [];
|
||||
?>
|
||||
<li>
|
||||
<a class="courier-services__card" target="_blank" href="<?php echo esc_url($item['link']); ?>" aria-label="<?php echo esc_attr(sprintf('Подключиться к сервису «%s» через Hantico', $item['name'])); ?>">
|
||||
<?php if (!empty($logo['url'])) : ?>
|
||||
<span class="courier-services__logo"><img src="<?php echo esc_url($logo['url']); ?>" alt="" loading="lazy" decoding="async"></span>
|
||||
<?php endif; ?>
|
||||
<span class="courier-services__name"><?php echo esc_html($item['name']); ?></span>
|
||||
<span class="courier-services__arrow" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none" focusable="false"><path d="M12.5537 7.72367L10.6267 7.71891L10.6369 3.27442L1.36107 12.5326L0.00014086 11.1689L9.25079 1.93597L4.8608 1.92575L4.86557 0.000152722L12.5721 0.0178628L12.5537 7.72367Z" fill="currentColor"/></svg></span>
|
||||
</a>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</section>
|
||||
@@ -0,0 +1,59 @@
|
||||
<?php
|
||||
$available_title = get_field('available_title');
|
||||
$available_description = get_field('available_description');
|
||||
$available_items = get_field('available_arr') ?: [];
|
||||
$available_items = array_values(array_filter($available_items, static function ($item) {
|
||||
return !empty($item['title']);
|
||||
}));
|
||||
if (!$available_title && !$available_items) {
|
||||
return;
|
||||
}
|
||||
?>
|
||||
<section class="delivery-orders articles--slider"<?php if ($available_title) : ?> aria-labelledby="delivery-orders-title"<?php endif; ?>>
|
||||
<?php if ($available_title || $available_description) : ?>
|
||||
<header class="delivery-orders__header">
|
||||
<?php if ($available_title) : ?>
|
||||
<h2 class="delivery-orders__title" id="delivery-orders-title">Какие заказы доступны <?php echo esc_html($available_title); ?></h2>
|
||||
<?php endif; ?>
|
||||
<?php if ($available_description) : ?>
|
||||
<p class="delivery-orders__description">Выбирайте подходящий формат <?php echo esc_html($available_description); ?> и получайте заказы через сервисы, доступные в Hantico.</p>
|
||||
<?php endif; ?>
|
||||
</header>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($available_items) : ?>
|
||||
<div class="delivery-orders__slider swiper swiper-full">
|
||||
<ul class="delivery-orders__grid swiper-wrapper is-grid" aria-label="Форматы доставки">
|
||||
<?php foreach ($available_items as $index => $item) : ?>
|
||||
<?php
|
||||
$is_wide = ($index + 1) % 4 === 0;
|
||||
$image = $item['img'] ?? [];
|
||||
$url = $item['url'] ?? '';
|
||||
?>
|
||||
<li class="swiper-slide<?php if ($is_wide) echo ' delivery-orders__wide'; ?>">
|
||||
<?php if ($url) : ?>
|
||||
<a class="delivery-orders__card<?php if ($is_wide) echo ' delivery-orders__card--documents'; ?>" href="<?php echo esc_url($url); ?>">
|
||||
<?php else : ?>
|
||||
<div class="delivery-orders__card<?php if ($is_wide) echo ' delivery-orders__card--documents'; ?>">
|
||||
<?php endif; ?>
|
||||
<?php if (!empty($image['url'])) : ?>
|
||||
<img class="delivery-orders__image delivery-orders__image--cover" src="<?php echo esc_url($image['url']); ?>" alt="" loading="lazy" decoding="async">
|
||||
<?php endif; ?>
|
||||
<span class="delivery-orders__blur" aria-hidden="true"><span></span><span></span><span></span><span></span></span>
|
||||
<span class="delivery-orders__shade" aria-hidden="true"></span>
|
||||
<?php if ($url) : ?>
|
||||
<span class="delivery-orders__arrow" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none" focusable="false"><path d="M12.5537 7.72367L10.6267 7.71891L10.6369 3.27442L1.36107 12.5326L0.00014086 11.1689L9.25079 1.93597L4.8608 1.92575L4.86557 0.000152722L12.5721 0.0178628L12.5537 7.72367Z" fill="currentColor"/></svg></span>
|
||||
<?php endif; ?>
|
||||
<span class="delivery-orders__copy">
|
||||
<span class="delivery-orders__card-title"><?php echo esc_html($item['title']); ?></span>
|
||||
<?php if (!empty($item['description'])) : ?>
|
||||
<span class="delivery-orders__card-description"><?php echo esc_html($item['description']); ?></span>
|
||||
<?php endif; ?>
|
||||
</span>
|
||||
<?php if ($url) : ?></a><?php else : ?></div><?php endif; ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</section>
|
||||
@@ -0,0 +1,54 @@
|
||||
<?php
|
||||
$formats_title = get_field('formats_title');
|
||||
$formats_description = get_field('formats_description');
|
||||
$formats_groups = get_field('formats_arr') ?: [];
|
||||
if (!$formats_title && !$formats_description && !$formats_groups) {
|
||||
return;
|
||||
}
|
||||
$formats_id = wp_unique_id('work-formats-');
|
||||
?>
|
||||
<section class="work-formats"<?php if ($formats_title) : ?> aria-labelledby="<?php echo esc_attr($formats_id); ?>"<?php endif; ?>>
|
||||
<?php if ($formats_title || $formats_description) : ?>
|
||||
<header class="work-formats__header">
|
||||
<?php if ($formats_title) : ?>
|
||||
<h2 class="work-formats__title" id="<?php echo esc_attr($formats_id); ?>">Выберите подходящий формат работы <?php echo esc_html($formats_title); ?></h2>
|
||||
<?php endif; ?>
|
||||
<?php if ($formats_description) : ?>
|
||||
<p class="work-formats__description">Выбирайте удобный график, формат <?php echo esc_html($formats_description); ?> и условия работы</p>
|
||||
<?php endif; ?>
|
||||
</header>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($formats_groups) : ?>
|
||||
<div class="work-formats__groups">
|
||||
<?php foreach ($formats_groups as $index => $group) : ?>
|
||||
<?php
|
||||
$links = array_filter(($group['links'] ?? []), static function ($link) {
|
||||
return !empty($link['name']) && !empty($link['url']);
|
||||
});
|
||||
if (!$links) continue;
|
||||
$group_id = $formats_id . '-group-' . $index;
|
||||
?>
|
||||
<nav class="work-formats__group"<?php if (!empty($group['title'])) : ?> aria-labelledby="<?php echo esc_attr($group_id); ?>"<?php else : ?> aria-label="Форматы работы"<?php endif; ?>>
|
||||
<?php if (!empty($group['title'])) : ?>
|
||||
<h3 class="work-formats__group-title" id="<?php echo esc_attr($group_id); ?>"><?php echo esc_html($group['title']); ?></h3>
|
||||
<?php endif; ?>
|
||||
<ul class="work-formats__links">
|
||||
<?php foreach ($links as $link) : ?>
|
||||
<li>
|
||||
<a class="work-formats__link" href="<?php echo esc_url($link['url']); ?>">
|
||||
<?php echo esc_html($link['name']); ?>
|
||||
<span class="work-formats__arrow" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" fill="none" focusable="false">
|
||||
<path d="M12.1289 5.75517C12.2399 5.66259 12.368 5.59279 12.506 5.54976C12.644 5.50673 12.7891 5.49131 12.933 5.50439C13.077 5.51747 13.2169 5.55878 13.3449 5.62597C13.4728 5.69316 13.5863 5.78491 13.6788 5.89597L17.3451 10.296C17.4417 10.4064 17.5152 10.535 17.5613 10.6742C17.6075 10.8134 17.6253 10.9605 17.6138 11.1067C17.6023 11.2529 17.5616 11.3954 17.4942 11.5256C17.4268 11.6559 17.3341 11.7714 17.2214 11.8653C17.1087 11.9592 16.9784 12.0296 16.8381 12.0724C16.6978 12.1152 16.5504 12.1295 16.4045 12.1145C16.2586 12.0994 16.1171 12.0554 15.9885 11.9849C15.8599 11.9144 15.7467 11.8189 15.6555 11.704L11.9881 7.30397C11.8015 7.07988 11.7114 6.79086 11.7379 6.50042C11.7643 6.20999 11.9049 5.94193 12.1289 5.75517Z" fill-rule="evenodd" clip-rule="evenodd" fill="currentColor"/>
|
||||
<path d="M12.1289 16.2447C11.9049 16.058 11.7643 15.7899 11.7379 15.4995C11.7114 15.209 11.8015 14.92 11.9881 14.6959L15.6555 10.2959C15.7467 10.181 15.8599 10.0855 15.9885 10.015C16.1171 9.94452 16.2586 9.90046 16.4045 9.88543C16.5504 9.8704 16.6978 9.8847 16.8381 9.92749C16.9784 9.97028 17.1087 10.0407 17.2214 10.1346C17.3341 10.2285 17.4268 10.344 17.4942 10.4743C17.5616 10.6045 17.6023 10.747 17.6138 10.8932C17.6253 11.0394 17.6075 11.1865 17.5613 11.3257C17.5152 11.4649 17.4417 11.5935 17.3451 11.7039L13.6788 16.1039C13.5863 16.215 13.4728 16.3067 13.3449 16.3739C13.2169 16.4411 13.077 16.4824 12.933 16.4955C12.7891 16.5086 12.644 16.4932 12.506 16.4501C12.368 16.4071 12.2399 16.3373 12.1289 16.2447Z" fill-rule="evenodd" clip-rule="evenodd" fill="currentColor"/>
|
||||
<path d="M15.3999 11C15.3999 11.2918 15.284 11.5716 15.0777 11.7778C14.8714 11.9841 14.5916 12.1 14.2999 12.1L5.4999 12.1C5.20817 12.1 4.92838 11.9841 4.72209 11.7778C4.5158 11.5716 4.3999 11.2918 4.3999 11C4.3999 10.7083 4.5158 10.4285 4.72209 10.2222C4.92838 10.0159 5.20817 9.90002 5.4999 9.90002L14.2999 9.90003C14.5916 9.90003 14.8714 10.0159 15.0777 10.2222C15.284 10.4285 15.3999 10.7083 15.3999 11Z" fill-rule="evenodd" clip-rule="evenodd" fill="currentColor"/>
|
||||
</svg></span>
|
||||
</a>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</nav>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</section>
|
||||
@@ -1,14 +1,17 @@
|
||||
<?php
|
||||
$cta_title = get_field('cta_title');
|
||||
$getapp_stores = get_field('download', 'option');
|
||||
$getapp_qrcode = get_field('download_qrcode', 'option');
|
||||
if ($getapp_stores && $getapp_qrcode) :
|
||||
?>
|
||||
<section class="getapp">
|
||||
<section class="getapp<?php if ($cta_title) echo ' getapp--custom-title'; ?>">
|
||||
<div class="container">
|
||||
<div class="getapp-body">
|
||||
<div class="getapp-body__left">
|
||||
<h2 class="getapp-title">Скачай и начни уже сегодня</h2>
|
||||
<h2 class="getapp-title"><?php if ($cta_title) : ?>Скачай и начни получать заказы на <?php echo esc_html($cta_title); ?><span class="getapp-title__ending">уже завтра!</span><?php else : ?>Скачай и начни уже сегодня<?php endif; ?></h2>
|
||||
<?php if (!$cta_title) : ?>
|
||||
<div class="getapp-descr">Hantico есть на всех платформах. Установи приложение, пройди регистрацию — и через 15 минут ты готов к первому заказу</div>
|
||||
<?php endif; ?>
|
||||
<div class="getapp-stores">
|
||||
<a href="<?php echo $getapp_stores['appstore']; ?>" class="getapp-store" target="_blank" rel="noopener">
|
||||
<div class="getapp-store__icon">
|
||||
|
||||
@@ -14,29 +14,41 @@
|
||||
|
||||
$this_page_id = get_the_ID();
|
||||
|
||||
$income_title = get_field('calculator_title', $this_page_id)
|
||||
?: get_field('income_title', $page_id);
|
||||
$calculator_type = get_field('calculator_type', $this_page_id);
|
||||
if (is_array($calculator_type)) {
|
||||
$calculator_type = $calculator_type['value'] ?? '';
|
||||
}
|
||||
if (!in_array($calculator_type, array('taxi', 'courier', 'cargo'), true)) {
|
||||
$calculator_type = '';
|
||||
}
|
||||
$selected_type = $calculator_type ?: ($is_courier ? 'courier' : ($is_cargo ? 'cargo' : 'taxi'));
|
||||
$calculator_title = get_field('calculator_title', $this_page_id);
|
||||
$income_title = $calculator_title
|
||||
? 'Калькулятор дохода ' . esc_html($calculator_title)
|
||||
: get_field('income_title', $page_id);
|
||||
$income_descr = get_field('income_descr', $page_id);
|
||||
if ($income_title && $income_descr) :
|
||||
if ($income_title && ($calculator_title || $income_descr)) :
|
||||
?>
|
||||
<section class="income">
|
||||
<div class="container">
|
||||
<h2 class="income-title section-title"><?php echo $income_title; ?></h2>
|
||||
<?php if (!$calculator_title && $income_descr) : ?>
|
||||
<div class="income-descr section-descr"><?php echo $income_descr; ?></div>
|
||||
<form class="income-calc<?php if ($is_driver || $is_courier || $is_cargo) echo ' income-calc--single'; ?>">
|
||||
<?php endif; ?>
|
||||
<form class="income-calc<?php if ($calculator_type || $is_driver || $is_courier || $is_cargo) echo ' income-calc--single'; ?>">
|
||||
<div class="income-calc__top">
|
||||
<fieldset class="income-calc__types">
|
||||
<legend class="visually-hidden">Тип занятости</legend>
|
||||
<label class="income-calc__type income-calc__type--taxi">
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="taxi"<?php if (!$is_courier && !$is_cargo) echo ' checked'; ?>>
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="taxi"<?php if ($selected_type === 'taxi') echo ' checked'; ?>>
|
||||
<span class="income-calc__type-label">Такси</span>
|
||||
</label>
|
||||
<label class="income-calc__type income-calc__type--courier">
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="courier"<?php if ($is_courier) echo ' checked'; ?>>
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="courier"<?php if ($selected_type === 'courier') echo ' checked'; ?>>
|
||||
<span class="income-calc__type-label">Курьер</span>
|
||||
</label>
|
||||
<label class="income-calc__type income-calc__type--cargo">
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="cargo"<?php if ($is_cargo) echo ' checked'; ?>>
|
||||
<input class="income-calc__type-input js-calc-type" type="radio" name="work_type" value="cargo"<?php if ($selected_type === 'cargo') echo ' checked'; ?>>
|
||||
<span class="income-calc__type-label">Грузоперевозки</span>
|
||||
</label>
|
||||
</fieldset>
|
||||
|
||||
@@ -1,15 +1,44 @@
|
||||
<?php
|
||||
$post_type = get_post_type();
|
||||
$current_post_id = get_the_ID();
|
||||
$current_post_id = is_singular() ? get_queried_object_id() : get_the_ID();
|
||||
$post_type = get_post_type($current_post_id);
|
||||
$selected_articles = get_field('article_category', $current_post_id) ?: [];
|
||||
if (!$selected_articles) {
|
||||
$article_field = get_field_object('article_category', $current_post_id, false, false);
|
||||
if ($article_field) {
|
||||
return;
|
||||
}
|
||||
// Also detect an available field that has never been saved on this page.
|
||||
foreach (acf_get_field_groups(['post_id' => $current_post_id]) as $field_group) {
|
||||
foreach (acf_get_fields($field_group) ?: [] as $field) {
|
||||
if ($field['name'] === 'article_category') {
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$selected_ids = [];
|
||||
foreach ($selected_articles as $row) {
|
||||
$article = $row['post'] ?? null;
|
||||
$article_id = $article instanceof WP_Post ? $article->ID : (int) $article;
|
||||
if ($article_id > 0 && $article_id !== $current_post_id) {
|
||||
$selected_ids[] = $article_id;
|
||||
}
|
||||
}
|
||||
$terms = get_the_terms($current_post_id, 'article_category');
|
||||
$related_args = [
|
||||
'post_type' => $post_type,
|
||||
'post_type' => $post_type === 'news' ? 'news' : 'article',
|
||||
'posts_per_page' => 6,
|
||||
'post__not_in' => [$current_post_id],
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC'
|
||||
];
|
||||
if ($terms) {
|
||||
if ($selected_ids) {
|
||||
$related_args['post_type'] = 'article';
|
||||
$related_args['post__in'] = $selected_ids;
|
||||
$related_args['posts_per_page'] = -1;
|
||||
$related_args['orderby'] = 'post__in';
|
||||
} elseif ($terms && !is_wp_error($terms)) {
|
||||
$term_ids = wp_list_pluck($terms, 'term_id');
|
||||
$related_args['tax_query'] = [
|
||||
[
|
||||
@@ -20,20 +49,42 @@
|
||||
];
|
||||
}
|
||||
$related_query = new WP_Query($related_args);
|
||||
if ($selected_ids) {
|
||||
// WP_Query removes duplicates; restore the exact order and rows from ACF.
|
||||
$posts_by_id = [];
|
||||
foreach ($related_query->posts as $selected_post) {
|
||||
$posts_by_id[$selected_post->ID] = $selected_post;
|
||||
}
|
||||
$related_query->posts = [];
|
||||
foreach ($selected_ids as $selected_id) {
|
||||
if (isset($posts_by_id[$selected_id])) {
|
||||
$related_query->posts[] = $posts_by_id[$selected_id];
|
||||
}
|
||||
}
|
||||
$related_query->post_count = count($related_query->posts);
|
||||
}
|
||||
|
||||
if ($related_query->have_posts()) :
|
||||
$title = $post_type === 'news' ? 'Другие новости' : 'Вам также может понравиться';
|
||||
$blog_title = get_field('blog_title', $current_post_id);
|
||||
$title = $blog_title
|
||||
? 'Полезные материалы для ' . $blog_title . ' от Hantico'
|
||||
: ($post_type === 'news' ? 'Другие новости' : 'Вам также может понравиться');
|
||||
?>
|
||||
<section class="articles articles--block">
|
||||
<section class="articles articles--block articles--slider">
|
||||
<div class="container">
|
||||
<h2 class="articles-title articles-title--lg"><?php echo $title; ?></h2>
|
||||
<div class="articles-grid">
|
||||
<h2 class="articles-title articles-title--lg"><?php echo esc_html($title); ?></h2>
|
||||
<div class="related-slider">
|
||||
<div class="related-slider__container swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<?php
|
||||
while ($related_query->have_posts()) {
|
||||
$related_query->the_post();
|
||||
get_template_part('template-parts/articles-item');
|
||||
get_template_part('template-parts/articles-item', null, ['class' => 'swiper-slide']);
|
||||
} wp_reset_postdata();
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<?php endif; ?>
|
||||
@@ -1,5 +1,7 @@
|
||||
<?php
|
||||
$this_page_id = get_the_ID();
|
||||
$review_title = get_field('review_title', $this_page_id);
|
||||
$review_type = get_field('review_type', $this_page_id);
|
||||
$reviews = get_field('review_arr', $this_page_id);
|
||||
|
||||
$reviews_args = [
|
||||
@@ -29,8 +31,8 @@
|
||||
<section class="reviews reviews--block">
|
||||
<div class="reviews-header">
|
||||
<div class="container">
|
||||
<h2 class="reviews-title section-title">Отзывы наших клиентов</h2>
|
||||
<div class="reviews-descr section-descr">Живые истории водителей и курьеров, которые подключились к Hantico</div>
|
||||
<h2 class="reviews-title section-title">Что говорят <?php echo esc_html($review_title ?: 'пользователи'); ?> о Hantico</h2>
|
||||
<div class="reviews-descr section-descr">Реальные истории <?php echo esc_html($review_type ?: 'пользователей'); ?>, которые подключились к Hantico</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="reviews-slider">
|
||||
|
||||
@@ -0,0 +1,29 @@
|
||||
<?php
|
||||
/*
|
||||
Template Name: {Аудитория}
|
||||
*/
|
||||
?>
|
||||
|
||||
|
||||
<?php get_header(); ?>
|
||||
|
||||
<main class="main">
|
||||
|
||||
<?php get_template_part('template-parts/audience/hero'); ?>
|
||||
<?php get_template_part('template-parts/courier-services'); ?>
|
||||
<?php get_template_part('template-parts/income'); ?>
|
||||
<?php get_template_part('template-parts/advantages'); ?>
|
||||
<?php get_template_part('template-parts/delivery-orders'); ?>
|
||||
<?php get_template_part('template-parts/payments'); ?>
|
||||
<?php get_template_part('template-parts/scheme'); ?>
|
||||
<?php get_template_part('template-parts/requirements'); ?>
|
||||
<?php get_template_part('template-parts/formats'); ?>
|
||||
<?php get_template_part('template-parts/reviews'); ?>
|
||||
<?php get_template_part('template-parts/faq'); ?>
|
||||
<?php get_template_part('template-parts/getapp'); ?>
|
||||
<?php get_template_part('template-parts/related'); ?>
|
||||
<?php get_template_part('template-parts/specs'); ?>
|
||||
|
||||
</main>
|
||||
|
||||
<?php get_footer(); ?>
|
||||
@@ -36,7 +36,7 @@ Template Name: Блог
|
||||
</div>
|
||||
|
||||
<div class="blog-header__action">
|
||||
<a href="/about/" class="blog-item__read-btn btn btn--md btn--transp-red ">О редакции</a>
|
||||
<a href="/about/" class="header-buttons__download-btn btn btn--red">О редакции</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
@@ -46,11 +46,27 @@ Template Name: Блог
|
||||
$blog_url = $section_urls[$current_section];
|
||||
?>
|
||||
|
||||
<div class="blog-links">
|
||||
<?php foreach (['taxi' => 'Таксисты', 'courier' => 'Курьеры', 'cargo' => 'Грузоперевозчики'] as $section => $label) : ?>
|
||||
<a href="<?php echo esc_url($section_urls[$section]); ?>" class="blog-item__read-btn btn btn--md btn--transp-red <?php if ($current_section === (string) $section) echo ' active'; ?>"<?php if ($current_section === (string) $section) echo ' aria-current="page"'; ?>><?php echo esc_html($label); ?></a>
|
||||
<nav class="work-directions" aria-label="Разделы блога Hantico">
|
||||
<ul class="work-directions__grid">
|
||||
<?php
|
||||
$directions = [
|
||||
'courier' => ['label' => 'Курьерам', 'vehicle' => 'scooter'],
|
||||
'taxi' => ['label' => 'Таксистам', 'vehicle' => 'taxi'],
|
||||
'cargo' => ['label' => 'Грузоперевозчикам', 'vehicle' => 'van'],
|
||||
];
|
||||
foreach ($directions as $section => $direction) :
|
||||
$is_current = $current_section === $section;
|
||||
?>
|
||||
<li<?php if ($section === 'cargo') echo ' class="work-directions__cargo"'; ?>>
|
||||
<a class="work-directions__card work-directions__card--<?php echo esc_attr($section); ?><?php if ($is_current) echo ' is-active'; ?>" href="<?php echo esc_url($section_urls[$section]); ?>"<?php if ($is_current) echo ' aria-current="page"'; ?>>
|
||||
<span class="work-directions__vehicle work-directions__vehicle--<?php echo esc_attr($direction['vehicle']); ?>" aria-hidden="true"><img src="<?php echo esc_url(get_theme_file_uri('assets/img/work-directions/' . $direction['vehicle'] . '.webp')); ?>" alt="" loading="lazy" decoding="async"></span>
|
||||
<span class="work-directions__label"><?php echo esc_html($direction['label']); ?></span>
|
||||
<span class="work-directions__arrow" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none" focusable="false"><path d="M12.5537 7.72367L10.6267 7.71891L10.6369 3.27442L1.36107 12.5326L0.00014086 11.1689L9.25079 1.93597L4.8608 1.92575L4.86557 0.000152722L12.5721 0.0178628L12.5537 7.72367Z" fill="currentColor"/></svg></span>
|
||||
</a>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="blog-slider">
|
||||
<div class="blog-slider__container swiper swiper-fade">
|
||||
|
||||
@@ -10,13 +10,15 @@ Template Name: Курьерам
|
||||
<main class="main">
|
||||
|
||||
<?php get_template_part('template-parts/hero'); ?>
|
||||
<?php get_template_part('template-parts/services'); ?>
|
||||
<?php get_template_part('template-parts/income'); ?>
|
||||
<?php get_template_part('template-parts/advantages'); ?>
|
||||
<?php get_template_part('template-parts/scheme'); ?>
|
||||
<?php get_template_part('template-parts/payments'); ?>
|
||||
<?php get_template_part('template-parts/requirements'); ?>
|
||||
<?php get_template_part('template-parts/cities'); ?>
|
||||
<?php get_template_part('template-parts/reviews'); ?>
|
||||
<?php get_template_part('template-parts/faq'); ?>
|
||||
<?php get_template_part('template-parts/jobs'); ?>
|
||||
<?php get_template_part('template-parts/getapp'); ?>
|
||||
<?php get_template_part('template-parts/specs'); ?>
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ Template Name: Аудитория
|
||||
|
||||
<main class="main">
|
||||
|
||||
<?php get_template_part('template-parts/hero'); ?>
|
||||
<?php get_template_part('template-parts/audience/hero'); ?>
|
||||
<?php get_template_part('template-parts/work'); ?>
|
||||
<?php get_template_part('template-parts/advantages'); ?>
|
||||
<?php get_template_part('template-parts/scheme'); ?>
|
||||
|
||||
Reference in new issue
Block a user