diff --git a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css index 958d07b..b3a5d3c 100644 --- a/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/footer/assets/css/gp-style-desktop.css @@ -151,7 +151,7 @@ text-decoration: underline; } /* Footer end */ -.modal__aside { +/* .modal__aside { position: fixed; top: 0; right: 0; @@ -159,7 +159,7 @@ height: 100%; overflow: hidden; transition: width .4s ease-out; -} +} */ .modal__item { height: 100%; diff --git a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css index 01656a7..ff0d2b4 100644 --- a/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css +++ b/wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css @@ -2238,6 +2238,45 @@ textarea{ margin-bottom: 6px; } +.discount_block { + background: radial-gradient(250% 285% at 120% -27.98%, #0F5881 0%, #1EA49C 36.98%, #76CE75 66.67%, #ECF39F 91.15%)!important; +} + +.section_wrap { + margin-top: -70px; + padding: 178px 0 90px; + background: radial-gradient(250% 285% at 120% -27.98%, #0F5881 0%, #1EA49C 36.98%, #76CE75 66.67%, #ECF39F 91.15%)!important; +} + +.footer-contact { + width: 100%; + padding: 24px 24px 43px; + display: flex; + flex-direction: column; + border-radius: 24px; + background: radial-gradient(346.57% 244.17% at 149.73% -58.39%, rgb(117, 196, 240) 0%, rgb(126, 231, 225) 51.21689438819885%, rgb(181, 228, 180) 80.70731163024902% +80.7073% +, rgb(237, 244, 164) 91.14583134651184%)!important; +} + +.footer-contact__submit { + width: 100%; + text-align: center; + height: 48px; + border-radius: 16px; + background: var(--main_black); + font-size: 20px; + font-weight: 400!important; + line-height: 24px; + color: var(--main_white); +} + +@media only screen and (max-width: 1600px) { + .wrapper { + max-width: 1280px!important; + } +} + @media only screen and (max-width: 1200px) { .footer { margin-top: 0; diff --git a/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css b/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css index e69de29..e820cb1 100644 --- a/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css +++ b/wp-content/themes/cosmopet/modules/popup/assets/css/gp-style-desktop.css @@ -0,0 +1,91 @@ +.modal__aside { + position: fixed; + top: 0; + right: 0; + height: 100%; + transform: translateX(100%); /* Изначально скрыто справа */ + transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; + background: white; /* Или твой стиль фона */ + z-index: 1000; +} + +.modal__aside.active { + transform: translateX(0); /* Показываем, сдвигая влево */ +} + +.modal__item { + opacity: 0; + filter: blur(10px); + transition: opacity 0.3s ease-in-out, filter 0.3s ease-in-out; +} + +.modal__item.active { + opacity: 1; + filter: blur(0); +} + +@media (max-width: 720px) { + .modal__aside { + width: 100% !important; /* Полная ширина на мобильных */ + } +} + +@media (min-width: 721px) { + .modal__aside { + width: 400px; /* Минимальная ширина или твоя фиксированная ширина */ + } +} + +@media(max-width:768px){ + .footer-top { + flex-direction: column; + } + .footer-bottom { + flex-direction: column; + } + .footer-content__wrap { + flex-direction: column; + } + .home__title.invisible { + font-size:28px; + } + .home .container { + padding: 0px 30px 180px!important; + } + .container { + max-width: 100%!important; + margin: 0!important; + } + .about_slider .carousel .carousel-item { + border-radius: 100% !important; + } + .about_slider .carousel .carousel-item img { + width: 99px!important; + height: 99px!important; + } + .reviews_block .reviews_items { + flex-wrap: unset; + gap: 20px!important; + } + .gift_line-img { + display: none!important; + } + .discount__sale .discount_text { + order: 1; + margin-top: 0; + font-size: 18px!important; + color: var(--interface-main_black, #121212); + font-family: "Craftwork Grotesk"; + font-style: normal; + font-weight: 500; + line-height: normal; + max-width: 100%; + } + .discount__sale .discount_form { + flex-direction: column; + gap: 21px!important; + } + .modal__basket { + width: 100%!important; + } +} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js b/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js index 4036f14..78b2cde 100644 --- a/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js +++ b/wp-content/themes/cosmopet/modules/popup/assets/js/modal.js @@ -15,11 +15,10 @@ modal.onclick = function (event) { } // function -function modalOpen(buttonElement, contentElement){ +function modalOpen(buttonElement, contentElement) { let modal = document.querySelector('.modal'), aside = document.querySelector('.modal__aside'), elements = document.querySelectorAll(buttonElement), - device = window.screen.width, body = document.querySelector('body'); elements.forEach(e => { @@ -28,26 +27,15 @@ function modalOpen(buttonElement, contentElement){ e.onclick = function () { body.classList.add('overflow-hidden'); modal.classList.add('active'); + aside.classList.add('active'); // Активируем aside для анимации thisContentElement.classList.add('active'); - - let width = thisContentElement.clientWidth; - if (width < 400){ - width = 400 - } - setTimeout(() => { - if (device <= 720) { - aside.style.width = `${device}px`; - thisContentElement.style.opacity = 1; - thisContentElement.style.filter = 'blur(0px)'; - }else{ - aside.style.width = `${width}px`; - thisContentElement.style.opacity = 1; - thisContentElement.style.filter = 'blur(0px)'; - } + setTimeout(() => { + thisContentElement.style.opacity = 1; + thisContentElement.style.filter = 'blur(0px)'; }, 10); - } - }) + }; + }); } function closeAllModals() { @@ -56,9 +44,6 @@ function closeAllModals() { asideItems = document.querySelectorAll('.modal__item'), body = document.querySelector('body'); - aside.style.width = '0px'; - body.classList.remove('overflow-hidden'); - asideItems.forEach(item => { if (item.classList.contains('active')) { item.style.opacity = 0; @@ -66,11 +51,14 @@ function closeAllModals() { } }); + aside.classList.remove('active'); // Скрываем aside с анимацией + setTimeout(() => { asideItems.forEach(item => { item.classList.remove('active'); }); modal.classList.remove('active'); + body.classList.remove('overflow-hidden'); }, 300); } @@ -82,35 +70,27 @@ function modalClose(buttonElement) { } // resize -window.addEventListener('resize', (e) => { - let width = window.screen.width; +window.addEventListener('resize', () => { + let width = window.innerWidth; // Используем innerWidth для актуальной ширины окна + let modalItem = document.querySelectorAll('.modal__item'); + let aside = document.querySelector('.modal__aside'); - // media + modalItem.forEach(modal => { + if (modal.classList.contains('active')) { + if (width <= 720) { + aside.style.width = '100%'; // Полная ширина на мобильных + } else { + let openAside = document.querySelector('.modal__item.active'), + newWidth = openAside.clientWidth; + aside.style.width = newWidth < 400 ? '400px' : `${newWidth}px`; + } + } + }); + + // Перерегистрируем события при ресайзе modalOpen('.button--filter', '.modal__filter'); modalOpen('.basket-open', '.modal__basket'); modalOpen('.open-to-know', '.modal__to-know'); modalOpen('.login-open', '.modal__login'); modalClose('.modal__close'); - - let modalItem = document.querySelectorAll('.modal__item'); - - // if (width <= 720) { - modalItem.forEach(modal => { - if (modal.classList.contains('active')) { - let aside = document.querySelector('.modal__aside'); - - if (width <= 720) { - aside.style.width = `${width}px` - }else{ - let openAside = document.querySelector('.modal__item.active'), - newWidth = openAside.clientWidth; - if (newWidth < 400){ - newWidth = 400 - } - aside.style.width = `${newWidth}px` - } - } - }) - // } -}); -// resize \ No newline at end of file +}); \ No newline at end of file diff --git a/wp-content/themes/cosmopet/static/css/front-page.css b/wp-content/themes/cosmopet/static/css/front-page.css index 1eddc7c..8ca2a0c 100644 --- a/wp-content/themes/cosmopet/static/css/front-page.css +++ b/wp-content/themes/cosmopet/static/css/front-page.css @@ -3513,7 +3513,46 @@ color: #f4f1f0; text-wrap: nowrap; } -@media(max-width:990px){ +@media (min-width: 769px) and (max-width: 1200px) { + .home .container { + padding: 88px 30px 180px !important; + } + .reviews_item .swiper-fade .swiper-slide { + width:100%!important; + } + .footer__wrapper { + width: 100%!important; + display: flex; + flex-direction: column; + } + .footer-bottom { + flex-direction: column; + } + .footer-content__wrap { + flex-direction: column; + } + .footer-content__wrap { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 20px; + width: 100%; + } + .reviews_item.reviews_item2 { + position: absolute; + max-width: 500px; + height: 360px; + right: 0%; + bottom: 25%; + } + .discount_top .discount_top-imgs { + position: absolute; + top: 20px; + right: -10px; + } +} + +@media(max-width:768px){ .footer-top { flex-direction: column; } @@ -3562,4 +3601,7 @@ color: #f4f1f0; flex-direction: column; gap: 21px!important; } + .modal__basket { + width: 100%!important; + } } \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/_pages/front-page.twig b/wp-content/themes/cosmopet/templates/_pages/front-page.twig index 7ed5994..577e40f 100644 --- a/wp-content/themes/cosmopet/templates/_pages/front-page.twig +++ b/wp-content/themes/cosmopet/templates/_pages/front-page.twig @@ -788,50 +788,58 @@ - -{% endif %} -{% if show_blog %} -
-
-
-
-

{{ function('pll_e', 'Наш блог') }}

-
-
-

{{ function('pll_e', 'Новости рынка кормов и экологии, полезные статьи о здоровье домашних животных') }}

- {{ function('pll_e', 'Все статьи') }} + {% if show_blog %} +
+
+
+
+

{{ function('pll_e', 'Наш блог') }}

+
+
+

{{ function('pll_e', 'Новости рынка кормов и экологии, полезные статьи о здоровье домашних животных') }}

+ {{ function('pll_e', 'Все статьи') }} +
+
-
-
-
-
-
- {% for post in blog_posts %} -
- -
- {{ post.title }} -
-
-
-

{{ post.title }}

-

{{ post.excerpt }} ...

-
{{ function('pll_e', 'читать статью') }}
-
- +
+
+
+ {% for post in blog_posts %} +
+ +
+ {{ post.title }} +
+
+
+

{{ post.title }}

+

+ {% set words = post.excerpt|split(' ') %} + {% if words|length > 14 %} + {{ words|slice(0, 14)|join(' ') }}... + {% else %} + {{ post.excerpt }}... + {% endif %} +

+
{{ function('pll_e', 'читать статью') }}
+
+ +
+
- + {% endfor %}
- {% endfor %} -
-
- - +
+ + +
+
-
+
+ {% endif %} - {% endif %} + diff --git a/wp-content/themes/cosmopet/templates/modal.twig b/wp-content/themes/cosmopet/templates/modal.twig index 3b3490d..b1dd851 100644 --- a/wp-content/themes/cosmopet/templates/modal.twig +++ b/wp-content/themes/cosmopet/templates/modal.twig @@ -5,7 +5,7 @@