diff --git a/README.md b/README.md deleted file mode 100644 index 1ffc90c..0000000 --- a/README.md +++ /dev/null @@ -1,2 +0,0 @@ -# cosmopet-architecture - diff --git a/wp-content/themes/cosmopet/functions.php b/wp-content/themes/cosmopet/functions.php index fef2c5f..1cd6aa7 100644 --- a/wp-content/themes/cosmopet/functions.php +++ b/wp-content/themes/cosmopet/functions.php @@ -1,4 +1,55 @@ + + \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-desktop.css index e4f6e25..a08271c 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-desktop.css @@ -1,442 +1,3 @@ /* Home */ -.home { - padding: 140px 0 68px; -} -.home-title { - font-size: 82px; - font-weight: bold; - line-height: 96px; - color: var(--main_white); - margin-bottom: 16px; -} - -.home-description { - font-size: 32px; - font-weight: bold; - line-height: 40px; - color: var(--main_white); - text-transform: uppercase; - margin-bottom: 68px; -} - -/* Home end */ - - -/* Anons */ -.anons { - background: var(--main_white); - border-radius: 60px; - padding: 51px 0; -} - -.anons-theme__title { - color: var(--main_black); - font-size: 24px; - font-weight: bold; - line-height: 28px; - text-transform: uppercase; - margin-bottom: 20px; -} - -.anons-theme { - margin-bottom: 60px; -} - -.anons-theme ul { - max-width: 1022px; - display: flex; - flex-wrap: wrap; - gap: 12px; -} - -.anons-theme ul a { - font-size: 20px; - font-weight: 600; - line-height: 24px; - color: var(--main_black); - padding: 4px 24px; - border: 1px solid #000; - border-radius: 20px; -} - -.anons-theme ul a:hover, -.anons-theme ul a.active { - background: var(--main_black); - color: var(--main_white); -} - -.anons-best { - margin-bottom: 60px; -} - -.anons-best__title { - font-size: 36px; - line-height: 40px; - font-weight: bold; - color: var(--main_black); - margin-bottom: 20px; -} - -.anons-best__card-wrap { - display: grid; - grid-template-columns: repeat(3, minmax(0, 1fr)); - gap: 24px; -} - -.anons-best__card { - padding-top: 293px; - border-radius: 48px; - overflow: hidden; - position: relative; - z-index: 1; -} - -.anons-best__card.light { - padding-top: 0; - border-radius: 0; -} - -.anons-best__card .main-img { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 360px; - z-index: -1; -} - -.anons-best__card .main-img img { - width: 100%; - height: 100%; - object-fit: cover; -} - -.anons-best__card.light .main-img { - position: static; - height: 265px; -} -.anons-best__card.light .main-img img { - border-radius: 30px; -} - -.anons-best__card-alerts { - position: absolute; - top: 21px; - left: 17px; - width: calc(100% - 34px); - display: flex; - flex-wrap: wrap; - gap: 7px; - z-index: 1; -} - -.anons-best__card-alerts li { - padding: 6px 8px; - font-size: 16px; - line-height: 20px; - font-weight: 500; - color: var(--background); - background: var(--main_black); - border-radius: 30px; -} - -.anons-best__card-body { - background: var(--accent-1); - padding: 30px 17px 22px; - border-radius: 48px 48px 0 0; - color: var(--main_white); - position: relative; - height: 100%; -} - -.anons-best__card.light .anons-best__card-body { - background: transparent; - color: var(--main_black); - padding: 12px 0 34px; -} - -.anons-best__card-body__title { - font-size: 28px; - font-weight: bold; - line-height: 32px; - text-transform: uppercase; - margin-bottom: 14px; -} - -.anons-best__card.light .anons-best__card-body__title { - font-size: 26px; -} - -.anons-best__card-body__datas { - display: flex; - align-items: center; - flex-wrap: wrap; - gap: 6px 10px; - max-width: 264px; -} - -.anons-best__card.light .anons-best__card-body__datas { - color: var(--placeholder); -} - -.anons-best__card-body__datas p { - font-size: 14px; - line-height: 16px; - font-weight: 500; -} - -.anons-best__card-body__datas ul { - display: flex; - align-items: center; - gap: 10px; -} - -.anons-best__card-body__datas ul li { - display: flex; - align-items: center; - gap: 4px; - font-size: 14px; - line-height: 16px; - font-weight: 500; -} - -.anons-best__card-body__datas ul .logo img { - width: 24px; - height: 24px; - border-radius: 50%; - object-fit: cover; -} - -.anons-article { - margin-bottom: 40px; -} - -.anons-article__title { - font-size: 36px; - line-height: 40px; - font-weight: bold; - color: var(--main_black); - margin-bottom: 20px; -} - -.anons-article__card-wrap { - display: grid; - grid-template-columns: repeat(3, minmax(0, 1fr)); - gap: 40px 25px; -} - -.anons-article__more-link { - display: flex; - align-items: center; - justify-content: center; -} - -.anons-article__more-link a { - background: var(--accent-3); - color: var(--main_white); - border-radius: 20px; - border: 1px solid var(--main_white); - padding: 16px 24px; - font-size: 20px; - font-weight: 600; - line-height: 24px; - text-transform: uppercase; -} -/* Anons end */ - - - -/* Author */ -.author { - padding: 111px 0 105px; -} - -.author-content { - max-width: 1022px; - margin: 0 auto; - background: #CAFF81; - border-radius: 60px; - display: flex; - align-items: center; - justify-content: space-between; - padding: 35px 42px 35px 209px; - position: relative; - box-shadow: 6px 9px 20px rgba(0, 0, 0, 15%); -} - -.author-content__star-1 { - position: absolute; - width: 74px; - top: 18px; - left: -15px; - transform: translateX(-100%); -} - -.author-content__star-2 { - position: absolute; - top: 28px; - right: -24px; - transform: translateX(100%); - width: 37px; -} - -.author-content__img { - position: absolute; - left: 9px; - top: -43px; - width: 167px; -} - -.author-content__img.mb { - display: none; -} - -.author-content__title { - color: var(--main_black); - font-size: 36px; - font-weight: bold; - line-height: 40px; -} - -.author-content__link { - border-radius: 20px; - background: var(--main_black); - border: 1px solid var(--main_white); - padding: 15px 24px; - font-size: 20px; - font-weight: 600; - line-height: 24px; - color: var(--main_white); - flex-shrink: 0; -} -/* Author end */ - -/* Editorial */ -.editorial { - padding-bottom: 68px; -} - -.editorial-head { - position: relative; - z-index: 1; - max-width: 841px; - margin-bottom: 37px; -} - -.editorial-head__title { - font-size: 82px; - line-height: 96px; - font-weight: bold; - color: var(--main_white); - text-transform: uppercase; -} - -.editorial-head__img { - position: absolute; - z-index: -1; - top: -14px; - right: -20px; - width: 221px; -} - -.editorial-head__star { - position: absolute; - top: 8.26px; - right: -13.5px; - transform: translateX(100%); - width: 87.5px; -} - -.editorial-card__wrap { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - gap: 31px 25px; - position: relative; - z-index: 1; -} - -.editorial-card { - border: 2px solid var(--creme-white); - border-radius: 30px; - display: flex; - align-items: stretch; - overflow: hidden; - background: var(--linear); - backdrop-filter: blur(28px); -} - -.editorial-card .main-img { - min-height: 282px; - width: 207px; - border-radius: 29px; - overflow: hidden; - flex-shrink: 0; -} - -.editorial-card .main-img img { - width: 100%; - height: 100%; - object-fit: cover; -} - -.editorial-card__content { - padding: 42px 19px 19px 35px; -} - -.editorial-card__content-alerts { - display: flex; - flex-wrap: wrap; - align-items: center; - gap: 7px; - margin-bottom: 17px; -} - -.editorial-card__content-alerts a { - background: var(--main_black); - border-radius: 16px; - padding: 6px 8px; - font-size: 16px; - font-weight: 500; - line-height: 20px; - color: var(--background); -} - -.editorial-card__content-title { - font-size: 28px; - font-weight: bold; - line-height: 32px; - color: var(--grey-black); - text-transform: uppercase; - margin-bottom: 17px; -} - -.editorial-card__content-data { - display: flex; - flex-wrap: wrap; - gap: 5px 16px; - color: var(--interface_hover); - font-size: 16px; - font-weight: 500; - line-height: 20px; -} - -.editorial-card__content-data ul { - display: flex; - align-items: center; - gap: 16px; -} - -.editorial-card__content-data li { - display: flex; - align-items: center; - gap: 5px; -} - -.editorial-card__content-data .logo img { - width: 24px; - height: 24px; - border-radius: 50%; - object-fit: cover; -} /* Editorial end */ \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-tablet.css index 0a868f5..77b4843 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-tablet.css +++ b/wp-content/themes/cosmopet/modules/blog/components/archive/assets/css/gp-style-tablet.css @@ -1,32 +1,4 @@ /* Стили для планшетов */ @media only screen and (max-width: 992px) { - .header-navs { - display: none; - } - .header-container { - height: 56px; - padding: 0; - } - - .header-bars { - display: flex; - align-items: center; - justify-content: center; - } - - .header-logo { - font-size: 16px; - line-height: 20px; - gap: 8px; - } - - .header-logo img { - width: 31px; - flex-shrink: 0; - } - - .header-lang { - display: none; - } } diff --git a/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php index 8ce3412..5851e80 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/archive/component-controller.php @@ -1,5 +1,18 @@ admin_url('admin-ajax.php'), +)); $context = Timber::get_context(); + +$context['post_count'] = wp_count_posts()->publish; // Количество опубликованных постов +$context['total_pages'] = ceil($context['post_count'] / get_option('posts_per_page')); // Общее количество страниц + Timber::render('blog/components/archive/component-template.twig', $context); diff --git a/wp-content/themes/cosmopet/modules/blog/components/archive/component-template.twig b/wp-content/themes/cosmopet/modules/blog/components/archive/component-template.twig index 067af5e..c77e21f 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/archive/component-template.twig +++ b/wp-content/themes/cosmopet/modules/blog/components/archive/component-template.twig @@ -16,496 +16,34 @@
- -
-

САМЫЕ ЧИТАЕМЫЕ:

- -
+ {% include '/blog/components/themes/component-template.twig' %} + {% include '/blog/components/most-read/component-template.twig' %} +

ВСЕ СТАТЬИ

+
-
- ПОКАЗАТЬ ЕЩЁ -
-
+ {% if total_pages > 1 %} +
+ + + +
+ {% endif %}
-
-
-
- - - - -

ПРЕДЛОЖИТЕ СТАТЬЮ
ИЛИ СТАНЬТЕ АВТОРОМ

- НАПИШИТЕ НАМ -
-
-
+ {% include '/blog/components/author-banner/component-template.twig' %} -
-
-
-

COSMO тема редакции

- - -
- -
-
+ {% include '/blog/components/editorial/component-template.twig' %} {% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card-mb.png b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card-mb.png new file mode 100644 index 0000000..d374fd6 Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card-mb.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card.png b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card.png new file mode 100644 index 0000000..4bdad1d Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/author-card.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-1.png b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-1.png new file mode 100644 index 0000000..3fdc219 Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-1.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-2.png b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-2.png new file mode 100644 index 0000000..8b32afb Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/author-banner/assets/img/star-2.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/author-banner/component-template.twig b/wp-content/themes/cosmopet/modules/blog/components/author-banner/component-template.twig index e69de29..428b177 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/author-banner/component-template.twig +++ b/wp-content/themes/cosmopet/modules/blog/components/author-banner/component-template.twig @@ -0,0 +1,14 @@ + {% set current_path = template_path ~ '/modules/blog/components/author-banner' %} + +
+
+
+ + + + +

ПРЕДЛОЖИТЕ СТАТЬЮ
ИЛИ СТАНЬТЕ АВТОРОМ

+ НАПИШИТЕ НАМ +
+
+
\ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg-sm.png b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg-sm.png new file mode 100644 index 0000000..4a2e4d3 Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg-sm.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg.png b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg.png new file mode 100644 index 0000000..1679df3 Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/discount-bg.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-card.png b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-card.png new file mode 100644 index 0000000..5e4777b Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-card.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-icon.png b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-icon.png new file mode 100644 index 0000000..a41c483 Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-icon.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-star.png b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-star.png new file mode 100644 index 0000000..5ca8dbb Binary files /dev/null and b/wp-content/themes/cosmopet/modules/blog/components/editorial/assets/img/editorial-head-star.png differ diff --git a/wp-content/themes/cosmopet/modules/blog/components/editorial/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/editorial/component-controller.php index a4abe2d..2ef4415 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/editorial/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/editorial/component-controller.php @@ -1,2 +1,14 @@ +
+
+

COSMO тема редакции

+ + +
+ +
+ +{% endif %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css index a029ca3..e69de29 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-desktop.css @@ -1,166 +0,0 @@ -.home-swp { - position: relative; -} - -.home-swp__btn { - position: absolute; - bottom: 22px; - left: 50%; - transform: translateX(-50%); - z-index: 2; - display: flex; - align-items: center; - gap: 24px; -} - -.home-swp__btn button { - border: 1px solid var(--main_black); - background: var(--main_white); - width: 56px; - height: 56px; - display: flex; - align-items: center; - justify-content: center; - border-radius: 20px; -} - -.home-swp .swiper-slide:not(.swiper-slide-active) { - height: 0; - overflow: hidden; -} - -.home-card { - border-radius: 60px; - overflow: hidden; - display: flex; - align-items: flex-start; - gap: 24px; - position: relative; -} - -.home-card.bg-yellow { - background: var(--orange_80); -} - -.home-card.bg-green { - background: var(--green_90); -} - -.home-card.bg-violet { - background: var(--violet_90); -} - -.home-card__img { - width: 395px; - border-radius: 60px; - overflow: hidden; - height: 393px; - flex-shrink: 0; -} - -.home-card__img img { - width: 100%; - height: 100%; - object-fit: cover; -} - -.home-card__content { - padding: 32px 79px 0 0; -} - -.home-card__content-title { - font-size: 36px; - font-weight: bold; - line-height: 40px; - text-transform: uppercase; - max-width: 660px; - margin-bottom: 10px; - color: var(--interface_title); -} - -.home-card__content-description { - color: var(--interface_title); - margin-bottom: 10px; - font-size: 20px; - font-weight: 500; - line-height: 24px; - display: -webkit-box; - -webkit-line-clamp: 3; - -webkit-box-orient: vertical; - overflow: hidden; - text-overflow: ellipsis; -} - -.home-card__content-body { - display: flex; - align-items: center; - flex-wrap: wrap; - gap: 12px; -} - -.home-card__content-body__alerts { - display: flex; - align-items: center; - flex-wrap: wrap; - gap: 12px; -} - -.home-card__content-body__alerts li { - background: var(--interface_hover); - color: var(--background); - border-radius: 16px; - padding: 6px 8px; - font-size: 16px; - font-weight: 500; - line-height: 20px; -} - -.home-card__content-body__day { - color: var(--interface_hover); - font-size: 14px; - font-weight: 500; - line-height: 16px; -} - -.home-card__content-body__time { - font-size: 14px; - font-weight: 500; - line-height: 16px; - color: var(--interface_hover); -} - -.home-card__content-body__data { - display: flex; - align-items: center; - gap: 12px; -} - -.home-card__content-body__data>div { - display: flex; - align-items: center; - gap: 4px; - font-size: 14px; - font-weight: 500; - line-height: 16px; - color: var(--interface_hover); -} - -.home-card__content-body__data>div .main-img { - width: 32px; - height: 32px; - border-radius: 50%; - object-fit: cover; -} - -.home-card__content-body__link { - border: 1px solid #000000; - border-radius: 28px; - background: var(--main_white); - position: absolute; - right: 37px; - bottom: 26px; - padding: 8.5px 16px 12.5px; - font-style: 20px; - font-weight: 500; - line-height: 24px; -} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css index 0a868f5..e69de29 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css +++ b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/assets/css/gp-style-tablet.css @@ -1,32 +0,0 @@ -/* Стили для планшетов */ -@media only screen and (max-width: 992px) { - .header-navs { - display: none; - } - - .header-container { - height: 56px; - padding: 0; - } - - .header-bars { - display: flex; - align-items: center; - justify-content: center; - } - - .header-logo { - font-size: 16px; - line-height: 20px; - gap: 8px; - } - - .header-logo img { - width: 31px; - flex-shrink: 0; - } - - .header-lang { - display: none; - } -} diff --git a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/component-controller.php index a4abe2d..256e5e8 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/featured-slider/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/featured-slider/component-controller.php @@ -1,2 +1,14 @@
+ + {% for item in featured %} + {% set _post = item.post %} +
-
- - +
+ + {{_post.thumbnail.alt}} +
- Как выбрать когтеточку: обзор мастхевов для вашей - кошки -

Простая с виду задача «купить когтеточку» может - оказаться утомительным и дорогим занятием. Типичная ситуация: вы приобрели сразу несколько - вариантов ...

+ {{_post.name}} +

{{_post.excerpt}}

    -
  • Обзоры
  • -
  • Тренды
  • + {% for category in _post.categories %} +
  • + {{ category.name }} +
  • + {% endfor %}
-
21.10.24
-
время чтения: 5 минут
-
-
- - 22 -
-
- - 22 -
-
- -
-
- читать статью -
-
-
-
-
-
- - - -
- Краткая история кормов: от хлебных корок до - лечебных рационов -

Современный мир сложно представить без готовых кормов - для собак и кошек. И сложно поверить, что это относительно современная концепция, - существующая менее 150 лет. Поэтапно о том ...

-
-
    -
  • Обзоры
  • -
  • Тренды
  • -
-
21.10.24
-
время чтения: 5 минут
-
-
- - 22 -
-
- - 22 -
-
- -
-
- читать статью -
-
-
-
-
-
- - - -
- Пищевая аллергия у собак. Причины и пути - решения -

Даже привычный рацион может вызвать у питомца - нежелательную реакцию – зуд, расстройства ЖКТ, изменения в поведении. Хорошая новость: с - этой проблемой можно справиться. Рассказываем, как ...

-
-
    -
  • Обзоры
  • -
  • Тренды
  • -
-
21.10.24
-
время чтения: 5 минут
-
-
- - 22 -
-
- - 22 -
-
- -
-
- читать статью +
{{_post.date}}
+
время чтения: {{_post.reading_time}}
+ + читать статью
+ {% endfor %}
-
\ No newline at end of file + + +{% endif %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/most-read/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/most-read/component-controller.php index a4abe2d..b9bce3d 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/most-read/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/most-read/component-controller.php @@ -1,2 +1,23 @@ 'post', + 'posts_per_page' => 3, // Количество постов + 'orderby' => 'meta_value_num', + 'key' => 'post_views', // Поле плагина для подсчёта просмотров + 'order' => 'DESC', // Сортировка по убыванию + + // Условие для фильтрации по текущей категории + 'category__in' => $current_category ? array($current_category->term_id) : '', + ); + + $most_read_query = new WP_Query($args); + $most_read = new Timber\PostQuery($most_read_query); + + $context['most_read'] = $most_read; + return $context; +}); diff --git a/wp-content/themes/cosmopet/modules/blog/components/most-read/component-template.twig b/wp-content/themes/cosmopet/modules/blog/components/most-read/component-template.twig index e69de29..c5a282b 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/most-read/component-template.twig +++ b/wp-content/themes/cosmopet/modules/blog/components/most-read/component-template.twig @@ -0,0 +1,28 @@ +
+

САМЫЕ ЧИТАЕМЫЕ:

+ +
+ + diff --git a/wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js b/wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js new file mode 100644 index 0000000..b07275f --- /dev/null +++ b/wp-content/themes/cosmopet/modules/blog/components/news-list/assets/js/posts-ajax.js @@ -0,0 +1,21 @@ +jQuery(document).ready(function ($) { + $('#ajax-load-blog').on('submit', function (e) { + e.preventDefault() + var data = $(this).serialize() + $.ajax({ + url: '/wp-admin/admin-ajax.php', // Use the AJAX URL from wp_localize_script + type: 'POST', + data: data, + success: function (response) { + $(".anons-article__card-wrap").append(response) + $('#page_num').val(Number($('#page_num').val()) + 1) + if (Number($('#page_num').val()) >= Number($('#ajax-load-blog').data('total'))){ + $('#ajax-load-blog').hide() + } + }, + error: function (error) { + + } + }); + }); +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/news-list/component-ajax-controller.php b/wp-content/themes/cosmopet/modules/blog/components/news-list/component-ajax-controller.php index e69de29..2156b85 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/news-list/component-ajax-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/news-list/component-ajax-controller.php @@ -0,0 +1,38 @@ + 'post', + 'posts_per_page' => 9, // Adjust the number of posts per page + 'paged' => intval($paged) + 1, + ]; + + if (!empty($category)) { + $args['tax_query'] = [ + [ + 'taxonomy' => 'category', + 'field' => 'slug', // or 'term_id', 'name' depending on how you identify categories + 'terms' => $category, + ], + ]; + } + $q = new WP_Query($args); + return new Timber\PostQuery($q); +} + +function ajax_load_blog_posts() { + $page_num = isset($_POST['page_num']) ? sanitize_text_field($_POST['page_num']) : ''; + $context = Timber::context(); + $context['posts'] = get_posts_by_page_and_category($page_num); + $html = Timber::compile('/blog/components/news-list/component-template.twig', $context); + echo $html; + wp_die(); +} + + +add_action('wp_ajax_load_blog_posts', 'ajax_load_blog_posts'); +add_action('wp_ajax_nopriv_load_blog_posts', 'ajax_load_blog_posts'); + + diff --git a/wp-content/themes/cosmopet/modules/blog/components/news-list/component-template.twig b/wp-content/themes/cosmopet/modules/blog/components/news-list/component-template.twig index e69de29..1e9bfba 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/news-list/component-template.twig +++ b/wp-content/themes/cosmopet/modules/blog/components/news-list/component-template.twig @@ -0,0 +1,22 @@ +{% for post in posts %} + +
  • + + + {{post.thumbnail.alt}} + +
    + {{post.title}} +
    +

    {{post.date}}

    +

    время чтения: {{post.reading_time}}

    +
    +
    +
  • +{% endfor %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-desktop.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-mobile.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/single/assets/css/gp-style-tablet.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/component-ajax-controller.php b/wp-content/themes/cosmopet/modules/blog/components/single/component-ajax-controller.php new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php new file mode 100644 index 0000000..a824287 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/blog/components/single/component-controller.php @@ -0,0 +1,6 @@ + + + + + +
    +
    +

    {{post.name}}

    +
    + +

    {{post.date}}

    +

    время чтения: {{post.reading_time}}

    + +
    +
    + {{post.thumbnail.alt}} +
    +
    +
    + + + + +
    +
    + {{post.content}} +
    + + + + +{% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-desktop.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-mobile.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/blog/components/themes/assets/css/gp-style-tablet.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/component-controller.php b/wp-content/themes/cosmopet/modules/blog/components/themes/component-controller.php index a4abe2d..7c8d943 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/themes/component-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/components/themes/component-controller.php @@ -1,2 +1,21 @@ name)) { + $category_name = $current_category->name; + } else { + $category_name = null; + } + + $context['category_list'] = $categories; + $context['current_category'] = $category_name; + return $context; +}); + + diff --git a/wp-content/themes/cosmopet/modules/blog/components/themes/component-template.twig b/wp-content/themes/cosmopet/modules/blog/components/themes/component-template.twig index e69de29..c53e444 100644 --- a/wp-content/themes/cosmopet/modules/blog/components/themes/component-template.twig +++ b/wp-content/themes/cosmopet/modules/blog/components/themes/component-template.twig @@ -0,0 +1,15 @@ + + +
    +

    Темы:

    + +
    \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/assets/css/style.css b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/assets/css/style.css new file mode 100644 index 0000000..3b2c455 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/assets/css/style.css @@ -0,0 +1,139 @@ +.texts { + display: flex; + flex-direction: column; + gap: 48px; +} + +.texts h2 { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--grey-black); + text-transform: uppercase; +} + +.texts h3 { + font-size: 24px; + line-height: 28px; + font-weight: bold; + color: var(--grey-black); + text-transform: uppercase; +} + +.texts-description { + display: flex; + flex-direction: column; + gap: 48px; +} + +.texts-description p { + color: var(--grey-black); + font-size: 24px; + line-height: 32px; + font-weight: 500; +} + +.texts-description a { + display: inline; + text-decoration: underline; +} + +.texts ol { + display: flex; + flex-direction: column; + gap: 12px; + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: #191919; +} + +.texts ol li { + display: flex; + align-items: center; + gap: 12px; +} + +.texts ol h4 { + background: var(--accent-1); + border-radius: 5.2px; + width: 32px; + height: 32px; + display: flex; + align-items: center; + justify-content: center; + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: white; +} + +.texts ul { + display: flex; + flex-direction: column; + gap: 12px; +} + +.texts ul li { + padding-left: 22px; + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: #191919; + position: relative; +} + +.texts ul li::before { + content: ""; + width: 10px; + height: 10px; + position: absolute; + top: 50%; + left: 0; + transform: translateY(-50%); + background: var(--accent-1); + border-radius: 3px; +} + + +@media only screen and (max-width: 992px) { + + .texts h2 { + font-size: 28px; + line-height: 32px; + } + + .texts h3 { + font-size: 20px; + line-height: 24px; + } + + .texts-description p { + font-size: 18px; + line-height: 24px; + } + + .texts ol { + gap: 12px; + } + + .texts ol li { + font-size: 18px; + line-height: 24px; + } + + .texts ol li h4 { + font-size: 18px; + line-height: 24px; + } + + .texts ul { + gap: 12px; + } + + .texts ul li { + font-size: 18px; + line-height: 24px; + } + +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-controller.php b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-controller.php new file mode 100644 index 0000000..c18aa0e --- /dev/null +++ b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-controller.php @@ -0,0 +1,37 @@ + 'gp_texts', + 'title' => __('GP - Texts'), + 'description' => __('A block to serve a text content'), + 'render_callback' => 'texts_render_callback', + 'category' => 'formatting', + 'icon' => 'admin-comments', + 'keywords' => array( 'texts', 'simple block', 'gp-block',), + 'mode' => 'preview', + 'enqueue_assets' => function(){ + wp_enqueue_style('gp_util_style', get_template_directory_uri() . '/modules/layout/assets/css/gp-style-core.css', array(), '1.0', 'all'); + wp_enqueue_style('gp_normalize', get_template_directory_uri() . '/modules/layout/assets/css/gp-style-normalize.css', array(), '1.0', 'all'); + wp_enqueue_style('gp_texts_style', get_template_directory_uri() . '/modules/blog/editor-blocks/texts/assets/css/style.css', array(), '1.0', 'all'); + } + )); + } +}); + + + + +?> \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-template.twig b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-template.twig new file mode 100644 index 0000000..3254b2c --- /dev/null +++ b/wp-content/themes/cosmopet/modules/blog/editor-blocks/texts/editor-block-template.twig @@ -0,0 +1,4 @@ +
    +{{ content }} +
    + \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/blog/module-controller.php b/wp-content/themes/cosmopet/modules/blog/module-controller.php index e69de29..d3ce61c 100644 --- a/wp-content/themes/cosmopet/modules/blog/module-controller.php +++ b/wp-content/themes/cosmopet/modules/blog/module-controller.php @@ -0,0 +1,33 @@ +content())); + $minutes = round($symb / $symb_per_minute); + + /* translators: %s: Time duration in minute or minutes. */ + return sprintf(_n('%s мин.', '%s мин.', $minutes), (int) $minutes); + } +} + +add_filter('timber/post/classmap', function ($classmap) { + $custom_classmap = [ + 'post' => BlogPost::class, + ]; + + return array_merge($classmap, $custom_classmap); +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-desktop.css new file mode 100644 index 0000000..4159eb7 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-desktop.css @@ -0,0 +1,87 @@ +/* Header */ +.header { + background: var(--main_white); + border-bottom: 1px solid var(--interface_title); + position: fixed; + top: 0; + left: 0; + width: 100%; + z-index: 4; +} + +.header-container { + display: flex; + align-items: center; + justify-content: space-between; + padding: 16px 0; +} + +.header-bars { + display: none; +} + +.header-logo { + display: flex; + align-items: center; + gap: 8px; +} + +.header-logo span { + color: var(---main_black); + font-size: 20px; + text-transform: uppercase; +} + +.header-navs { + display: flex; + align-items: center; + gap: 24px; +} + +.header-navs__link { + padding: 8px 12px; + font-size: 16px; + font-weight: bold; + text-transform: uppercase; + line-height: 20px; +} + +.header-accordion {} + +.header-accordion__btn { + display: flex; + align-items: center; + gap: 4px; + padding: 8px 12px; + border-radius: 24px; + background: var(--accent-2); + cursor: pointer; + user-select: none; + font-size: 16px; + font-weight: bold; + line-height: 20px; + color: var(---main_black); +} + +.header-right { + display: flex; + align-items: center; + gap: 8px; +} + +.header-lang__btn { + display: flex; + align-items: center; + cursor: pointer; + user-select: none; + gap: 4px; + padding: 12px 15px; + color: var(---main_black); + font-size: 16px; + font-weight: bold; + line-height: 20px; +} + +/* Header end */ + + diff --git a/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-mobile.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-tablet.css new file mode 100644 index 0000000..0a868f5 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-tablet.css @@ -0,0 +1,32 @@ +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + .header-navs { + display: none; + } + + .header-container { + height: 56px; + padding: 0; + } + + .header-bars { + display: flex; + align-items: center; + justify-content: center; + } + + .header-logo { + font-size: 16px; + line-height: 20px; + gap: 8px; + } + + .header-logo img { + width: 31px; + flex-shrink: 0; + } + + .header-lang { + display: none; + } +} diff --git a/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-ultra.css b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-ultra.css new file mode 100644 index 0000000..c149baa --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-ultra.css @@ -0,0 +1,4 @@ +/* Стили для ультрашироких экранов */ +@media only screen and (min-width: 1400px) { + +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-xl.css b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-xl.css new file mode 100644 index 0000000..478ccf2 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/assets/css/gp-style-xl.css @@ -0,0 +1,11 @@ +@media (max-width: 1200px) { + .header-navs { + gap: 12px; + } + .header-navs__link { + font-size: 14px; + } + .header-right { + gap: 4px; + } +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-desktop.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-mobile.css b/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-mobile.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-tablet.css b/wp-content/themes/cosmopet/modules/example/components/example/assets/css/gp-style-tablet.css new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/components/example/component-ajax-controller.php b/wp-content/themes/cosmopet/modules/example/components/example/component-ajax-controller.php new file mode 100644 index 0000000..0666218 --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/components/example/component-ajax-controller.php @@ -0,0 +1,4 @@ + \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/example/components/example/component-controller.php b/wp-content/themes/cosmopet/modules/example/components/example/component-controller.php new file mode 100644 index 0000000..b124fde --- /dev/null +++ b/wp-content/themes/cosmopet/modules/example/components/example/component-controller.php @@ -0,0 +1,12 @@ + +
    +
    +

    БЛОГ

    +

    Мы пишем про то, что нас по‑настоящему цепляет: биотехнологии, науку, здоровье и то, как этот мир сделать лучше. Мы не боимся сложных тем и неудобных вопросов, ведь именно с них начинается будущее

    + {% include '/blog/components/featured-slider/component-template.twig' %} +
    +
    + + + +
    +
    + {% include '/blog/components/themes/component-template.twig' %} + {% include '/blog/components/most-read/component-template.twig' %} + {% include '/blog/components/news-list/component-template.twig' %} +
    + + + + {% include '/blog/components/author-banner/component-template.twig' %} + + + + {% include '/blog/components/editorial/component-template.twig' %} + + +{% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/example/module-ajax-controller.php b/wp-content/themes/cosmopet/modules/example/module-ajax-controller.php new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/module-controller.php b/wp-content/themes/cosmopet/modules/example/module-controller.php new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/example/module.template.twig b/wp-content/themes/cosmopet/modules/example/module.template.twig new file mode 100644 index 0000000..e69de29 diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-full.css b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-full.css new file mode 100644 index 0000000..776961e --- /dev/null +++ b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-full.css @@ -0,0 +1,2914 @@ +@font-face { + font-family: "Craftwork Grotest"; + src: url('../fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Regular.ttf'); + font-weight: 400; +} + +@font-face { + font-family: "Craftwork Grotest"; + src: url('../fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Medium.ttf'); + font-weight: 500; +} + +@font-face { + font-family: "Craftwork Grotest"; + src: url('../fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-SemiBold.ttf'); + font-weight: 600; +} + +@font-face { + font-family: "Craftwork Grotest"; + src: url('../fonts/Craftwork_Grotesk_Trial/CraftworkGrotesk-Bold.ttf'); + font-weight: 700; +} + +@font-face { + font-family: "Abel"; + src: url('../fonts/Abel/Abel-Regular.ttf'); + font-weight: 400; +} + +* { + padding: 0; + margin: 0; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent !important; +} + +a { + text-decoration: none; + color: inherit; + display: inline-block; + cursor: pointer; +} + +img { + max-width: 100%; +} + +span, +label { + display: inline-block; +} + +html { + scroll-behavior: smooth; +} + +input, +textarea { + outline: none; + border: 0; + background: transparent; +} + +button, +select { + border: none; + cursor: pointer; + background: transparent; + outline: 0; +} + +address { + font-style: normal; +} + +.wrapper { + width: 100%; + overflow: hidden; + min-height: 100svh; +} + +ul, +ol, +dl { + list-style: none; + padding: 0; + margin: 0; +} + +p, +h1, +h2, +h3, +h4, +h5, +h6 { + padding: 0; + margin: 0; + font-weight: 500; +} + +input[type=number]::-webkit-inner-spin-button, +input[type=number]::-webkit-outer-spin-button { + -webkit-appearance: none; + -moz-appearance: none; + margin: 0; +} + + +:root { + /* Colors */ + --radial: radial-gradient(261.43% 263.03% at 124% -28.000000000000004%,rgb(15, 88, 129),rgb(30, 164, 156) 36.979%,rgb(118, 206, 117) 66.667%,rgb(236, 243, 159) 91.146%); + --accent-1: radial-gradient(142.43% 141.42% at 100% 0%, #188892 0%, #1EA49C 45%, #76CE75 90%, #BBE38D 100%); + --accent-2: radial-gradient(2700.48% 141.42% at 100% 0%,rgb(122, 217, 231),rgb(126, 231, 225) 25%,rgb(181, 228, 180) 80%,rgb(215, 238, 170) 100%); + --accent-3: linear-gradient(6deg, rgb(244, 66, 66) 7.584%,rgb(86, 158, 240) 72.371%); + --linear: linear-gradient(-7.39deg, rgb(244, 241, 240) 23.643%,rgba(244, 241, 240, 0.3) 59.827%); + --btn-bg: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%); + + + --main_white: #FFFFFF; + --creme-white: #F4F1F0; + --grey-f5: #F5F5F5; + --main_black: #121212; + --grey-black: #121212; + --bg-light-grey: #F5F5F5; + --interface_title: #333333; + --interface_hover: #666666; + --orange_80: #FFDF99; + --green_90: #D9FFCC; + --green-dark: #76CE75; + --violet_90: #E7CAFF; + --blue_90: #CCE2FF; + --background: #F4F1F0; + --placeholder: #999999; + /* Fonts */ + --font-craftwork: 'Craftwork Grotest', sans-serif; + --font-abel: 'Abel', serif; +} + +body { + background: var(--radial); + font-family: var(--font-craftwork); + font-weight: 500; +} + +.container { + max-width: 1232px; + margin: 0 auto; + + @media (max-width: 1264px) { + max-width: calc(100% - 32px); + } +} + +.form-inp { + height: 48px; + width: 100%; + border: 1px solid var(--placeholder); + border-radius: 20px; + background: var(--main_white); + padding: 0 16px; + color: var(--main_black); + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-inp::placeholder { + color: var(--placeholder); +} + +.form-inp:hover, +.form-inp:focus { + border-color: var(--main_black); +} + +.form-textarea { + height: 96px; + width: 100%; + resize: none; + background: var(--main_white); + border: 1px solid var(--placeholder); + padding: 12px 16px; + border-radius: 20px; + color: var(--main_black); + font-size: 20px; + font-weight: 400; + line-height: 24px; +} + +.form-textarea::placeholder { + color: var(--placeholder); +} + +.form-textarea:hover, +.form-textarea:focus { + border-color: var(--main_black); +} + +/* Основные стили для компьютера */ + +/* Header */ +.header { + background: var(--main_white); + border-bottom: 1px solid var(--interface_title); + position: fixed; + top: 0; + left: 0; + width: 100%; + z-index: 4; +} + +.header-container { + display: flex; + align-items: center; + justify-content: space-between; + padding: 16px 0; +} + +.header-bars { + display: none; +} + +.header-logo { + display: flex; + align-items: center; + gap: 8px; +} + +.header-logo span { + color: var(---main_black); + font-size: 20px; + text-transform: uppercase; +} + +.header-navs { + display: flex; + align-items: center; + gap: 24px; +} + +.header-navs__link { + padding: 8px 12px; + font-size: 16px; + font-weight: bold; + text-transform: uppercase; + line-height: 20px; +} + +.header-accordion {} + +.header-accordion__btn { + display: flex; + align-items: center; + gap: 4px; + padding: 8px 12px; + border-radius: 24px; + background: var(--accent-2); + cursor: pointer; + user-select: none; + font-size: 16px; + font-weight: bold; + line-height: 20px; + color: var(---main_black); +} + +.header-right { + display: flex; + align-items: center; + gap: 8px; +} + +.header-lang__btn { + display: flex; + align-items: center; + cursor: pointer; + user-select: none; + gap: 4px; + padding: 12px 15px; + color: var(---main_black); + font-size: 16px; + font-weight: bold; + line-height: 20px; +} + +/* Header end */ + + +/* Home */ +.home { + padding: 140px 0 68px; +} + +.home-title { + font-size: 82px; + font-weight: bold; + line-height: 96px; + color: var(--main_white); + margin-bottom: 16px; +} + +.home-description { + font-size: 32px; + font-weight: bold; + line-height: 40px; + color: var(--main_white); + text-transform: uppercase; + margin-bottom: 68px; +} + +.home-swp { + position: relative; +} + +.home-swp__btn { + position: absolute; + bottom: 22px; + left: 50%; + transform: translateX(-50%); + z-index: 2; + display: flex; + align-items: center; + gap: 24px; +} + +.home-swp__btn button { + border: 1px solid var(--main_black); + background: var(--main_white); + width: 56px; + height: 56px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 20px; +} + +.home-swp .swiper-slide:not(.swiper-slide-active) { + height: 0; + overflow: hidden; +} + +.home-card { + border-radius: 60px; + overflow: hidden; + display: flex; + align-items: flex-start; + gap: 24px; + position: relative; +} + +.home-card.bg-yellow { + background: var(--orange_80); +} + +.home-card.bg-green { + background: var(--green_90); +} + +.home-card.bg-violet { + background: var(--violet_90); +} + +.home-card__img { + width: 395px; + border-radius: 60px; + overflow: hidden; + height: 393px; + flex-shrink: 0; +} + +.home-card__img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.home-card__content { + padding: 32px 79px 0 0; +} + +.home-card__content-title { + font-size: 36px; + font-weight: bold; + line-height: 40px; + text-transform: uppercase; + max-width: 660px; + margin-bottom: 10px; + color: var(--interface_title); +} + +.home-card__content-description { + color: var(--interface_title); + margin-bottom: 10px; + font-size: 20px; + font-weight: 500; + line-height: 24px; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; +} + +.home-card__content-body { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 12px; +} + +.home-card__content-body__alerts li { + background: var(--interface_hover); + color: var(--background); + border-radius: 16px; + padding: 6px 8px; + font-size: 16px; + font-weight: 500; + line-height: 20px; +} + +.home-card__content-body__day { + color: var(--interface_hover); + font-size: 14px; + font-weight: 500; + line-height: 16px; +} + +.home-card__content-body__time { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data { + display: flex; + align-items: center; + gap: 12px; +} + +.home-card__content-body__data>div { + display: flex; + align-items: center; + gap: 4px; + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.home-card__content-body__data>div .main-img { + width: 32px; + height: 32px; + border-radius: 50%; + object-fit: cover; +} + +.home-card__content-body__link { + border: 1px solid #000000; + border-radius: 28px; + background: var(--main_white); + position: absolute; + right: 37px; + bottom: 26px; + padding: 8.5px 16px 12.5px; + font-style: 20px; + font-weight: 500; + line-height: 24px; +} +/* Home end */ + + +/* Anons */ +.anons { + background: var(--main_white); + border-radius: 60px; + padding: 51px 0; +} + +.anons-theme__title { + color: var(--main_black); + font-size: 24px; + font-weight: bold; + line-height: 28px; + text-transform: uppercase; + margin-bottom: 20px; +} + +.anons-theme { + margin-bottom: 60px; +} + +.anons-theme ul { + max-width: 1022px; + display: flex; + flex-wrap: wrap; + gap: 12px; +} + +.anons-theme ul a { + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_black); + padding: 4px 24px; + border: 1px solid #000; + border-radius: 20px; +} + +.anons-theme ul a:hover, +.anons-theme ul a.active { + background: var(--main_black); + color: var(--main_white); +} + +.anons-best { + margin-bottom: 60px; +} + +.anons-best__title { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--main_black); + margin-bottom: 20px; +} + +.anons-best__card-wrap { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 24px; +} + +.anons-best__card { + padding-top: 293px; + border-radius: 48px; + overflow: hidden; + position: relative; + z-index: 1; +} + +.anons-best__card.light { + padding-top: 0; + border-radius: 0; +} + +.anons-best__card .main-img { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 360px; + z-index: -1; +} + +.anons-best__card .main-img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.anons-best__card.light .main-img { + position: static; + height: 265px; +} +.anons-best__card.light .main-img img { + border-radius: 30px; +} + +.anons-best__card-alerts { + position: absolute; + top: 21px; + left: 17px; + width: calc(100% - 34px); + display: flex; + flex-wrap: wrap; + gap: 7px; + z-index: 1; +} + +.anons-best__card-alerts li { + padding: 6px 8px; + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--background); + background: var(--main_black); + border-radius: 30px; +} + +.anons-best__card-body { + background: var(--accent-1); + padding: 30px 17px 22px; + border-radius: 48px 48px 0 0; + color: var(--main_white); + position: relative; + height: 100%; +} + +.anons-best__card.light .anons-best__card-body { + background: transparent; + color: var(--main_black); + padding: 12px 0 34px; +} + +.anons-best__card-body__title { + font-size: 28px; + font-weight: bold; + line-height: 32px; + text-transform: uppercase; + margin-bottom: 14px; +} + +.anons-best__card.light .anons-best__card-body__title { + font-size: 26px; +} + +.anons-best__card-body__datas { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 6px 10px; + max-width: 264px; +} + +.anons-best__card.light .anons-best__card-body__datas { + color: var(--placeholder); +} + +.anons-best__card-body__datas p { + font-size: 14px; + line-height: 16px; + font-weight: 500; +} + +.anons-best__card-body__datas ul { + display: flex; + align-items: center; + gap: 10px; +} + +.anons-best__card-body__datas ul li { + display: flex; + align-items: center; + gap: 4px; + font-size: 14px; + line-height: 16px; + font-weight: 500; +} + +.anons-best__card-body__datas ul .logo img { + width: 24px; + height: 24px; + border-radius: 50%; + object-fit: cover; +} + +.anons-article { + margin-bottom: 40px; +} + +.anons-article__title { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--main_black); + margin-bottom: 20px; +} + +.anons-article__card-wrap { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 40px 25px; +} + +.anons-article__more-link { + display: flex; + align-items: center; + justify-content: center; +} + +.anons-article__more-link a { + background: var(--accent-3); + color: var(--main_white); + border-radius: 20px; + border: 1px solid var(--main_white); + padding: 16px 24px; + font-size: 20px; + font-weight: 600; + line-height: 24px; + text-transform: uppercase; +} +/* Anons end */ + +/* Author */ +.author { + padding: 111px 0 105px; +} + +.author-content { + max-width: 1022px; + margin: 0 auto; + background: #CAFF81; + border-radius: 60px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 35px 42px 35px 209px; + position: relative; + box-shadow: 6px 9px 20px rgba(0, 0, 0, 15%); +} + +.author-content__star-1 { + position: absolute; + width: 74px; + top: 18px; + left: -15px; + transform: translateX(-100%); +} + +.author-content__star-2 { + position: absolute; + top: 28px; + right: -24px; + transform: translateX(100%); + width: 37px; +} + +.author-content__img { + position: absolute; + left: 9px; + top: -43px; + width: 167px; +} + +.author-content__img.mb { + display: none; +} + +.author-content__title { + color: var(--main_black); + font-size: 36px; + font-weight: bold; + line-height: 40px; +} + +.author-content__link { + border-radius: 20px; + background: var(--main_black); + border: 1px solid var(--main_white); + padding: 15px 24px; + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_white); + flex-shrink: 0; +} +/* Author end */ + +/* Editorial */ +.editorial { + padding-bottom: 68px; +} + +.editorial-head { + position: relative; + z-index: 1; + max-width: 841px; + margin-bottom: 37px; +} + +.editorial-head__title { + font-size: 82px; + line-height: 96px; + font-weight: bold; + color: var(--main_white); + text-transform: uppercase; +} + +.editorial-head__img { + position: absolute; + z-index: -1; + top: -14px; + right: -20px; + width: 221px; +} + +.editorial-head__star { + position: absolute; + top: 8.26px; + right: -13.5px; + transform: translateX(100%); + width: 87.5px; +} + +.editorial-card__wrap { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 31px 25px; + position: relative; + z-index: 1; +} + +.editorial-card { + border: 2px solid var(--creme-white); + border-radius: 30px; + display: flex; + align-items: stretch; + overflow: hidden; + background: var(--linear); + backdrop-filter: blur(28px); +} + +.editorial-card .main-img { + min-height: 282px; + width: 207px; + border-radius: 29px; + overflow: hidden; + flex-shrink: 0; +} + +.editorial-card .main-img img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.editorial-card__content { + padding: 42px 19px 19px 35px; +} + +.editorial-card__content-alerts { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 7px; + margin-bottom: 17px; +} + +.editorial-card__content-alerts a { + background: var(--main_black); + border-radius: 16px; + padding: 6px 8px; + font-size: 16px; + font-weight: 500; + line-height: 20px; + color: var(--background); +} + +.editorial-card__content-title { + font-size: 28px; + font-weight: bold; + line-height: 32px; + color: var(--grey-black); + text-transform: uppercase; + margin-bottom: 17px; +} + +.editorial-card__content-data { + display: flex; + flex-wrap: wrap; + gap: 5px 16px; + color: var(--interface_hover); + font-size: 16px; + font-weight: 500; + line-height: 20px; +} + +.editorial-card__content-data ul { + display: flex; + align-items: center; + gap: 16px; +} + +.editorial-card__content-data li { + display: flex; + align-items: center; + gap: 5px; +} + +.editorial-card__content-data .logo img { + width: 24px; + height: 24px; + border-radius: 50%; + object-fit: cover; +} +/* Editorial end */ + +/* Footer */ +.footer { + background: var(--main_black); + padding: 40px 0 38px; + color: var(--main_white); +} + +.footer-top { + display: flex; + align-items: stretch; + justify-content: space-between; + gap: 48px; +} + +.footer-top .logo { + display: flex; + align-items: center; + gap: 10px; + font-size: 20px; + font-weight: 500; + text-transform: uppercase; + background: var(--accent-1); + color: transparent; + -webkit-background-clip: text; + background-clip: text; + margin-bottom: 24px; +} + +.footer-content__address { + font-size: 24px; + font-weight: 500; + line-height: 32px; + margin-bottom: 32px; +} + +.footer-content { + width: 100%; +} + +.footer-content ul { + display: flex; + flex-direction: column; + gap: 24px; +} + +.footer-content ul li { + display: flex; + flex-direction: column; + gap: 4px; +} + +.footer-content ul p { + font-size: 16px; + font-weight: bold; + line-height: 20px; +} + +.footer-content ul a { + font-size: 24px; + font-weight: 500; + line-height: 32px; +} + +.footer-content__wrap { + display: flex; + align-items: flex-end; + justify-content: space-between; + width: 100%; +} + +.footer-top__link { + display: flex; + flex-direction: column; + gap: 24px; +} + +.footer-top__link .link-black { + padding: 7px 15px; + color: var(--main_white); + font-size: 24px; + line-height: 32px; + font-weight: 500; + white-space: nowrap; + border: 1px solid var(--main_white); + border-radius: 24px; +} + +.footer-top__link .link-white { + width: 100%; + text-align: center; + background: var(--main_white); + color: var(--main_black); + font-size: 20px; + font-weight: 600; + line-height: 24px; + padding: 12px; + border-radius: 20px; +} + +.footer-contact { + width: 364px; + flex-shrink: 0; + background: var(--accent-1); + border-radius: 24px; + padding: 24px; + display: flex; + flex-direction: column; + gap: 16px; +} + +.footer-contact__title { + color: var(--main_black); + font-size: 24px; + font-weight: 500; + line-height: 32px; +} + +.footer-contact__submit { + width: 100%; + text-align: center; + height: 48px; + border-radius: 16px; + background: var(--main_black); + font-size: 20px; + font-weight: 600; + line-height: 24px; + color: var(--main_white); +} + +.footer-bottom { + display: flex; + align-items: center; + justify-content: space-between; + padding-top: 17px; + margin-top: 19px; + border-top: 1px solid var(--main_white); +} + +.footer-network { + display: flex; + align-items: center; + gap: 32px; +} + +.footer-bottom a { + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--main_white); + opacity: 0.6; + text-decoration: underline; +} +/* Footer end */ + +/* Breadcrumb */ +.breadcrumb { + padding: 108px 0 24px; +} + +.breadcrumb .container { + color: var(--main_white); + font-size: 14px; + font-weight: 500; + line-height: 16px; +} + +.breadcrumb a { + display: inline; +} +/* Breadcrumb end */ + +/* Article home */ +.article-home { + padding-bottom: 36px; +} + +.article-home h1 { + font-size: 64px; + font-weight: bold; + line-height: 120%; + color: var(--main_white); + margin-bottom: 17px; + text-transform: uppercase; +} + +.article-home__data { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px 24px; + margin-bottom: 17px; +} + +.article-home__data-alerts { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px; +} + +.article-home__data-alerts a { + font-size: 16px; + line-height: 20px; + font-weight: 500; + color: var(--background); + padding: 6px 8px; + border-radius: 20px; + background: var(--main_black); +} + +.article-home__data p { + font-size: 14px; + line-height: 16px; + font-weight: 500; + color: var(--main_white); + display: flex; + align-items: center; + gap: 4px; +} + +.article-home__data .user { + display: flex; + align-items: center; + gap: 7px; + font-size: 14px; + line-height: 16px; + font-weight: 500; + color: var(--main_white); +} + +.article-home__data .user img { + width: 32px; + height: 32px; + border-radius: 50px; + object-fit: cover; +} + +.article-home__card { + width: 100%; + height: 500px; +} + +.article-home__card img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 64px; +} + +@media (min-width: 992px) { + .article-home.position-1 .container { + position: relative; + z-index: 1; + } + + .article-home.position-1 .article-home__card { + width: calc(50% - 12px); + position: absolute; + top: 0; + right: 0; + height: 100%; + z-index: -1; + } + + .article-home.position-1 h1 { + width: calc(50% - 12px); + } + + .article-home.position-1 .article-home__data { + max-width: 406px; + } + + .article-home.position-2 .container { + position: relative; + z-index: 1; + height: 695px; + padding: 45px 42px; + } + + .article-home.position-2 .article-home__card { + position: absolute; + top: 0; + left: 0; + z-index: -1; + width: 100%; + height: 100%; + overflow: hidden; + } + + .article-home.position-2 .article-home__card::before { + content: ""; + width: 100%; + height: 100%; + background: linear-gradient(282.92deg, rgba(255, 255, 255, 0) 50.1%, #FFFFFF 77.26%); + position: absolute; + top: 0; + left: 0; + border-radius: 50px; + } + + .article-home.position-2 h1 { + color: var(--main_black); + max-width: 838px; + } + + .article-home.position-2 .article-home__data { + width: 304px; + } + + .article-home.position-2 .article-home__data p { + color: var(--main_black); + } + + .article-home.position-2 .article-home__data p img { + filter: brightness(0) invert(0) + } + + .article-home.position-2 .article-home__data .user { + color: var(--main_black); + } +} + +.article-content { + background: var(--main_white); + border-radius: 64px; + max-width: 1232px; + margin: 0 auto; + padding: 64px 0 116px; +} + +.article-container { + max-width: 1022px; + margin: 0 auto; + + @media (max-width: 1054px) { + max-width: calc(100% - 32px); + } +} +/* Article home end */ + +/* Discount */ +.discount { + background: radial-gradient(122% 156.56% at 100% 0%, #7E90FF 0%, #8187FF 45%, #F8A6FF 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */; + border-radius: 32px; + padding: 32px; + position: relative; + z-index: 1; + margin-bottom: 48px; +} + +.discount-title { + font-size: 36px; + font-weight: bold; + line-height: 40px; + text-transform: uppercase; + max-width: 517px; + color: var(--main_black); + margin-bottom: 15px; +} + +.discount-bg { + position: absolute; + top: 4px; + right: 8px; + width: 369px; + z-index: -1; +} + +.discount-bg.mb { + display: none; +} + +.discount-title span { + color: var(--main_white); +} + +.discount-form { + display: flex; + align-items: center; + gap: 8px; + margin-bottom: 15px; +} + +.discount-form input { + width: 280px; + height: 50px; + border: 2px solid var(--main_black); + border-radius: 48px; + background: #F5F5F5; + padding: 0 18px; + font-size: 24px; + font-weight: 500; + color: var(--main_black); +} + +.discount-form button { + border: 2px solid var(--main_black); + background: transparent; + height: 50px; + padding: 0 30px; + font-size: 24px; + font-weight: 500; + color: var(--main_black); + border-radius: 50px; +} + +.discount-form button:hover { + background: var(--interface_title); + color: var(--main_white); +} + +.discount-description__1 { + font-size: 14px; + font-weight: 500; + color: var(--main_black); + max-width: 621px; + margin-bottom: 15px; +} + +.discount-description__2 { + font-size: 20px; + font-weight: 500; + color: var(--main_black); +} +/* Discount end */ + +/* Diet */ +.diet { + background: var(--violet_90); + border-radius: 32px; + padding: 36px 49px; + display: flex; + align-items: center; + justify-content: space-between; + gap: 32px; + margin-bottom: 48px; +} + +.diet p { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: var(--grey-black); +} + +.diet a { + padding: 12px 24px; + text-align: center; + border: 1px solid var(--main_black); + background: var(--main_white); + border-radius: 20px; + font-size: 20px; + line-height: 24px; + font-weight: 600; +} + +.diet a:hover { + background: var(--interface_title); + color: var(--main_white) +} +/* Diet end */ + +/* Texts */ +.texts { + display: flex; + flex-direction: column; + gap: 48px; +} + +.texts h2 { + font-size: 36px; + line-height: 40px; + font-weight: bold; + color: var(--grey-black); + text-transform: uppercase; +} + +.texts h3 { + font-size: 24px; + line-height: 28px; + font-weight: bold; + color: var(--grey-black); + text-transform: uppercase; +} + +.texts-description { + display: flex; + flex-direction: column; + gap: 48px; +} + +.texts-description p { + color: var(--grey-black); + font-size: 24px; + line-height: 32px; + font-weight: 500; +} + +.texts-description a { + display: inline; + text-decoration: underline; +} + +.texts ol { + display: flex; + flex-direction: column; + gap: 12px; + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: #191919; +} + +.texts ol li { + display: flex; + align-items: center; + gap: 12px; +} + +.texts ol h4 { + background: var(--accent-1); + border-radius: 5.2px; + width: 32px; + height: 32px; + display: flex; + align-items: center; + justify-content: center; + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: white; +} + +.texts ul { + display: flex; + flex-direction: column; + gap: 12px; +} + +.texts ul li { + padding-left: 22px; + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: #191919; + position: relative; +} + +.texts ul li::before { + content: ""; + width: 10px; + height: 10px; + position: absolute; + top: 50%; + left: 0; + transform: translateY(-50%); + background: var(--accent-1); + border-radius: 3px; +} + +.texts-swp { + position: relative; +} + +.texts-swp__prev { + position: absolute; + z-index: 2; + top: 50%; + transform: translateY(-50%); + left: 10px; + background: var(--main_white); + width: 56px; + height: 56px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 20px; +} + +.texts-swp__next { + position: absolute; + z-index: 2; + top: 50%; + transform: translateY(-50%); + right: 10px; + background: var(--main_white); + width: 56px; + height: 56px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 20px; +} + +.texts-swp .swiper-slide img { + height: 517px; + width: 100%; + object-fit: cover; + border-radius: 50px; +} + +.texts-swp .swiper-slide:not(.swiper-slide-active) { + height: 0; + overflow: hidden; +} + +.texts-swp__pagination { + position: absolute; + top: auto !important; + bottom: 20px !important; + right: auto; + display: flex; + align-items: center; + justify-content: center; + z-index: 2; + gap: 11px; +} + +.texts-swp__pagination span { + opacity: 0.5; + background: var(--main_white); + width: 40px; + height: 6px; + border-radius: 6px; + margin: 0 !important; + padding: 0 !important; +} + +.texts-swp__pagination span.swiper-pagination-bullet-active { + opacity: 1; +} +/* Texts end */ + +/* Alerts */ +.alerts { + display: flex; + flex-direction: column; + gap: 48px; + margin: 48px 0; +} + +.alerts-grey { + padding: 32px 98px; + border-radius: 32px; + background: var(--bg-light-grey); + position: relative; +} + +.alerts-grey p { + color: #191919; + font-size: 24px; + font-weight: 500; + line-height: 32px; +} + +.alerts-grey .icon-1 { + position: absolute; + top: 32px; + left: 32px; +} + +.alerts-grey .icon-2 { + position: absolute; + bottom: 32px; + right: 32px; +} + +.alerts-violet { + background: #FAEAE9; + border-radius: 32px; + padding: 32px; + display: flex; + align-items: center; + gap: 32px; +} + +.alerts-violet img { + flex-shrink: 0; +} + +.alerts-violet p { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: #191919; +} + +.alerts-yellow { + display: flex; + align-items: center; + background: #FEF8E6; + border-radius: 32px; + padding: 32px; + gap: 32px; +} + +.alerts-yellow img { + flex-shrink: 0; +} + +.alerts-yellow p { + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: #191919; +} + +.alerts-green { + background: #E9F8EB; + border-radius: 32px; + padding: 32px; + display: flex; + align-items: center; + gap: 32px; +} + +.alerts-green img { + flex-shrink: 0; +} + +.alerts-green p { + color: #191919; + font-size: 24px; + font-weight: 500; + line-height: 32px; +} +/* Alerts end */ + +/* Article table */ +.article-table__wrap { + background: var(--accent-3); + border-radius: 24px; + overflow: hidden; + padding: 2px; + margin-bottom: 48px; +} + +.article-table { + background: var(--main_white); + border-radius: 22px; + overflow: hidden; + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 18px; +} + +.article-table__item { + display: flex; + width: calc(100% / 3 - 36px / 3); + align-items: stretch; + border: 1px solid #E1E1E1; + text-align: center; + font-size: 20px; + line-height: 24px; + font-weight: 500; +} + +.article-table__item ul { + width: 50%; + flex-shrink: 0; +} + +.article-table__item li { + padding: 8px; +} + +.article-table__item li:not(:last-child) { + border-bottom: 1px solid #E1E1E1; +} + +.article-table__item li:first-child { + background: #E1E1E1; +} + +.article-table__item ul:first-child li:first-child { + border-right: 1px solid var(--main_white); +} + +.article-table__item ul:not(:last-child) li { + border-right: 1px solid #E1E1E1; +} +/* Article table end */ + +/* Article block */ +.article-block__head { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + margin-bottom: 48px; + gap: 30px; +} + +.article-block__head-left { + display: flex; + flex-direction: column; + gap: 23px; +} + +.article-block__head-left h3 { + font-size: 24px; + font-weight: bold; + left: 28px; + text-transform: uppercase; + color: var(--grey-black); +} + +.article-block__head-left p { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: var(--grey-black); +} + +.article-block__head-right img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 50px; +} + +.article-block__item-wrap { + display: flex; + flex-direction: column; + gap: 72px; +} + +.article-block__item { + display: flex; + align-items: stretch; + justify-content: space-between; + gap: 32px; +} + +.article-block__item-content { + display: flex; + flex-direction: column; + width: 100%; + gap: 23px; +} + +.article-block__item-content h3 { + font-size: 26px; + font-weight: bold; + color: var(--grey-black); +} + +.article-block__item-content p { + font-size: 24px; + line-height: 32px; + font-weight: 500; +} + +.article-block__item-content ul { + width: 100%; + background: var(--bg-light-grey); + border-radius: 24px; + display: flex; + align-items: center; + padding: 20px; + gap: 24px; +} + +.article-block__item-content ul li { + display: flex; + align-items: center; + gap: 20px; + font-size: 20px; + line-height: 24px; + color: var(--grey-black); +} + +.article-block__item-content ul li img { + flex-shrink: 0; +} + +.article-block__item-img { + width: 315px; + flex-shrink: 0; +} + +.article-block__item-img img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 50px; +} +/* Article block end */ + +/* Block accent */ +.block-accent { + margin: 48px 0 100px; + display: flex; + flex-direction: column; + gap: 48px; +} + +.block-accent__card { + padding: 36px 63px 36px 49px; + border-radius: 32px; + display: flex; + align-items: center; + justify-content: space-between; + gap: 32px; + width: 100%; +} + +.block-accent .card-violet { + flex-direction: row-reverse; + background: var(--violet_90); +} + +.block-accent__card-content { + width: 100%; + display: flex; + flex-direction: column; + gap: 21px; +} + +.block-accent__card h3 { + font-size: 26px; + font-weight: bold; + color: var(--grey-black); + text-transform: uppercase; +} + +.block-accent__card p { + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: var(--grey-black); +} + +.block-accent__card img { + flex-shrink: 0; +} + +.block-accent .card-orange { + background: var(--orange_80); +} + +.block-accent .card-blue { + background: #E0FDFF; +} +/* Block accent end */ + +/* Indent */ +.indent { + background: #E2F3FF; + border-radius: 32px; + padding: 36px 49px; + display: flex; + flex-direction: column; + gap: 32px; + margin-bottom: 48px; +} + +.indent ul { + display: flex; + flex-direction: column; + gap: 32px; +} + +.indent-title { + max-width: 661px; + font-size: 36px; + line-height: 40px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); +} + +.indent p { + font-size: 24px; + line-height: 32px; + font-weight: 500; + color: var(--grey-black); +} + +.indent li { + display: flex; + align-items: flex-start; + gap: 16px; +} + +.indent li h3 { + font-size: 26px; + font-weight: bold; + text-transform: uppercase; + color: var(--grey-black); + margin-bottom: 16px; +} + +.indent li img { + flex-shrink: 0; +} +/* Indent end */ + +/* Product card */ +.product-card { + display: flex; + align-items: center; + gap: 50px; + justify-content: center; + background: var(--blue_90); + padding: 32px; + border-radius: 50px; +} + +.product-card img { + max-width: 740px; + max-height: 512px; +} +/* Product card end */ + +/* block_lists */ +.block-lists { + margin: 48px 0; + display: flex; + flex-direction: column; + gap: 48px; +} + +.block-list_block { + display: flex; + align-items: start; + gap: 25px; +} + +.block-list_block img { + width: 145px; + flex-shrink: 0; +} + +.block-list_block h3 { + font-size: 24px; + font-weight: 700; + line-height: 28px; + color: var(--main_black); + margin-bottom: 24px; +} + +.block-list_block p { + font-size: 24px; + font-weight: 500; + line-height: 32px; + color: var(--main_black); +} +/* block_lists */ + +/* comment */ +.comment { + border-top: 1px solid var(--placeholder); + padding-top: 48px; + margin-top: 100px; +} + +.comment .comment-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 12px; +} + +.comment .comment-btn button { + padding: 12px 24px; + border-radius: 20px; + display: flex; + align-items: center; + gap: 8px; + background: var(--btn-bg); + font-size: 20px; + font-weight: 600; + line-height: 24px; + font-family: var(--font-craftwork); +} + +.comment .comment-btn span { + font-family: var(--font-craftwork); + font-size: 20px; + font-weight: 500; + line-height: 24px; +} + +.comment .comment-title { + font-family: var(--font-craftwork); + font-size: 24px; + font-weight: 700; + line-height: 28px; + color: var(--grey-black); + margin: 48px 0 0 0; +} + +.comment .comment-in { + max-width: 816px; + margin: 0 auto; +} + +.comment .comment-block { + margin-top: 40px; + padding: 28px 48px; + border-radius: 24px; + background: var(--grey-f5); +} + +.comment .comment-block p { + font-size: 20px; + font-weight: 500; + line-height: 24px; + color: var(--grey-black); +} + +.comment .comment-block p a { + color: var(--green-dark); + text-decoration: underline; +} + +.comment .comment-user { + display: flex; + align-items: center; + gap: 12px; +} + +.comment .comment-user img { + width: 48px; + height: 48px; + border-radius: 50%; + flex-shrink: 0; +} + +.comment .comment-user h6 { + font-size: 20px; + font-weight: 700; + line-height: 24px; + color: var(---main_black); + margin-bottom: 5px; +} + +.comment .comment-user span { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); +} + +.comment .comment-block p { + margin: 15px 0; + font-size: 20px; + font-weight: 500; + line-height: 24px; + color: var(---main_black); +} + +.comment .comment-btns { + display: flex; + align-items: center; + gap: 33px; +} + +.comment .comment-btns button { + font-size: 14px; + font-weight: 500; + line-height: 16px; + color: var(--interface_hover); + display: flex; + align-items: center; + gap: 5px; +} + +.comment .answer-btn { + margin-bottom: 10px; + font-family: var(--font-craftwork); + font-size: 16px; + font-weight: 700; + line-height: 20px; + color: var(--green-dark); + display: flex; + align-items: center; + gap: 8px; + padding: 6px 24px; + text-transform: lowercase; +} + +.comment .answer-btn svg { + transition: .2s ease; +} + +.comment .answer-btn svg.active { + transform: rotate(180deg); +} + +.comment .answer-block { + display: none; + margin: 0 0 0 54px; +} + +.comment .answer-block.active { + display: block; +} + +.comment .comment-block_text { + margin: 0 !important; +} + +.video_block { + display: flex; + align-items: center; + justify-content: center; +} + +.other-home { + padding-top: 36px !important; +} +/* comment */ + +/* Стили для планшетов */ +@media only screen and (max-width: 992px) { + .header-navs { + display: none; + } + + .header-container { + height: 56px; + padding: 0; + } + + .header-bars { + display: flex; + align-items: center; + justify-content: center; + } + + .header-logo { + font-size: 16px; + line-height: 20px; + gap: 8px; + } + + .header-logo img { + width: 31px; + flex-shrink: 0; + } + + .header-lang { + display: none; + } + + .home { + padding: 92px 0 36px; + } + + .home-title { + font-size: 32px; + line-height: 38px; + margin-bottom: 36px; + } + + .home-description { + font-size: 20px; + line-height: 24px; + margin-bottom: 36px; + } + + .home-swp__btn { + bottom: auto; + top: 93px; + left: -10px; + width: calc(100% + 20px); + justify-content: space-between; + transform: translateX(0); + } + + .home-swp__btn button { + width: 48px; + height: 48px; + border-radius: 20px; + } + + .home-card { + flex-direction: column; + border-radius: 24px; + gap: 17px; + } + + .home-card__img { + height: 234px; + width: 100%; + border-radius: 24px; + } + + .home-card__content { + padding: 0 16px 89px; + } + + .home-card__content-title { + font-size: 20px; + line-height: 24px; + margin-bottom: 15px; + } + + .home-card__content-description { + font-size: 16px; + line-height: 20px; + margin-bottom: 15px; + display: -webkit-box; + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; + } + + .home-card__content-body { + gap: 7px; + } + + .home-card__content-body__alerts { + gap: 7px; + } + + .home-card__content-body__alerts li { + font-size: 14px; + line-height: 16px; + padding: 8px; + } + + .home-card__content-body__day { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__time { + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data { + gap: 7px; + } + + .home-card__content-body__data>div { + gap: 4px; + font-size: 14px; + line-height: 16px; + } + + .home-card__content-body__data .main-img { + width: 32px; + height: 32px; + } + + .home-card__content-body__link { + right: 50%; + bottom: 27px; + transform: translateX(50%); + } + + .anons { + border-radius: 24px; + } + + .anons-article__title { + font-size: 26px; + line-height: 32px; + } + + .anons-theme { + margin-bottom: 60px; + } + + .anons-theme__title { + margin-bottom: 20px; + font-size: 20px; + line-height: 24px; + } + + .anons-theme ul { + gap: 12px; + } + + .anons-theme ul a { + font-size: 16px; + line-height: 20px; + padding: 6px 24px; + } + + .anons-best__card-wrap { + grid-template-columns: repeat(1, minmax(0, 1fr)); + gap: 24px; + } + + .anons-article__card-wrap { + grid-template-columns: repeat(1, minmax(0, 1fr)); + gap: 20px; + } + + .author { + padding: 188px 0 36px; + } + + .author-content { + padding: 109px 42px 35px; + flex-direction: column; + align-items: flex-start; + } + + .author-content__start-1, + .author-content__start-2 { + display: none; + } + + .author-content__img { + display: none; + left: 50%; + transform: translateX(-50%); + top: -180px; + width: 235px; + } + + .author-content__img.mb { + display: block; + } + + .author-content__title { + width: 100%; + font-size: 26px; + line-height: 32px; + margin-bottom: 16px; + } + + .author-content__title br { + display: none; + } + + .author-content__link { + width: 100%; + text-align: center; + padding: 11px; + } + + .editorial { + padding-bottom: 36px; + } + + .editorial-head { + margin-bottom: 36px; + max-width: 313px; + } + + .editorial-head__title { + font-size: 32px; + line-height: 38px; + } + + .editorial-head__img { + width: 100px; + top: -14px; + right: -22.5px; + } + + .editorial-head__star { + display: none; + } + + .editorial-card__wrap { + gap: 31px; + } + + .breadcrumb { + padding: 92px 0 15px; + } + + .article-home { + padding-bottom: 36px; + } + + .article-home .container { + display: flex; + flex-direction: column; + } + + .article-home h1 { + order: 1; + font-size: 32px; + line-height: 38px; + margin-bottom: 15px; + } + + .article-home__card { + order: 2; + height: 199px; + } + + .article-home__card img { + border-radius: 32px; + } + + .article-home__data { + gap: 8px 16px; + order: 3; + margin: 15px 0 0; + } + + .article-home__data-alerts { + gap: 16px; + } + + .article-home__data-alerts a { + padding: 6px 8px; + } + + .article-content { + padding: 48px 0; + border-radius: 64px; + } + + .discount { + padding: 32px 24px; + border-radius: 32px; + margin-bottom: 48px; + } + + .discount-title { + font-size: 26px; + line-height: 32px; + margin-bottom: 21px; + } + + .discount-bg { + display: none; + } + + .discount-bg.mb { + display: inline-block; + position: static; + margin-bottom: 21px; + } + + .discount-form { + flex-direction: column; + gap: 21px; + margin-bottom: 21px; + } + + .discount-form img { + display: none; + } + + .discount-form input { + width: 100%; + text-align: center; + } + + .discount-form button { + width: 100%; + text-align: center; + } + + .discount-descriptions { + display: flex; + flex-direction: column-reverse; + } + + .discount-description__2 { + font-size: 18px; + line-height: 24px; + font-weight: 500; + grid-area: 21px; + margin-bottom: 21px; + } + + .discount-description__1 { + margin-bottom: 0; + font-size: 12px; + } + + .diet { + padding: 36px 24px; + border-radius: 32px; + flex-direction: column; + margin-bottom: 48px; + } + + .diet p { + width: 100%; + font-size: 18px; + line-height: 24px; + } + + .diet a { + width: 100%; + } + + .texts h2 { + font-size: 28px; + line-height: 32px; + } + + .texts h3 { + font-size: 20px; + line-height: 24px; + } + + .texts-description p { + font-size: 18px; + line-height: 24px; + } + + .texts ol { + gap: 12px; + } + + .texts ol li { + font-size: 18px; + line-height: 24px; + } + + .texts ol li h4 { + font-size: 18px; + line-height: 24px; + } + + .texts ul { + gap: 12px; + } + + .texts ul li { + font-size: 18px; + line-height: 24px; + } + + .alerts-grey { + padding: 32px 48px; + } + + .alerts-grey .icon-1 { + width: 24px; + top: 32px; + left: 16px; + } + + .alerts-grey .icon-2 { + width: 24px; + right: 16px; + bottom: 32px; + } + + .alerts-grey p { + font-size: 18px; + line-height: 24px; + } + + .alerts-violet, + .alerts-yellow, + .alerts-green { + padding: 32px 24px; + flex-direction: column; + } + + .alerts-violet p, + .alerts-yellow p, + .alerts-green p { + font-size: 18px; + line-height: 24px; + } + + .article-table { + flex-direction: column; + gap: 0px; + } + + .article-table__item { + width: 100%; + } + + .article-table__item:not(:first-child) li:first-child { + display: none; + } + + .article-table__item:not(:first-child) { + border-top: 0; + } + + .article-table__item ul li { + font-size: 16px; + line-height: 20px; + font-weight: 500; + } + + .article-block__head { + grid-template-columns: repeat(1, minmax(0, 1fr)); + gap: 32px; + } + + .article-block__head-left { + order: 2; + } + + .article-block__head-left h3 { + font-size: 20px; + line-height: 24px; + } + + .article-block__head-left p { + font-size: 18px; + line-height: 24px; + } + + .article-block__head-right { + order: 1; + height: 319px; + } + + .article-block__item-wrap { + gap: 48px; + } + + .article-block__item { + flex-direction: column; + gap: 32px; + } + + .article-block__item-img { + order: 1; + width: 100%; + height: 450px; + border-radius: 50px; + } + + .article-block__item-content { + order: 2; + } + + .article-block__item-content h3 { + font-size: 20px; + line-height: 24px; + } + + .article-block__item-content p { + font-size: 18px; + line-height: 24px; + } + + .article-block__item-content ul { + flex-direction: column; + padding: 20px 14px 20px 20px; + gap: 28px; + border-radius: 24px; + } + + .article-block__item-content ul li { + gap: 19px; + } + + .article-block__item-content ul li p { + font-size: 16px; + line-height: 20px; + } + + .block-accent__card { + padding: 36px 24px; + gap: 32px; + flex-direction: column !important; + } + + .block-accent__card-content { + gap: 27px; + } + + .block-accent__card-content h3 { + font-size: 20px; + line-height: 24px; + text-align: center; + } + + .block-accent__card-content p { + font-size: 18px; + line-height: 24px; + } + + .indent { + padding: 36px 24px; + gap: 24px; + } + + .indent-title { + font-size: 26px; + line-height: 32px; + } + + .indent p { + font-size: 18px; + line-height: 24px; + } + + .indent ul { + gap: 24px; + } + + .indent ul li { + gap: 16px; + } + + .indent ul li img { + width: 37px; + } + + .indent ul li h3 { + font-size: 20px; + line-height: 24px; + gap: 16px; + } + + .product-card { + padding: 11px; + gap: 40px; + } + + .product-card img { + max-width: 242px; + max-height: 167px; + } + /* Alohida */ + + .block-list_block img { + flex-shrink: 0; + width: 66px; + height: 45px; + } + + .block-list_block h3 { + font-size: 20px; + line-height: 24px; + } + + .block-list_block p { + font-size: 18px; + line-height: 24px; + } + + .comment .comment-block { + padding: 20px 24px; + margin-top: 28px; + } + + .comment .comment-title { + padding-bottom: 20px; + } + + .comment .answer-block { + margin: 10px 0 0 42px; + } + + .comment .comment-user h6 { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-block p { + font-size: 16px; + line-height: 24px; + } + + .comment .comment-btns { + gap: 14px; + } + + .comment .comment-btns button { + font-size: 12px; + line-height: 16px; + } + + .comment .comment-user span { + font-size: 12px; + line-height: 16px; + } + + .video_block iframe { + width: 100%; + height: 587px; + } +} +/* Стили для ультрашироких экранов */ +@media only screen and (min-width: 1400px) { + +} + +/* Стили для мобильных устройств */ +@media only screen and (max-width: 576px) { + .anons-best__title { + font-size: 26px; + line-height: 32px; + margin-bottom: 12px; + } + + .anons-best__card { + padding-top: 205px; + } + + .anons-best__card .main-img { + height: 300px; + } + + .anons-best__card-body { + padding: 20px 17px; + } + + .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + margin-bottom: 16px; + } + + .anons-best__card.light .main-img { + height: 197px; + } + + .anons-best__card.light .anons-best__card-body__title { + font-size: 20px; + line-height: 24px; + } + + .editorial-card { + flex-direction: column; + border-radius: 30px; + position: relative; + } + + .editorial-card .main-img { + width: 100%; + height: 203px; + } + + .editorial-card__content { + padding: 17px 13px 24px; + } + + .editorial-card__content-alerts { + position: absolute; + top: 13px; + left: 8px; + width: calc(100% - 16px); + } + + .editorial-card__content-title { + font-size: 20px; + line-height: 24px; + margin-bottom: 17px; + } + + .editorial-card__content-data { + gap: 5px 16px; + } + + .footer { + padding: 24px 0 58px; + } + + .footer-top { + align-items: flex-start; + text-align: left; + gap: 24px; + } + + .footer-content__wrap { + align-items: flex-start; + gap: 24px; + } + + .footer-content { + align-items: flex-start; + } + + .footer-content .logo { + font-size: 20px; + margin-bottom: 24px; + } + + .footer-content__address { + font-size: 18px; + line-height: 24px; + margin-bottom: 32px; + } + + .footer-content ul { + gap: 24px; + } + + .footer-content ul p { + font-size: 16px; + line-height: 20px; + } + + .footer-content ul a { + font-size: 24px; + line-height: 32px; + } + + .footer-top__link .link-white { + display: none; + } + + .footer-contact { + width: 100%; + padding: 16px; + border-radius: 24px; + } + + .footer-contact__title { + color: var(--main_white); + } + + .footer-bottom { + margin-top: 0; + padding-top: 24px; + border: 0; + align-items: flex-start; + gap: 17px; + } +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/layout/module-controller.php b/wp-content/themes/cosmopet/modules/layout/module-controller.php index de274df..18c31dd 100644 --- a/wp-content/themes/cosmopet/modules/layout/module-controller.php +++ b/wp-content/themes/cosmopet/modules/layout/module-controller.php @@ -1,4 +1,4 @@ {% include 'footer/module.template.twig' %} -
    {{ function('wp_footer') }} diff --git a/wp-content/themes/cosmopet/single-post.php b/wp-content/themes/cosmopet/single-post.php new file mode 100644 index 0000000..06a0985 --- /dev/null +++ b/wp-content/themes/cosmopet/single-post.php @@ -0,0 +1,6 @@ + \ No newline at end of file