

Составили гид по дозировкам для сторонников индивидуального подхода. Если вы с утра насыплете полную миску корма
ветеринарный бот с бесплатными вет консультациями
Перейти
diff --git a/wp-content/themes/cosmopet/static/css/new-front-page.css b/wp-content/themes/cosmopet/static/css/new-front-page.css index ccdb322..a3b141e 100644 --- a/wp-content/themes/cosmopet/static/css/new-front-page.css +++ b/wp-content/themes/cosmopet/static/css/new-front-page.css @@ -193,7 +193,8 @@ main { background: #f2f2f2; margin-top: -1%; padding-top: 5%; - padding-bottom: 5%; + padding-bottom: 120px; + border-radius: 0px 0px 60px 60px; } .main-why_title { font-weight: 700; @@ -512,6 +513,7 @@ main { font-size: 20px; color: #121212; position: relative; + text-align: start; } .main-specialists_text svg { position: absolute; @@ -614,18 +616,25 @@ main { height: 500px; min-width: 194px; } -.main-food_products .even { - background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #c8f0ff; +.main-food_products .lamb { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f4e1cf; +} +.main-food_products .fish { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #c1dde6; } -.main-food_products .odd { - background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #ffe9e9; +.main-food_products .beef { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #e8d1f9; +} +.main-food_products .turkey { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f3d7d2; } .main-food_products-card-img { position: relative; display: flex; justify-content: center; align-items: center; - padding: 30px 0; + padding: 32px 0px; + padding-bottom: 42px; } .shadow-svg { position: absolute; @@ -644,23 +653,41 @@ main { max-width: 80%; height: auto; } -.even .main-food_products-card-title { +.lamb .main-food_products-card-title { + padding: 8px 16px 8px 16px; + border-radius: 100px; + background: #fff; + font-weight: 400; + font-size: 12px; + text-transform: uppercase; + color: #f4e1cf; +} +.turkey .main-food_products-card-title { padding: 8px 16px 8px 16px; border-radius: 100px; background: #fff; font-weight: 400; font-size: 12px; text-transform: uppercase; - color: #48c1ed; + color: #f3d7d2; } -.odd .main-food_products-card-title { +.beef .main-food_products-card-title { + padding: 8px 16px 8px 16px; + border-radius: 100px; + background: #fff; + font-weight: 400; + font-size: 12px; + text-transform: uppercase; + color: #e8d1f9; +} +.fish .main-food_products-card-title { padding: 8px 8px 8px 16px; border-radius: 100px; background: #fff; font-weight: 400; font-size: 12px; text-transform: uppercase; - color: #cd0003; + color: #c1dde6; } .main-food_products-card-bottom { display: flex; @@ -668,7 +695,20 @@ main { align-items: flex-start; margin-top: 10px; } -.even .main-food_products-card-bottom-price { +.lamb .main-food_products-card-bottom-price { + border-radius: 100px; + padding: 10px; + background: #fff; + font-weight: 400; + font-size: 18px; + text-transform: uppercase; + text-align: center; + color: #000; + display: flex; + justify-content: center; + align-items: center; +} +.turkey .main-food_products-card-bottom-price { border-radius: 100px; padding: 10px; background: #fff; @@ -681,7 +721,7 @@ main { justify-content: center; align-items: center; } -.odd .main-food_products-card-bottom-price { +.beef .main-food_products-card-bottom-price { border-radius: 100px; padding: 10px; background: #fff; @@ -689,16 +729,42 @@ main { font-size: 18px; text-transform: uppercase; text-align: center; - color: #cd0003; + color: #000; + display: flex; + justify-content: center; + align-items: center; +} +.fish .main-food_products-card-bottom-price { + border-radius: 100px; + padding: 10px; + background: #fff; + font-weight: 400; + font-size: 18px; + text-transform: uppercase; + text-align: center; + color: #c1dde6; + display: flex; + justify-content: center; + align-items: center; +} +.lamb .main-food_products-cardbottom-btn { + border: 2px solid #fff; + border-radius: 100px; + padding: 12px 32px; + background: #f4e1cf; + font-weight: 900; + font-size: 12px; + text-align: center; + color: #fff; display: flex; justify-content: center; align-items: center; } -.even .main-food_products-cardbottom-btn { +.turkey .main-food_products-cardbottom-btn { border: 2px solid #fff; border-radius: 100px; padding: 12px 32px; - background: #48c1ed; + background: #f3d7d2; font-weight: 900; font-size: 12px; text-align: center; @@ -707,11 +773,24 @@ main { justify-content: center; align-items: center; } -.odd .main-food_products-cardbottom-btn { +.beef .main-food_products-cardbottom-btn { border: 2px solid #fff; border-radius: 100px; padding: 12px 32px; - background: #cd0003; + background: #e8d1f9; + font-weight: 900; + font-size: 12px; + text-align: center; + color: #fff; + display: flex; + justify-content: center; + align-items: center; +} +.fish .main-food_products-cardbottom-btn { + border: 2px solid #fff; + border-radius: 100px; + padding: 12px 32px; + background: #c1dde6; font-weight: 900; font-size: 12px; text-align: center; @@ -733,7 +812,7 @@ main { background: #fff; } .main-food_reviews-title { - font-weight: 400; + font-weight: 700; font-size: 32px; text-transform: uppercase; color: #121212; @@ -757,7 +836,7 @@ main { margin-bottom: 10px; } .main-food_reviews-slide-name { - font-weight: 400; + font-weight: 700; font-size: 16px; text-transform: uppercase; color: #121212; @@ -867,9 +946,8 @@ main { /* Main Reviews */ .main-reviews { - box-shadow: 6px 9px 20px 0 rgba(0, 0, 0, 0.15); background: #f4f1f0; - border-radius: 60px; + border-radius: 60px 60px 0px 0px; padding: 100px 20px; } .main-reviews_title { @@ -911,6 +989,11 @@ main { background: linear-gradient(270deg, #F6F4F3 0%, rgba(242, 242, 242, 0.00) 100%); z-index: 1; } +.marketplace { + position: relative; + margin-top: 0%; + margin-bottom: 0%; +} /* Main Treats */ @@ -920,23 +1003,50 @@ main { padding-bottom: 5%; border-radius: 0px 0px 60px 60px; } -.even .main-food_products-card-title { +.lamb .main-food_products-card-title { + padding: 8px 16px 8px 16px; + border-radius: 100px; + background: #fff; + font-weight: 400; + font-size: 12px; + text-transform: uppercase; + color: #f7dcc1; +} +.duck .main-food_products-card-title { padding: 8px 16px 8px 16px; border-radius: 100px; background: #fff; font-weight: 400; font-size: 12px; text-transform: uppercase; - color: #48c1ed; + color: #f6d9c7; } -.odd .main-food_products-card-title { +.beef .main-food_products-card-title { + padding: 8px 16px 8px 16px; + border-radius: 100px; + background: #fff; + font-weight: 400; + font-size: 12px; + text-transform: uppercase; + color: #e5cff6; +} +.rabbit .main-food_products-card-title { + padding: 8px 16px 8px 16px; + border-radius: 100px; + background: #fff; + font-weight: 400; + font-size: 12px; + text-transform: uppercase; + color: #f5c1d7; +} +.fish .main-food_products-card-title { padding: 8px 8px 8px 16px; border-radius: 100px; background: #fff; font-weight: 400; font-size: 12px; text-transform: uppercase; - color: #cd0003; + color: #c0e4f1; } .main-food_products-card-bottom { display: flex; @@ -944,7 +1054,7 @@ main { align-items: flex-start; margin-top: 10px; } -.even .main-treats_products-card-bottom-price { +.lamb .main-treats_products-card-bottom-price { border-radius: 100px; padding: 10px; background: #fff; @@ -952,12 +1062,12 @@ main { font-size: 18px; text-transform: uppercase; text-align: center; - color: #7e0092; + color: #f7dcc1; display: flex; justify-content: center; align-items: center; } -.odd .main-treats_products-card-bottom-price { +.duck .main-treats_products-card-bottom-price { border-radius: 100px; padding: 10px; background: #fff; @@ -965,16 +1075,94 @@ main { font-size: 18px; text-transform: uppercase; text-align: center; - color: #863300; + color: #f6d9c7; display: flex; justify-content: center; align-items: center; } -.even .main-treats_products-cardbottom-btn { +.beef .main-treats_products-card-bottom-price { + border-radius: 100px; + padding: 10px; + background: #fff; + font-weight: 400; + font-size: 18px; + text-transform: uppercase; + text-align: center; + color: #e5cff6; + display: flex; + justify-content: center; + align-items: center; +} +.rabbit .main-treats_products-card-bottom-price { + border-radius: 100px; + padding: 10px; + background: #fff; + font-weight: 400; + font-size: 18px; + text-transform: uppercase; + text-align: center; + color: #f5c1d7; + display: flex; + justify-content: center; + align-items: center; +} +.fish .main-treats_products-card-bottom-price { + border-radius: 100px; + padding: 10px; + background: #fff; + font-weight: 400; + font-size: 18px; + text-transform: uppercase; + text-align: center; + color: #c0e4f1; + display: flex; + justify-content: center; + align-items: center; +} +.lamb .main-treats_products-cardbottom-btn { + border: 2px solid #fff; + border-radius: 100px; + padding: 12px 32px; + background: #f7dcc1; + font-weight: 900; + font-size: 12px; + text-align: center; + color: #fff; + display: flex; + justify-content: center; + align-items: center; +} +.duck .main-treats_products-cardbottom-btn { + border: 2px solid #fff; + border-radius: 100px; + padding: 12px 32px; + background: #f6d9c7; + font-weight: 900; + font-size: 12px; + text-align: center; + color: #fff; + display: flex; + justify-content: center; + align-items: center; +} +.beef .main-treats_products-cardbottom-btn { + border: 2px solid #fff; + border-radius: 100px; + padding: 12px 32px; + background: #e5cff6; + font-weight: 900; + font-size: 12px; + text-align: center; + color: #fff; + display: flex; + justify-content: center; + align-items: center; +} +.rabbit .main-treats_products-cardbottom-btn { border: 2px solid #fff; border-radius: 100px; padding: 12px 32px; - background: #deb3ff; + background: #f5c1d7; font-weight: 900; font-size: 12px; text-align: center; @@ -983,11 +1171,11 @@ main { justify-content: center; align-items: center; } -.odd .main-treats_products-cardbottom-btn { +.fish .main-treats_products-cardbottom-btn { border: 2px solid #fff; border-radius: 100px; padding: 12px 32px; - background: #ffbc7b; + background: #c0e4f1; font-weight: 900; font-size: 12px; text-align: center; @@ -996,11 +1184,20 @@ main { justify-content: center; align-items: center; } -.main-treats_products .even { - background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #fff1c8; +.main-treats_products .lamb { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f7dcc1; +} +.main-treats_products .duck { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f6d9c7; +} +.main-treats_products .beef { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #e5cff6; +} +.main-treats_products .rabbit { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f5c1d7; } -.main-treats_products .odd { - background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #f2e0ff; +.main-treats_products .fish { + background: linear-gradient(rgba(134, 51, 0, 0.1), rgba(134, 51, 0, 0.1)), #c0e4f1; } .main-treats .main-food_products-card { border-radius: 30px; @@ -1216,6 +1413,9 @@ font-size: 12px; .smi-card-label{ height: 35px; } +.main-smi .swiper-slide { + max-width: 320px; +} @media (max-width: 640px) { .smi-card{ padding: 16px; @@ -1233,15 +1433,14 @@ font-size: 12px; } /* Main bot */ - .main-bot { - background: #f4f1f0; padding: 100px 20px; margin-top: -5%; } .main-bot .swiper-container { width: 100%; height: 100%; + position: relative; } .main-bot_wrapper { border-radius: 60px; @@ -1254,19 +1453,6 @@ font-size: 12px; align-items: flex-start; padding: 40px; } -.main-bot_wrapper-bottom { - display: flex; - justify-content: flex-start; - align-items: flex-start; - gap: 20px; -} -.main-bot_wrapper-bottom-divider { - width: 176px; - height: 2px; - background: #121212; - gap: 20px; - border-radius: 100%; -} .main-bot_wrapper-tag { border-radius: 100px; padding: 4px 10px 6px 10px; @@ -1278,8 +1464,8 @@ font-size: 12px; margin-bottom: 20px; } .main-bot_wrapper-title { - font-weight: 400; - font-size: 50px; + font-weight: 700; + font-size: 46px; text-transform: uppercase; color: #121212; max-width: 50%; @@ -1296,6 +1482,28 @@ font-size: 12px; margin-bottom: 70px; gap: 20px; } +.main-bot .swiper-pagination { + display: flex; + justify-content: flex-start; + align-items: flex-start; + gap: 20px; + position: absolute; + bottom: 70px; + left: 60px; + z-index: 10; +} +.swiper-pagination-bullet { + width: 176px; + height: 2px; + background: #121212; + border-radius: 100px; + opacity: 0.7; + cursor: pointer; + transition: opacity 0.3s ease; +} +.swiper-pagination-bullet-active { + opacity: 1; +} /* Main Cosmopet X */ @@ -1412,17 +1620,23 @@ font-size: 12px; .cosmopet-x .slider-arrow { background-image: url('data:image/svg+xml,')!important; } +.cosmopet-x .swiper-slide { + max-width: 320px; + backdrop-filter: blur(55px); + box-shadow: -3px 9px 31px 0 rgba(0, 0, 0, 0.25); + background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 35%), var(--white); + border-radius: 60px; +} /* Main Gallery */ .main-gallery { padding-top: 120px; padding-bottom: 100px; - } .main-gallery .mosaic-swiper { - padding: 40px 20px; - width: 100%; - overflow: visible; + padding: 40px 20px; + width: 100%; + overflow: visible; } .main-gallery_title { font-weight: 700; @@ -1446,7 +1660,7 @@ font-size: 12px; border: 2px solid #fff; height: 100%; width: 100%; - object-fit: none; + object-fit: cover; } .gallery-block { width: 280px; @@ -1463,6 +1677,22 @@ font-size: 12px; height: 100%; border-radius: 40px; } +.mosaic-swiper .swiper-wrapper { + display: flex; + animation: slide 20s linear infinite; /* Бесконечная линейная анимация */ +} +@keyframes slide { + 0% { + transform: translateX(0); + } + 100% { + transform: translateX(-100%); /* Сдвиг на полную ширину wrapper */ + } +} +.mosaic-swiper .swiper-slide { + flex-shrink: 0; + width: auto; /* Сохраняет ширину слайдов */ +} @@ -1723,6 +1953,13 @@ font-size: 12px; .main-blog { padding-bottom: 120px; } +.main-blog a { + width: 100%; +} +.main-blog_wrapper-most-bottom a { + width: 25px; + height: 25px; +} .main-blog_top { display: flex; justify-content: space-between; @@ -1745,6 +1982,7 @@ font-size: 12px; font-size: 24px; text-align: center; color: #f4f1f0; + max-width: 220px; } .main-blog_descr { margin-top: 15px; diff --git a/wp-content/themes/cosmopet/static/js/new-front-page.js b/wp-content/themes/cosmopet/static/js/new-front-page.js index ac80fc2..84eb3e8 100644 --- a/wp-content/themes/cosmopet/static/js/new-front-page.js +++ b/wp-content/themes/cosmopet/static/js/new-front-page.js @@ -223,7 +223,13 @@ document.addEventListener('DOMContentLoaded', function() { effect: 'fade', fadeEffect: { crossFade: true }, autoplay: { delay: 5000, disableOnInteraction: false }, - loop: true + loop: true, + pagination: { + el: '.swiper-pagination', + clickable: true, + bulletClass: 'swiper-pagination-bullet', + bulletActiveClass: 'swiper-pagination-bullet-active', + }, }); // cosmopet x slider @@ -258,12 +264,12 @@ document.addEventListener('DOMContentLoaded', function() { // Gallery slider const mosaicswiper = new Swiper('.mosaic-swiper', { - slidesPerView: 'auto', - spaceBetween: 20, - freeMode: true, - grabCursor: true, - loop: true // Включает бесконечную прокрутку - }); + slidesPerView: 'auto', + spaceBetween: 20, + loop: true, + loopAdditionalSlides: 29, // Дополнительные клоны для плавности + allowTouchMove: false // Отключает перетаскивание +}); // Quiz const truthContents = document.querySelectorAll('.truth_content'); diff --git a/wp-content/themes/cosmopet/templates/_pages/new-front-page.twig b/wp-content/themes/cosmopet/templates/_pages/new-front-page.twig index cd4afef..4361ed8 100644 --- a/wp-content/themes/cosmopet/templates/_pages/new-front-page.twig +++ b/wp-content/themes/cosmopet/templates/_pages/new-front-page.twig @@ -6,15 +6,15 @@ {% include '/templates/_pages/new-front-page/main-slider.twig' %} {% include '/templates/_pages/new-front-page/main-about.twig' %} {% include '/templates/_pages/new-front-page/main-why.twig' %} - {% include '/templates/_pages/new-front-page/main-ingredients.twig' %} - {% include '/templates/_pages/new-front-page/main-specialists.twig' %} {% include '/templates/_pages/new-front-page/main-food.twig' %} {% include '/templates/_pages/new-front-page/main-reviews.twig' %} + {% include '/templates/_pages/new-front-page/main-ingredients.twig' %} + {% include '/templates/_pages/new-front-page/main-specialists.twig' %} {% include '/templates/_pages/new-front-page/main-treats.twig' %} + {% include '/templates/_pages/new-front-page/main-bot.twig' %} {% include '/templates/_pages/new-front-page/main-blog.twig' %} {% include '/templates/_pages/new-front-page/main-quiz.twig' %} - {% include '/templates/_pages/new-front-page/main-media.twig' %} - {% include '/templates/_pages/new-front-page/main-bot.twig' %} + {% include '/templates/_pages/new-front-page/main-media.twig' %} {% include '/templates/_pages/new-front-page/main-cosmopetx.twig' %} {% include '/templates/_pages/new-front-page/main-gallery.twig' %} {% endblock %} \ No newline at end of file diff --git a/wp-content/themes/cosmopet/templates/_pages/new-front-page/main-blog.twig b/wp-content/themes/cosmopet/templates/_pages/new-front-page/main-blog.twig index 7665968..2370913 100644 --- a/wp-content/themes/cosmopet/templates/_pages/new-front-page/main-blog.twig +++ b/wp-content/themes/cosmopet/templates/_pages/new-front-page/main-blog.twig @@ -19,40 +19,62 @@
Составили гид по дозировкам для сторонников индивидуального подхода. Если вы с утра насыплете полную миску корма