Compare commits
9
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 web_103.2
|
3e62e846fd | ||
|
web_103.2
|
9ab584cba5 | ||
|
web_103.2
|
9fa68481da | ||
|
web_103.2
|
3b38f35be6 | ||
|
web_103.2
|
2e54c26224 | ||
|
web_103.2
|
2a90b6957c | ||
|
web_103.2
|
6edf5d69bd | ||
|
web_103.2
|
73a51cf6f4 | ||
|
web_103.2
|
9e21c34547 |
No files matched your search
@@ -4138,11 +4138,16 @@ h4 {
|
||||
.article-main {
|
||||
min-width: 0;
|
||||
}
|
||||
.article-main .article-content:not(:first-child){
|
||||
margin-top: clamp(30px, 17.5691px + 3.3149vw, 60px);
|
||||
}
|
||||
.article-sidebar {
|
||||
position: sticky;
|
||||
top: 112px;
|
||||
}
|
||||
.article-toc {
|
||||
height: 46vh;
|
||||
|
||||
padding: 25px 30px;
|
||||
background-color: var(--color-light);
|
||||
border-radius: var(--radius-sm);
|
||||
@@ -4165,8 +4170,8 @@ h4 {
|
||||
width: 0;
|
||||
}
|
||||
.article-toc__list.is-scrollable {
|
||||
padding-right: 10px;
|
||||
scrollbar-width: auto;
|
||||
height: 83%;
|
||||
}
|
||||
@-moz-document url-prefix() {
|
||||
.article-toc__list.is-scrollable {
|
||||
@@ -5943,4 +5948,843 @@ h4 {
|
||||
.specs-tabs__item:hover {
|
||||
color: var(--color-red);
|
||||
}
|
||||
}
|
||||
|
||||
/* новые */
|
||||
|
||||
|
||||
.h-article-hero {
|
||||
--h-hero-accent: var(--color-red);
|
||||
--h-hero-text: var(--color-dark);
|
||||
--h-hero-muted: var(--color-grey-dark);
|
||||
--h-hero-line: var(--color-grey);
|
||||
--h-hero-bg: var(--color-light);
|
||||
--h-hero-radius: 26px;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-width: 1100px;
|
||||
color: var(--h-hero-text);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.h-article-hero *,
|
||||
.h-article-hero *::before,
|
||||
.h-article-hero *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.h-article-hero__container {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(400px, 500px) minmax(0, 1fr);
|
||||
align-items: stretch;
|
||||
gap: 64px;
|
||||
width: calc(100% - 80px);
|
||||
max-width: 1360px;
|
||||
}
|
||||
|
||||
.h-article-hero__picture {
|
||||
min-height: 600px;
|
||||
overflow: hidden;
|
||||
border-radius: var(--h-hero-radius);
|
||||
background: var(--color-grey);
|
||||
}
|
||||
|
||||
.h-article-hero__image {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 600px;
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
}
|
||||
|
||||
.h-article-hero__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
min-width: 0;
|
||||
padding: 5px 0 4px;
|
||||
}
|
||||
|
||||
.h-article-hero__breadcrumb-divider {
|
||||
flex: none;
|
||||
color: var(--color-grey-light);
|
||||
}
|
||||
|
||||
.h-article-hero__breadcrumb-current {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: var(--h-hero-text);
|
||||
}
|
||||
|
||||
.h-article-hero__categories {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
margin-bottom: 19px;
|
||||
}
|
||||
|
||||
.h-article-hero__category {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 29px;
|
||||
padding: 5px 12px;
|
||||
border: 1px solid color-mix(in srgb, var(--color-red) 17%, transparent);
|
||||
border-radius: 100px;
|
||||
background: color-mix(in srgb, var(--color-red) 8%, var(--color-light));
|
||||
color: var(--h-hero-accent);
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.h-article-hero__title {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
color: var(--h-hero-text);
|
||||
font-size: 44px;
|
||||
font-weight: 700;
|
||||
line-height: 1.12;
|
||||
letter-spacing: -.035em;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
.h-article-hero__title > span {
|
||||
background: linear-gradient(
|
||||
98deg,
|
||||
var(--color-red) 0%,
|
||||
var(--color-red-dark) 100%
|
||||
);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.h-article-hero__description {
|
||||
max-width: 710px;
|
||||
margin: 24px 0 34px;
|
||||
color: var(--color-text);
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.h-article-hero__meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
width: 100%;
|
||||
margin-top: auto;
|
||||
padding-top: 25px;
|
||||
border-top: 1px solid var(--h-hero-line);
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex: none;
|
||||
min-height: 31px;
|
||||
padding: 0 20px;
|
||||
font-size: 14px;
|
||||
line-height: 1.35;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item + .h-article-hero__meta-item {
|
||||
border-left: 1px solid var(--color-grey);
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item svg {
|
||||
display: block;
|
||||
flex: none;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
color: var(--h-hero-accent);
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item strong {
|
||||
color: var(--h-hero-text);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@media (max-width: 1279.98px) {
|
||||
.h-article-hero{
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.h-article-hero__container{
|
||||
width: 100%;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
.h-article-hero__image,
|
||||
.h-article-hero__picture{
|
||||
min-width: auto;
|
||||
min-height: auto;
|
||||
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 550px) {
|
||||
.h-article-hero__meta{
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
}
|
||||
.h-article-hero__meta-item {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item:first-child {
|
||||
padding-left: 20px;;
|
||||
}
|
||||
|
||||
.h-article-hero__meta-item + .h-article-hero__meta-item {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
.h-article-hero__title{
|
||||
font-size: 28px;
|
||||
}
|
||||
.h-article-hero__description{
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.h-attention {
|
||||
--attention-color: var(--color-red);
|
||||
--attention-bg: color-mix(in srgb, var(--color-red) 8%, var(--color-light));
|
||||
--attention-icon-bg: color-mix(in srgb, var(--color-red) 15%, var(--color-light));
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 28px 0;
|
||||
padding: 24px 28px;
|
||||
border-radius: 16px;
|
||||
background: var(--attention-bg);
|
||||
}
|
||||
|
||||
.h-attention--warning {
|
||||
--attention-color: var(--color-red);
|
||||
--attention-bg: color-mix(in srgb, var(--color-red) 8%, var(--color-light));
|
||||
--attention-icon-bg: color-mix(in srgb, var(--color-red) 15%, var(--color-light));
|
||||
}
|
||||
|
||||
.h-attention--info {
|
||||
--attention-color: #a8740b;
|
||||
--attention-bg: #fff8e8;
|
||||
--attention-icon-bg: #f9ebc8;
|
||||
}
|
||||
|
||||
.h-attention--success {
|
||||
--attention-color: #277547;
|
||||
--attention-bg: #eff8f2;
|
||||
--attention-icon-bg: #dceee2;
|
||||
}
|
||||
|
||||
.h-attention__icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 48px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 12px;
|
||||
background: var(--attention-icon-bg);
|
||||
color: var(--attention-color);
|
||||
}
|
||||
|
||||
.h-attention__icon span {
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.h-attention__content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.65;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.h-attention__content p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.h-attention__content p + p {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.h-attention__content a {
|
||||
color: var(--attention-color);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.h-attention__content > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-attention{
|
||||
padding: 12px 14px;
|
||||
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.h-article-quote {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 30px 0;
|
||||
padding: 28px 16px;
|
||||
border-radius: 14px;
|
||||
background: var(--color-dark);
|
||||
color: var(--color-light);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.h-article-quote .h-article-quote__avatar {
|
||||
display: block;
|
||||
flex: 0 0 90px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
}
|
||||
|
||||
.h-article-quote .h-article-quote__body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.h-article-quote .h-article-quote__author {
|
||||
margin: 0 0 6px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
.h-article-quote .h-article-quote__text {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: none;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
line-height: 1.3;
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-article-quote{
|
||||
padding: 12px 14px;
|
||||
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.h-article-quote .h-article-quote__text{
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.h-article-cards {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 20px;
|
||||
width: 100%;
|
||||
margin: 30px 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.h-article-cards .h-article-cards__item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 110px;
|
||||
padding: 20px 22px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid var(--color-grey);
|
||||
border-radius: 10px;
|
||||
background: var(--color-light);
|
||||
box-shadow: 0 2px 12px color-mix(in srgb, var(--color-dark) 8%, transparent);
|
||||
}
|
||||
.h-article-cards__item:last-child:nth-child(odd) {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.h-article-cards .h-article-cards__item p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: inherit;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
line-height: 1.6;
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
.h-article-cards .h-article-cards__item p + p {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-article-cards{
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.h-article-cards .h-article-cards__item p {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.h-article-cta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 40px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 30px 40px;
|
||||
margin: 30px 0;
|
||||
background: var(--color-dark);
|
||||
border-radius: 22px;
|
||||
color: var(--color-light);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__title {
|
||||
margin: 0 0 12px;
|
||||
padding: 0;
|
||||
font-size: 26px;
|
||||
font-weight: 700;
|
||||
line-height: 1.25;
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__description {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-width: 520px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: var(--color-grey);
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__actions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 0 0 245px;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-height: 48px;
|
||||
box-sizing: border-box;
|
||||
padding: 12px 20px;
|
||||
border-radius: 50px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
transition: background 0.2s, color 0.2s, border-color 0.2s;
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__btn--outline {
|
||||
background: transparent;
|
||||
border: 1px solid var(--color-grey-light);
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__btn--outline:hover {
|
||||
background: var(--color-light);
|
||||
border-color: var(--color-light);
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__btn--white {
|
||||
background: var(--color-light);
|
||||
border: 1px solid var(--color-light);
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
.h-article-cta .h-article-cta__btn--white:hover {
|
||||
background: var(--color-grey);
|
||||
border-color: var(--color-grey);
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-article-app-cta,
|
||||
.h-article-cta{
|
||||
flex-direction: column;
|
||||
}
|
||||
.h-article-cta .h-article-cta__content{
|
||||
width: 100%;
|
||||
}
|
||||
.h-article-cta .h-article-cta__actions{
|
||||
width: 100%;
|
||||
flex: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.h-article-app-cta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
width: 100%;
|
||||
min-height: 120px;
|
||||
box-sizing: border-box;
|
||||
margin: 30px 0;
|
||||
padding: 18px 32px;
|
||||
border-radius: 16px;
|
||||
background: var(--color-red);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 100px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__image img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__title {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 1.4;
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 145px;
|
||||
min-height: 40px;
|
||||
box-sizing: border-box;
|
||||
padding: 10px 20px;
|
||||
border: 0;
|
||||
border-radius: 50px;
|
||||
background: var(--color-light);
|
||||
color: var(--color-dark);
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__button:hover {
|
||||
background: var(--color-grey);
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-article-app-cta .h-article-app-cta__title{
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.h-article-app-cta .h-article-app-cta__button{
|
||||
width: 100%;
|
||||
|
||||
flex:auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.h-article-author {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 5px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 30px 0;
|
||||
padding: 20px 24px;
|
||||
border: 1px solid var(--color-grey);
|
||||
border-radius: 14px;
|
||||
background: var(--color-light);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.h-article-author__text {
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
color: var(--color-grey-dark);
|
||||
}
|
||||
|
||||
.h-article-author__link {
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
line-height: 1.5;
|
||||
color: var(--color-red);
|
||||
text-decoration: none;
|
||||
transition: color .2s ease;
|
||||
}
|
||||
|
||||
.h-article-author__link:hover {
|
||||
color: var(--color-red-dark);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.h-app-steps {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 40px 0;
|
||||
padding: 40px 30px;
|
||||
background: var(--color-light);
|
||||
border-radius: 18px;
|
||||
font-family: inherit;
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
.h-app-steps *,
|
||||
.h-app-steps *::before,
|
||||
.h-app-steps *::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__title {
|
||||
margin: 0 0 40px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
color: var(--color-dark);
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__layout {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(210px, 35%) minmax(0, 1fr);
|
||||
gap: 30px;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__phone {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__phone img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
height: auto;
|
||||
max-height: 420px;
|
||||
object-fit: contain;
|
||||
object-position: center;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
column-gap: 28px;
|
||||
row-gap: 40px;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__step {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__number {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 44px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
margin: 0 0 16px;
|
||||
padding: 0;
|
||||
background: var(--color-grey-light);
|
||||
border-radius: 12px;
|
||||
color: var(--color-light);
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__step:first-child .h-app-steps__number {
|
||||
background: var(--color-red);
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__step-title {
|
||||
margin: 0 0 8px;
|
||||
padding: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 1.35;
|
||||
color: var(--color-dark);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__description {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
line-height: 1.55;
|
||||
color: var(--color-text);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__download {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__qr {
|
||||
display: block;
|
||||
flex: 0 0 82px;
|
||||
width: 82px;
|
||||
height: 82px;
|
||||
max-width: none;
|
||||
object-fit: contain;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@media (max-width: 1279.98px) {
|
||||
.h-app-steps .h-app-steps__layout{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
.h-app-steps .h-app-steps__phone{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.h-app-steps .h-app-steps__title{
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.h-app-steps .h-app-steps__grid{
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.article-social{
|
||||
margin-top: 20px;
|
||||
|
||||
padding: 25px 30px;
|
||||
background-color: var(--color-light);
|
||||
border-radius: var(--radius-sm);
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
}
|
||||
.article-social__title{
|
||||
font-size: var(--fs-h3-sm);
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
color: var(--color-dark);
|
||||
}
|
||||
.article-social__text{
|
||||
font-size: 18px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.article-social__list{
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.article-social__list > .footer-socials__item {
|
||||
flex: 1;
|
||||
width: auto;
|
||||
height: 44px;
|
||||
aspect-ratio: auto;
|
||||
}
|
||||
|
||||
.blog-links{
|
||||
margin-top: 20px;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.blog-links .btn--transp-red.active{
|
||||
background: var(--color-red);
|
||||
color: var(--color-light);
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.blog-links{
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-header__action{
|
||||
margin-top: 20px;
|
||||
|
||||
display: flex;
|
||||
}
|
||||
@@ -674,6 +674,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
currentRequest = new AbortController();
|
||||
const formData = new FormData();
|
||||
formData.append('action', 'theme_filter_articles');
|
||||
formData.append('section', grid.dataset.section || '');
|
||||
formData.append('nonce', window.themeAjax.nonces.articles);
|
||||
formData.append('category', category);
|
||||
formData.append('page', page);
|
||||
|
||||
@@ -373,3 +373,5 @@ require_once get_template_directory() . '/inc/acf.php';
|
||||
require_once get_template_directory() . '/inc/ajax.php';
|
||||
require_once get_template_directory() . '/inc/menu.php';
|
||||
require_once get_template_directory() . '/inc/breadcrumbs.php';
|
||||
require_once get_template_directory() . '/inc/article-urls.php';
|
||||
require_once get_template_directory() . '/inc/schema.php';
|
||||
@@ -3,6 +3,14 @@
|
||||
// Отключить табы в редакторе групп полей ACF
|
||||
add_filter('acf/field_group/disable_field_settings_tabs', '__return_true');
|
||||
|
||||
// Просмотры изменяются автоматически, поле в админке доступно только для просмотра.
|
||||
add_filter('acf/prepare_field/name=viewers', function ($field) {
|
||||
if (is_admin()) {
|
||||
$field['disabled'] = 1;
|
||||
}
|
||||
return $field;
|
||||
});
|
||||
|
||||
|
||||
// Страница опций ACF
|
||||
if (function_exists('acf_add_options_page')) {
|
||||
|
||||
@@ -12,15 +12,11 @@ function theme_filter_articles() {
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC',
|
||||
];
|
||||
if (!empty($category)) {
|
||||
$args['tax_query'] = [
|
||||
[
|
||||
'taxonomy' => 'article_category',
|
||||
'field' => 'slug',
|
||||
'terms' => $category,
|
||||
]
|
||||
];
|
||||
$section = isset($_POST['section']) && is_string($_POST['section']) ? sanitize_key(wp_unslash($_POST['section'])) : '';
|
||||
if ($section !== '' && !in_array($section, ['general', 'taxi', 'courier', 'cargo'], true)) {
|
||||
wp_send_json_error(['message' => 'Неизвестный раздел'], 400);
|
||||
}
|
||||
$args['tax_query'] = hantico_blog_tax_query($section, $category);
|
||||
$query = new WP_Query($args);
|
||||
ob_start();
|
||||
if ($query->have_posts()) {
|
||||
@@ -30,6 +26,7 @@ function theme_filter_articles() {
|
||||
}
|
||||
wp_reset_postdata();
|
||||
}
|
||||
if (!$query->have_posts()) echo '<p>Статьи не найдены.</p>';
|
||||
$html = ob_get_clean();
|
||||
wp_send_json_success([
|
||||
'html' => $html,
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
<?php
|
||||
|
||||
// Порядок задаёт приоритет, если статье назначено несколько разделов.
|
||||
function hantico_article_url_base($post_id) {
|
||||
$sections = [
|
||||
'taxi' => 'blog-taxi',
|
||||
'courier' => 'blog-courier',
|
||||
'cargo' => 'blog-cargo',
|
||||
];
|
||||
$terms = get_the_terms($post_id, 'article_chapter');
|
||||
if (!$terms || is_wp_error($terms)) {
|
||||
return 'blog';
|
||||
}
|
||||
$slugs = wp_list_pluck($terms, 'slug');
|
||||
foreach ($sections as $slug => $base) {
|
||||
if (in_array($slug, $slugs, true)) {
|
||||
return $base;
|
||||
}
|
||||
}
|
||||
return 'blog';
|
||||
}
|
||||
|
||||
add_filter('post_type_link', function ($url, $post, $leavename, $sample) {
|
||||
if ($post->post_type !== 'article' || (!$post->post_name && !$leavename)) {
|
||||
return $url;
|
||||
}
|
||||
$slug = $leavename ? '%article%' : $post->post_name;
|
||||
return home_url(user_trailingslashit('/' . hantico_article_url_base($post->ID) . '/' . $slug, 'single'));
|
||||
}, 10, 4);
|
||||
|
||||
add_action('init', function () {
|
||||
add_rewrite_rule('^blog-(taxi|courier|cargo)/?$', 'index.php?pagename=blog&article_section_filter=$matches[1]', 'top');
|
||||
// /blog/ продолжает обслуживаться существующими правилами типа article.
|
||||
add_rewrite_rule(
|
||||
'^(?:blog-taxi|blog-courier|blog-cargo)/([^/]+)/?$',
|
||||
'index.php?post_type=article&name=$matches[1]',
|
||||
'top'
|
||||
);
|
||||
});
|
||||
|
||||
add_filter('query_vars', function ($vars) {
|
||||
$vars[] = 'article_section_filter';
|
||||
return $vars;
|
||||
});
|
||||
|
||||
function hantico_blog_section() {
|
||||
$section = get_query_var('article_section_filter', '');
|
||||
if (!$section && isset($_GET['section']) && is_string($_GET['section'])) {
|
||||
$section = sanitize_key(wp_unslash($_GET['section']));
|
||||
}
|
||||
return in_array($section, ['general', 'taxi', 'courier', 'cargo'], true) ? $section : '';
|
||||
}
|
||||
|
||||
function hantico_blog_tax_query($section, $category = '') {
|
||||
$query = ['relation' => 'AND'];
|
||||
if ($section !== '') {
|
||||
$query[] = ['taxonomy' => 'article_chapter', 'field' => 'slug', 'terms' => $section];
|
||||
}
|
||||
if ($category !== '') {
|
||||
$query[] = ['taxonomy' => 'article_category', 'field' => 'slug', 'terms' => $category];
|
||||
}
|
||||
return count($query) > 1 ? $query : [];
|
||||
}
|
||||
|
||||
add_filter('redirect_canonical', function ($redirect) {
|
||||
return is_page('blog') && get_query_var('article_section_filter') ? false : $redirect;
|
||||
});
|
||||
|
||||
// Старый адрес и адрес с чужим разделом ведут на текущую ссылку статьи.
|
||||
add_action('template_redirect', function () {
|
||||
if (!is_singular('article') || is_preview() || is_feed() || is_embed()
|
||||
|| !in_array($_SERVER['REQUEST_METHOD'] ?? '', ['GET', 'HEAD'], true)) {
|
||||
return;
|
||||
}
|
||||
$request_path = wp_parse_url(wp_unslash($_SERVER['REQUEST_URI'] ?? ''), PHP_URL_PATH);
|
||||
$home_path = wp_parse_url(home_url('/'), PHP_URL_PATH);
|
||||
$relative_path = substr((string) $request_path, strlen((string) $home_path));
|
||||
if (!preg_match('~^blog(?:-taxi|-courier|-cargo)?/[^/]+/?$~', $relative_path)) {
|
||||
return;
|
||||
}
|
||||
$url = get_permalink(get_queried_object_id());
|
||||
$canonical_path = wp_parse_url($url, PHP_URL_PATH);
|
||||
if (rawurldecode((string) $request_path) === rawurldecode((string) $canonical_path)) {
|
||||
return;
|
||||
}
|
||||
// Сохраняем параметры, например UTM-метки.
|
||||
$query = wp_parse_url(wp_unslash($_SERVER['REQUEST_URI'] ?? ''), PHP_URL_QUERY);
|
||||
if ($query) {
|
||||
$url .= '?' . $query;
|
||||
}
|
||||
if (wp_safe_redirect($url, 301)) {
|
||||
exit;
|
||||
}
|
||||
}, 5);
|
||||
@@ -0,0 +1,233 @@
|
||||
<?php
|
||||
|
||||
function hantico_schema_is_blog() {
|
||||
return is_page('blog') || is_page_template('templates/template-blog.php');
|
||||
}
|
||||
|
||||
function hantico_schema_enabled() {
|
||||
return !is_404() && !is_preview() && !is_feed()
|
||||
&& (hantico_schema_is_blog() || is_singular('article'));
|
||||
}
|
||||
|
||||
// Общая выборка для HTML и JSON-LD. На странице сейчас выводится первая
|
||||
// порция; дальнейшие порции загружаются AJAX, без отдельного URL пагинации.
|
||||
function hantico_blog_query($featured = false) {
|
||||
static $queries = [];
|
||||
$key = $featured ? 'featured' : 'list';
|
||||
if (!isset($queries[$key])) {
|
||||
$category = !$featured && isset($_GET['category']) && is_string($_GET['category'])
|
||||
? sanitize_title(wp_unslash($_GET['category'])) : '';
|
||||
$queries[$key] = new WP_Query([
|
||||
'post_type' => 'article',
|
||||
'posts_per_page' => $featured ? 6 : 12,
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC',
|
||||
'tax_query' => hantico_blog_tax_query(hantico_blog_section(), $category),
|
||||
]);
|
||||
}
|
||||
return $queries[$key];
|
||||
}
|
||||
|
||||
function hantico_schema_url() {
|
||||
if (is_singular('article')) {
|
||||
return get_permalink(get_queried_object_id());
|
||||
}
|
||||
$section = hantico_blog_section();
|
||||
$url = home_url(user_trailingslashit('/' . ($section && $section !== 'general' ? 'blog-' . $section : 'blog')));
|
||||
return $section === 'general' ? add_query_arg('section', 'general', $url) : $url;
|
||||
}
|
||||
|
||||
function hantico_schema_text($text) {
|
||||
return trim(html_entity_decode(wp_strip_all_tags((string) $text), ENT_QUOTES | ENT_HTML5, 'UTF-8'));
|
||||
}
|
||||
|
||||
function hantico_schema_section_name($section) {
|
||||
$term = $section ? get_term_by('slug', $section, 'article_chapter') : false;
|
||||
return $term && !is_wp_error($term) ? $term->name : get_the_title(get_queried_object_id());
|
||||
}
|
||||
|
||||
// Yoast хранит прежний permalink в индексе: корректируем только вывод,
|
||||
// не меняя настройки плагина или сохранённые SEO-поля.
|
||||
add_filter('wpseo_canonical', function ($url) {
|
||||
return hantico_schema_enabled() ? hantico_schema_url() : $url;
|
||||
});
|
||||
add_filter('wpseo_opengraph_url', function ($url) {
|
||||
return hantico_schema_enabled() ? hantico_schema_url() : $url;
|
||||
});
|
||||
|
||||
function hantico_schema_has_type($node, $types) {
|
||||
return (bool) array_intersect((array) ($node['@type'] ?? []), (array) $types);
|
||||
}
|
||||
|
||||
function hantico_schema_graph($graph) {
|
||||
if (!hantico_schema_enabled()) {
|
||||
return $graph;
|
||||
}
|
||||
$url = hantico_schema_url();
|
||||
$post_id = get_queried_object_id();
|
||||
$is_blog = hantico_schema_is_blog();
|
||||
$page_index = null;
|
||||
// Обновляем также связанные ID изображений, крошек и действий Yoast.
|
||||
foreach ($graph as $node) {
|
||||
if (hantico_schema_has_type($node, ['WebPage', 'CollectionPage', 'ItemPage']) && !empty($node['url'])) {
|
||||
$old_url = $node['url'];
|
||||
array_walk_recursive($graph, function (&$value) use ($old_url, $url) {
|
||||
if (is_string($value) && ($value === $old_url || strpos($value, $old_url . '#') === 0)) {
|
||||
$value = $url . substr($value, strlen($old_url));
|
||||
}
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
$website_id = home_url('/#website');
|
||||
$organization_id = home_url('/#organization');
|
||||
$organization_found = false;
|
||||
foreach ($graph as $index => $node) {
|
||||
if (hantico_schema_has_type($node, ['WebPage', 'CollectionPage', 'ItemPage'])) {
|
||||
$page_index = $index;
|
||||
}
|
||||
if (hantico_schema_has_type($node, 'WebSite')) {
|
||||
$website_id = $node['@id'];
|
||||
}
|
||||
if (hantico_schema_has_type($node, 'Organization')) {
|
||||
$organization_id = $node['@id'];
|
||||
$organization_found = true;
|
||||
}
|
||||
}
|
||||
if (!$organization_found) {
|
||||
$graph[] = [
|
||||
'@type' => 'Organization', '@id' => $organization_id,
|
||||
'name' => 'Hantico', 'url' => home_url('/'),
|
||||
'logo' => ['@type' => 'ImageObject', 'url' => get_theme_file_uri('assets/img/icons/logo.svg')],
|
||||
];
|
||||
}
|
||||
$website_found = false;
|
||||
foreach ($graph as &$node) {
|
||||
if (hantico_schema_has_type($node, 'WebSite')) {
|
||||
$node['publisher'] = ['@id' => $organization_id];
|
||||
$website_found = true;
|
||||
}
|
||||
}
|
||||
unset($node);
|
||||
if (!$website_found) {
|
||||
$graph[] = ['@type' => 'WebSite', '@id' => $website_id, 'url' => home_url('/'),
|
||||
'name' => get_bloginfo('name'), 'publisher' => ['@id' => $organization_id]];
|
||||
}
|
||||
if ($page_index === null) {
|
||||
$graph[] = ['@type' => 'WebPage', '@id' => $url];
|
||||
$page_index = array_key_last($graph);
|
||||
}
|
||||
$page = &$graph[$page_index];
|
||||
$page['url'] = $url;
|
||||
$page['isPartOf'] = ['@id' => $website_id];
|
||||
$page['inLanguage'] = get_bloginfo('language');
|
||||
$page['breadcrumb'] = ['@id' => $url . '#breadcrumb'];
|
||||
$description = $page['description'] ?? '';
|
||||
if ($is_blog) {
|
||||
$section = hantico_blog_section();
|
||||
$page['@type'] = 'CollectionPage';
|
||||
$page['name'] = hantico_schema_text($section ? hantico_schema_section_name($section) : (get_field('blog_title', $post_id) ?: get_the_title($post_id)));
|
||||
$term = $section ? get_term_by('slug', $section, 'article_chapter') : false;
|
||||
$description = $term && !is_wp_error($term) && $term->description
|
||||
? $term->description : ($description ?: get_field('blog_descr', $post_id));
|
||||
// Два списка соответствуют двум реальным блокам, без повторных запросов
|
||||
// и без включения статей из следующих AJAX-порций.
|
||||
$page['mainEntity'] = [];
|
||||
foreach ([true, false] as $featured) {
|
||||
$list_id = $url . ($featured ? '#featured-articles' : '#articles');
|
||||
$items = [];
|
||||
foreach (hantico_blog_query($featured)->posts as $post) {
|
||||
$items[] = ['@type' => 'ListItem', 'position' => count($items) + 1,
|
||||
'url' => get_permalink($post), 'name' => hantico_schema_text(get_the_title($post))];
|
||||
}
|
||||
$graph[] = ['@type' => 'ItemList', '@id' => $list_id,
|
||||
'numberOfItems' => count($items), 'itemListElement' => $items];
|
||||
$page['mainEntity'][] = ['@id' => $list_id];
|
||||
}
|
||||
$crumbs = [['name' => 'Главная', 'item' => home_url('/')], ['name' => $page['name'], 'item' => $url]];
|
||||
} else {
|
||||
$description = $description ?: (get_field('brief_description', $post_id) ?: get_field('article_descr', $post_id));
|
||||
$article = [
|
||||
'@type' => 'Article', '@id' => $url . '#article', 'url' => $url,
|
||||
'headline' => hantico_schema_text(get_the_title($post_id)),
|
||||
'datePublished' => get_post_time('c', true, $post_id),
|
||||
'dateModified' => get_post_modified_time('c', true, $post_id),
|
||||
'publisher' => ['@id' => $organization_id],
|
||||
'mainEntityOfPage' => ['@id' => $page['@id']],
|
||||
'inLanguage' => get_bloginfo('language'),
|
||||
];
|
||||
$image = get_the_post_thumbnail_url($post_id, 'full');
|
||||
if ($image) {
|
||||
$article['image'] = $image;
|
||||
}
|
||||
$article['author'] = [
|
||||
'@type' => 'Organization',
|
||||
'@id' => home_url('/about/#editorial'),
|
||||
'name' => 'Редакция Hantico',
|
||||
'url' => home_url('/about/'),
|
||||
];
|
||||
if ($description) {
|
||||
$article['description'] = hantico_schema_text($description);
|
||||
}
|
||||
$article_index = null;
|
||||
foreach ($graph as $index => $node) {
|
||||
if (hantico_schema_has_type($node, ['Article', 'BlogPosting', 'NewsArticle'])) {
|
||||
$article_index = $index;
|
||||
$article['@id'] = $node['@id'];
|
||||
break;
|
||||
}
|
||||
}
|
||||
if ($article_index === null) {
|
||||
$graph[] = $article;
|
||||
} else {
|
||||
$graph[$article_index] = array_merge($graph[$article_index], $article);
|
||||
}
|
||||
$page['mainEntity'] = ['@id' => $article['@id']];
|
||||
$base = hantico_article_url_base($post_id);
|
||||
$section = $base === 'blog' ? '' : substr($base, 5);
|
||||
$blog_page = get_page_by_path('blog');
|
||||
$crumbs = [
|
||||
['name' => 'Главная', 'item' => home_url('/')],
|
||||
['name' => $section ? hantico_schema_section_name($section) : ($blog_page ? get_the_title($blog_page) : 'Блог'),
|
||||
'item' => home_url(user_trailingslashit('/' . $base))],
|
||||
['name' => $article['headline'], 'item' => $url],
|
||||
];
|
||||
}
|
||||
if ($description) {
|
||||
$page['description'] = hantico_schema_text($description);
|
||||
}
|
||||
unset($page);
|
||||
$breadcrumb = ['@type' => 'BreadcrumbList', '@id' => $url . '#breadcrumb', 'itemListElement' => []];
|
||||
foreach ($crumbs as $crumb) {
|
||||
$breadcrumb['itemListElement'][] = array_merge(['@type' => 'ListItem', 'position' => count($breadcrumb['itemListElement']) + 1], $crumb);
|
||||
}
|
||||
$breadcrumb_index = null;
|
||||
foreach ($graph as $index => $node) {
|
||||
if (hantico_schema_has_type($node, 'BreadcrumbList')) {
|
||||
$breadcrumb_index = $index;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if ($breadcrumb_index === null) {
|
||||
$graph[] = $breadcrumb;
|
||||
} else {
|
||||
$graph[$breadcrumb_index] = $breadcrumb;
|
||||
}
|
||||
return $graph;
|
||||
}
|
||||
|
||||
// Yoast выводит граф в wp_head и безопасно кодирует JSON самостоятельно.
|
||||
add_filter('wpseo_schema_graph', 'hantico_schema_graph', 20);
|
||||
|
||||
// Резервный вывод, если Yoast деактивирован. При активном плагине второй
|
||||
// script не создаётся, даже если его разметка отключена настройкой.
|
||||
add_action('wp_head', function () {
|
||||
if (defined('WPSEO_VERSION') || !hantico_schema_enabled()) {
|
||||
return;
|
||||
}
|
||||
$json = wp_json_encode(['@context' => 'https://schema.org', '@graph' => hantico_schema_graph([])],
|
||||
JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_UNESCAPED_UNICODE);
|
||||
if ($json) {
|
||||
echo '<script type="application/ld+json">' . $json . '</script>' . "\n";
|
||||
}
|
||||
}, 30);
|
||||
@@ -5,41 +5,153 @@
|
||||
<?php get_breadcrumbs(); ?>
|
||||
|
||||
<?php
|
||||
$post_id = get_the_ID();
|
||||
$views = (int) get_field('viewers', $post_id);
|
||||
if (!current_user_can('manage_options')) {
|
||||
$views++;
|
||||
update_field('viewers', $views, $post_id);
|
||||
}
|
||||
|
||||
$parent_id = is_singular('news') ? 82 : 42;
|
||||
$article_content = get_field('article_content');
|
||||
if ($article_content) :
|
||||
$generated = generate_toc($article_content);
|
||||
$terms = get_the_terms(get_the_ID(), 'article_category');
|
||||
$article_blocks = get_field('new_blocks') ?: [];
|
||||
$article_content = get_field('article_content') ?: '';
|
||||
$reading_parts = [$article_content];
|
||||
foreach ($article_blocks as $block) {
|
||||
$layout = $block['acf_fc_layout'] ?? '';
|
||||
if ($layout === 'text') {
|
||||
$reading_parts[] = $block['content'] ?? '';
|
||||
} elseif (in_array($layout, ['attention_block', 'attention_blocks', 'quote'], true)) {
|
||||
$reading_parts[] = $block['text'] ?? '';
|
||||
} elseif ($layout === 'block_main') {
|
||||
foreach (($block['cards'] ?? []) as $card) {
|
||||
$reading_parts[] = $card['text_card'] ?? '';
|
||||
}
|
||||
}
|
||||
}
|
||||
// Разделяем HTML-элементы пробелами, чтобы соседние абзацы не склеивались.
|
||||
$reading_text = strip_shortcodes(implode(' ', $reading_parts));
|
||||
$reading_text = preg_replace('@<(script|style)\b[^>]*>.*?</\1>@si', ' ', $reading_text);
|
||||
$reading_text = preg_replace('/<[^>]*>/', ' ', $reading_text);
|
||||
$reading_text = html_entity_decode(wp_strip_all_tags($reading_text), ENT_QUOTES | ENT_HTML5, 'UTF-8');
|
||||
$word_count = preg_match_all("/[\p{L}\p{N}]+(?:[’'\x{002D}][\p{L}\p{N}]+)*/u", $reading_text);
|
||||
$reading_minutes = $word_count ? max(1, (int) ceil($word_count / 200)) : 0;
|
||||
$generated = generate_toc($article_content, 'article-content');
|
||||
$content = $generated['content'];
|
||||
$toc_items = $generated['toc_items'];
|
||||
$footer_socials = get_field('socials', 'option');
|
||||
foreach ($article_blocks as $block_index => &$block) {
|
||||
if (($block['acf_fc_layout'] ?? '') !== 'text') {
|
||||
continue;
|
||||
}
|
||||
$generated = generate_toc($block['content'] ?? '', 'article-block-' . ($block_index + 1));
|
||||
$block['content'] = $generated['content'];
|
||||
$toc_items = array_merge($toc_items, $generated['toc_items']);
|
||||
}
|
||||
unset($block);
|
||||
if ($article_content || $article_blocks) :
|
||||
?>
|
||||
<section class="article">
|
||||
<div class="container">
|
||||
<div class="article-goback">
|
||||
<a href="<?php echo get_permalink($parent_id); ?>" class="article-goback__btn">Назад</a>
|
||||
</div>
|
||||
<div class="article-header">
|
||||
<h1 class="article-title"><?php the_title(); ?></h1>
|
||||
<div class="article-img"><?php the_post_thumbnail('extra_large'); ?></div>
|
||||
<div class="article-meta">
|
||||
<time class="article-date" datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date('d.m.Y'); ?></time>
|
||||
<?php
|
||||
$terms = get_the_terms(get_the_ID(), 'article_category');
|
||||
if ($terms) :
|
||||
?>
|
||||
<ul class="article-tags">
|
||||
<?php foreach ($terms as $term) : ?>
|
||||
<li class="article-tags__item"><?php echo $term->name; ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="h-article-hero" aria-labelledby="h-article-hero-title">
|
||||
<div class="h-article-hero__container">
|
||||
<div class="h-article-hero__picture">
|
||||
<?php the_post_thumbnail('extra_large', array('class' => 'h-article-hero__image')); ?>
|
||||
</div>
|
||||
|
||||
<div class="h-article-hero__content">
|
||||
<?php if ($terms && !is_wp_error($terms)) : ?>
|
||||
<div class="h-article-hero__categories">
|
||||
<?php foreach ($terms as $term) : ?>
|
||||
<span class="h-article-hero__category"><?php echo esc_html($term->name); ?></span>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<h1 class="h-article-hero__title" id="h-article-hero-title">
|
||||
<?php the_title(); ?>
|
||||
</h1>
|
||||
|
||||
<?php $brief_description = get_field('brief_description'); ?>
|
||||
<?php if ($brief_description) : ?>
|
||||
<p class="h-article-hero__description"><?php echo nl2br(esc_html($brief_description)); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="h-article-hero__meta" aria-label="Информация о статье">
|
||||
<div class="h-article-hero__meta-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||||
<rect x="3" y="5" width="18" height="16" rx="2"></rect>
|
||||
<path d="M7 3v4M17 3v4M3 10h18"></path>
|
||||
</svg>
|
||||
<time datetime="<?php echo esc_attr(get_the_date('c')); ?>"><?php echo esc_html(get_the_date('d.m.Y')); ?></time>
|
||||
</div>
|
||||
|
||||
<?php if ($reading_minutes) : ?>
|
||||
<div class="h-article-hero__meta-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||||
<circle cx="12" cy="13" r="9"></circle>
|
||||
<path d="M12 8v5l3 2M9 2h6"></path>
|
||||
</svg>
|
||||
<span>Время чтения: <strong>≈ <?php echo esc_html($reading_minutes); ?> мин</strong></span>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="h-article-hero__meta-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||||
<path d="M2.2 12s3.7-6 9.8-6 9.8 6 9.8 6-3.7 6-9.8 6-9.8-6-9.8-6Z"></path>
|
||||
<circle cx="12" cy="12" r="2.8"></circle>
|
||||
</svg>
|
||||
<span>Просмотры: <strong><?php echo esc_html(number_format_i18n($views)); ?></strong></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="article-body<?php if (!$toc_items) echo ' no-toc'; ?>">
|
||||
<div class="article-main">
|
||||
<div class="article-content content"><?php echo wrap_tables($content); ?></div>
|
||||
<?php if ($content) : ?>
|
||||
<div class="article-content content"><?php echo wrap_tables($content); ?></div>
|
||||
<?php endif; ?>
|
||||
<?php
|
||||
if ($article_blocks) {
|
||||
foreach ($article_blocks as $block) {
|
||||
|
||||
$layout = $block['acf_fc_layout'] ?? '';
|
||||
if ($layout === 'attention_block') {
|
||||
$layout = 'attention_blocks';
|
||||
}
|
||||
|
||||
$allowedLayouts = [
|
||||
'attention_block',
|
||||
'attention_blocks',
|
||||
'text',
|
||||
'block_main',
|
||||
'quote',
|
||||
'cta_1',
|
||||
'cta_2',
|
||||
'plaque_authorship',
|
||||
];
|
||||
|
||||
if (in_array($layout, $allowedLayouts, true)) {
|
||||
get_template_part(
|
||||
'template-parts/article-blocks/' . $layout,
|
||||
null,
|
||||
[
|
||||
'fields' => $block,
|
||||
]
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<?php if ($toc_items) : ?>
|
||||
<div class="article-sidebar">
|
||||
<div class="article-sidebar">
|
||||
<?php if ($toc_items) : ?>
|
||||
<div class="article-toc">
|
||||
<div class="article-toc__title">Содержание</div>
|
||||
<ul class="article-toc__list">
|
||||
@@ -52,14 +164,35 @@
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="article-social">
|
||||
<p class="article-social__title">
|
||||
Работайте проще и зарабатывайте больше!
|
||||
</p>
|
||||
|
||||
<p class="article-social__text">
|
||||
Лайфхаки, полезные инструкции, изменения в правилах и важные новости для водителей и курьеров — в каналах Hantico.
|
||||
</p>
|
||||
|
||||
<div class="article-social__list">
|
||||
<a href="<?php echo $footer_socials['vk']; ?>" class="footer-socials__item" target="_blank" rel="noopener">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/vk.svg'); ?>" alt="VK" loading="lazy">
|
||||
</a>
|
||||
|
||||
<a href="<?php echo $footer_socials['telegram']; ?>" class="footer-socials__item" target="_blank" rel="noopener">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/telegram.svg'); ?>" alt="Telegram" loading="lazy">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php get_template_part('template-parts/faq'); ?>
|
||||
<?php get_template_part('template-parts/app-steps'); ?>
|
||||
<?php get_template_part('template-parts/related'); ?>
|
||||
<?php get_template_part('template-parts/socials'); ?>
|
||||
<?php get_template_part('template-parts/getapp'); ?>
|
||||
|
||||
@@ -0,0 +1,84 @@
|
||||
<div class="articles articles--block">
|
||||
<div class="container">
|
||||
<section class="h-app-steps">
|
||||
<h2 class="h-app-steps__title">
|
||||
Начать работать — просто
|
||||
</h2>
|
||||
|
||||
<div class="h-app-steps__layout">
|
||||
|
||||
<div class="h-app-steps__phone">
|
||||
<img
|
||||
src="https://play-lh.googleusercontent.com/heeCPL3mSBl1ZW9hAS161lD-vwR57g3BYWmLYXSAS9Jrukcbq_-rMIMVozO5QVq1-TJ8BTJJ6y3hjr1PeZqs=w1052-h592-rw"
|
||||
alt="Приложение Hantico на смартфоне"
|
||||
loading="lazy"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="h-app-steps__grid">
|
||||
|
||||
<div class="h-app-steps__step">
|
||||
<div class="h-app-steps__number">1</div>
|
||||
|
||||
<h3 class="h-app-steps__step-title">
|
||||
Скачайте приложение
|
||||
</h3>
|
||||
|
||||
<p class="h-app-steps__description">
|
||||
Установите Hantico на смартфон.
|
||||
</p>
|
||||
|
||||
<div class="h-app-steps__download">
|
||||
<img
|
||||
class="h-app-steps__qr"
|
||||
src="https://hantico.cp.good-production.xyz/wp-content/uploads/qrcode.svg"
|
||||
alt="QR-код для скачивания Hantico"
|
||||
loading="lazy"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-app-steps__step">
|
||||
<div class="h-app-steps__number">2</div>
|
||||
|
||||
<h3 class="h-app-steps__step-title">
|
||||
Зарегистрируйтесь
|
||||
</h3>
|
||||
|
||||
<p class="h-app-steps__description">
|
||||
Создайте аккаунт и заполните
|
||||
необходимые данные.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="h-app-steps__step">
|
||||
<div class="h-app-steps__number">3</div>
|
||||
|
||||
<h3 class="h-app-steps__step-title">
|
||||
Выберите подходящий формат работы
|
||||
</h3>
|
||||
|
||||
<p class="h-app-steps__description">
|
||||
Найдите доступные варианты и условия,
|
||||
которые подходят именно вам.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="h-app-steps__step">
|
||||
<div class="h-app-steps__number">4</div>
|
||||
|
||||
<h3 class="h-app-steps__step-title">
|
||||
Начинайте работать
|
||||
</h3>
|
||||
|
||||
<p class="h-app-steps__description">
|
||||
Переходите к заказам и используйте
|
||||
Hantico в работе.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$attention = $fields['attention'] ?? 'red';
|
||||
if (is_array($attention)) {
|
||||
$attention = $attention['value'] ?? 'red';
|
||||
}
|
||||
$text = $fields['text'] ?? '';
|
||||
$variants = [
|
||||
'red' => ['class' => 'warning', 'icon' => '!', 'title' => 'Важно!'],
|
||||
'yellow' => ['class' => 'info', 'icon' => 'i', 'title' => 'Полезная информация'],
|
||||
'green' => ['class' => 'success', 'icon' => '✓', 'title' => 'Рекомендация'],
|
||||
];
|
||||
$variant = $variants[$attention] ?? $variants['red'];
|
||||
?>
|
||||
|
||||
<?php if ($text !== '') : ?>
|
||||
<div class="h-attention h-attention--<?php echo esc_attr($variant['class']); ?>">
|
||||
<div class="h-attention__icon">
|
||||
<span><?php echo esc_html($variant['icon']); ?></span>
|
||||
</div>
|
||||
<div class="h-attention__content">
|
||||
<?php echo wpautop(wp_kses_post($text)); ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
@@ -0,0 +1,14 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$cards = $fields['cards'] ?? [];
|
||||
?>
|
||||
|
||||
<?php if ($cards): ?>
|
||||
<div class="h-article-cards">
|
||||
<?php foreach ($cards as $card): ?>
|
||||
<div class="h-article-cards__item">
|
||||
<p><?php echo nl2br(esc_html($card['text_card'] ?? '')); ?></p>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
@@ -0,0 +1,33 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$title = $fields['title'] ?? '';
|
||||
$text = $fields['text'] ?? '';
|
||||
$link_1 = $fields['link_1'] ?? [];
|
||||
$link_2 = $fields['link_2'] ?? [];
|
||||
?>
|
||||
|
||||
<div class="h-article-cta">
|
||||
<div class="h-article-cta__content">
|
||||
<?php if ($title): ?>
|
||||
<h2 class="h-article-cta__title"><?php echo esc_html($title); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($text): ?>
|
||||
<p class="h-article-cta__description"><?php echo nl2br(esc_html($text)); ?></p>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<div class="h-article-cta__actions">
|
||||
<?php if (!empty($link_1['link'])): ?>
|
||||
<a href="<?php echo esc_url($link_1['link']); ?>" class="h-article-cta__btn h-article-cta__btn--outline">
|
||||
<?php echo esc_html($link_1['text'] ?? ''); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($link_2['link'])): ?>
|
||||
<a href="<?php echo esc_url($link_2['link']); ?>" class="h-article-cta__btn h-article-cta__btn--white">
|
||||
<?php echo esc_html($link_2['text'] ?? ''); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,31 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$image = $fields['img'] ?? [];
|
||||
$text = $fields['text'] ?? '';
|
||||
$link = $fields['link'] ?? [];
|
||||
?>
|
||||
|
||||
<div class="h-article-app-cta">
|
||||
<?php if ($image): ?>
|
||||
<div class="h-article-app-cta__image">
|
||||
<img
|
||||
src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt'] ?? ''); ?>"
|
||||
width="90"
|
||||
height="90"
|
||||
>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($text): ?>
|
||||
<div class="h-article-app-cta__content">
|
||||
<p class="h-article-app-cta__title"><?php echo nl2br(esc_html($text)); ?></p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($link['link'])): ?>
|
||||
<a href="<?php echo esc_url($link['link']); ?>" class="h-article-app-cta__button">
|
||||
<?php echo esc_html($link['text'] ?? ''); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
@@ -0,0 +1,17 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$text = $fields['text'] ?? '';
|
||||
$link = $fields['link'] ?? [];
|
||||
?>
|
||||
|
||||
<div class="h-article-author">
|
||||
<?php if ($text): ?>
|
||||
<span class="h-article-author__text"><?php echo nl2br(esc_html($text)); ?></span>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($link['link'])): ?>
|
||||
<a class="h-article-author__link" href="<?php echo esc_url($link['link']); ?>">
|
||||
<?php echo esc_html($link['name_link'] ?? ''); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
@@ -0,0 +1,32 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
$image = $fields['img'] ?? [];
|
||||
$name = $fields['name'] ?? '';
|
||||
$text = $fields['text'] ?? '';
|
||||
?>
|
||||
|
||||
<div class="h-article-quote">
|
||||
<?php if ($image): ?>
|
||||
<img
|
||||
class="h-article-quote__avatar"
|
||||
src="<?php echo esc_url($image['url']); ?>"
|
||||
alt="<?php echo esc_attr($image['alt'] ?? ''); ?>"
|
||||
width="90"
|
||||
height="90"
|
||||
>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="h-article-quote__body">
|
||||
<?php if ($name): ?>
|
||||
<div class="h-article-quote__author">
|
||||
<?php echo esc_html($name); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($text): ?>
|
||||
<blockquote class="h-article-quote__text">
|
||||
<?php echo wp_kses_post($text); ?>
|
||||
</blockquote>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,9 @@
|
||||
<?php
|
||||
$fields = $args['fields'] ?? [];
|
||||
|
||||
$content = $fields['content'] ?? '';
|
||||
?>
|
||||
|
||||
<?php if ($content): ?>
|
||||
<div class="article-content content"><?php echo wrap_tables($content); ?></div>
|
||||
<?php endif; ?>
|
||||
@@ -10,15 +10,17 @@ Template Name: Блог
|
||||
<main class="main">
|
||||
|
||||
<?php
|
||||
$current_section = hantico_blog_section();
|
||||
$section_urls = [
|
||||
'' => home_url('/blog/'),
|
||||
'general' => add_query_arg('section', 'general', home_url('/blog/')),
|
||||
'taxi' => home_url('/blog-taxi/'),
|
||||
'courier' => home_url('/blog-courier/'),
|
||||
'cargo' => home_url('/blog-cargo/'),
|
||||
];
|
||||
$blog_title = get_field('blog_title');
|
||||
$blog_descr = get_field('blog_descr');
|
||||
$blog_args = [
|
||||
'post_type' => 'article',
|
||||
'posts_per_page' => 6,
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC'
|
||||
];
|
||||
$blog_query = new WP_Query($blog_args);
|
||||
$blog_query = hantico_blog_query(true);
|
||||
if ($blog_query->have_posts()) :
|
||||
?>
|
||||
<section class="blog">
|
||||
@@ -32,8 +34,24 @@ Template Name: Блог
|
||||
<div class="blog-logo">
|
||||
<img src="<?php echo get_theme_file_uri('assets/img/icons/logo2.svg'); ?>" alt="Hantico" width="112" height="147">
|
||||
</div>
|
||||
|
||||
<div class="blog-header__action">
|
||||
<a href="/about/" class="blog-item__read-btn btn btn--md btn--transp-red ">О редакции</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php
|
||||
if (!is_wp_error($terms)) :
|
||||
$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>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
|
||||
<div class="blog-slider">
|
||||
<div class="blog-slider__container swiper swiper-fade">
|
||||
<div class="blog-slider__wrapper swiper-wrapper">
|
||||
@@ -85,31 +103,11 @@ Template Name: Блог
|
||||
'taxonomy' => 'article_category',
|
||||
'hide_empty' => true,
|
||||
]);
|
||||
$blog_args = [
|
||||
'post_type' => 'article',
|
||||
'posts_per_page' => 12,
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC'
|
||||
];
|
||||
if (!empty($current_category)) {
|
||||
$blog_args['tax_query'] = [
|
||||
[
|
||||
'taxonomy' => 'article_category',
|
||||
'field' => 'slug',
|
||||
'terms' => $current_category
|
||||
],
|
||||
];
|
||||
}
|
||||
$blog_query = new WP_Query($blog_args);
|
||||
if ($blog_query->have_posts()) :
|
||||
$blog_query = hantico_blog_query();
|
||||
?>
|
||||
<section class="articles articles--page">
|
||||
<div class="container">
|
||||
<h2 class="articles-title articles-title--sm">Все статьи</h2>
|
||||
<?php
|
||||
if ($terms) :
|
||||
$blog_url = get_permalink();
|
||||
?>
|
||||
<nav class="articles-filter">
|
||||
<ul class="articles-filter__list">
|
||||
<li class="articles-filter__item<?php if (!$current_category) echo ' is-active'; ?>">
|
||||
@@ -130,10 +128,12 @@ Template Name: Блог
|
||||
<div
|
||||
class="articles-grid"
|
||||
data-page="1"
|
||||
data-section="<?php echo esc_attr($current_section); ?>"
|
||||
data-max-pages="<?php echo $blog_query->max_num_pages; ?>"
|
||||
data-category="<?php echo $current_category; ?>"
|
||||
>
|
||||
<?php
|
||||
if (!$blog_query->have_posts()) echo '<p>Статьи не найдены.</p>';
|
||||
while ($blog_query->have_posts()) {
|
||||
$blog_query->the_post();
|
||||
get_template_part('template-parts/articles-item');
|
||||
@@ -145,7 +145,6 @@ Template Name: Блог
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php get_template_part('template-parts/socials'); ?>
|
||||
<?php get_template_part('template-parts/getapp'); ?>
|
||||
|
||||
Reference in new issue
Block a user