Task 7405 | layout improve and bug fixes

wp-content/themes/cosmopet/modules/forms/assets/css/forms.css

@@ -1,12 +1,26 @@
-.mform-offer input, .mform-offer textarea, .mform-offer select {
+.mform-offer input, .mform-offer textarea {
     width: 100%!important;
     padding: 12px 15px!important;
     border: none!important;
     border-radius: 20px!important;
     font-size: 16px!important;
     background-color: white!important;
+    font-family: inherit;
+}
+.mform-offer select{
+    font-size: 16px;
+    width: 100%;
+    padding: 12px 0;
 }
 
+.form-select-label {
+    width: 100%;
+    padding: 0px 15px;
+    border: none;
+    border-radius: 20px;
+    font-size: 16px;
+    background-color: white;
+}
 .mform-parthnership.mform .mform-content{
     color: #fff;
     background: radial-gradient(278.91% 196.13% at 128.36% -48.29%, #ee6868 0%, #569ef0 57.69%);

wp-content/themes/cosmopet/static/css/new-front-page.css

@@ -68,6 +68,8 @@ main {
 .main-slider .swiper-slide:not(.swiper-slide-active){
     pointer-events: none;
 }
+
+
 .main-slider-content {
     margin-top: 85px;
 }
@@ -657,18 +659,21 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
 }
 .main-specialists_bio-info {
     text-align: left;
+        width: 100%;
 }
 .main-specialists_bio-name {
     font-weight: 500;
     font-size: 16px;
     text-transform: uppercase;
     color: #fff;
+    width: 100%;
 }
 .main-specialists_bio-position {
     font-weight: 500;
     font-size: 14px;
     color: #fff;
     margin-top: 0.5em;
+    width: 100%;
 }
 .main-specialists_text {
     border-radius: 25px;
@@ -922,14 +927,12 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
     background-color: var(--accent-color);
 }
 
-.main-food_reviews {
-    max-width: 400px;
-}
 .main-food_reviews {
     border-radius: 40px;
     padding: 24px;
     max-width: 395px;
-    height: 772px;
+    height: 672px;
+    flex-grow: 1;
     position: relative;
     box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.12);
     background: #fff;
@@ -949,7 +952,7 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
     align-items: center;
     padding: 20px;
     border-radius: 8px;
-    min-height: 650px;
+    min-height: 580px;
 }
 .main-food_reviews-slide-img {
     border: 2px solid #fff;
@@ -998,7 +1001,7 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
     position: absolute;
     left: 40%;
     transform: translateX(-50%);
-    bottom: 40px;
+    bottom: 30px;
     z-index: 100;
     font-weight: 500;
     font-size: 16px;
@@ -1232,7 +1235,7 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
-    bottom: 32px;
+    bottom: 26px;
     z-index: 100;
     font-weight: 500;
     font-size: 16px;
@@ -1270,15 +1273,7 @@ background: radial-gradient(161.08% 232.33% at 133.99% -48.29%, #EE6868 0%, #569
     left: var(--swiper-navigation-sides-offset, -65px)!important;
     right: auto;
 }
-.main-treats .main-food_reviews {
+
-    border-radius: 40px;
-    padding: 24px;
-    max-width: 395px;
-    height: 713px;
-    position: relative;
-    box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.12);
-    background: #fff;
-}
 .main-food_reviews-slide-top {
     display: flex;
     justify-content: flex-start;
@@ -1503,6 +1498,8 @@ background: #e5f1fa;
         height: 110%;
         bottom: -50px;
     }
+
+
 }
 .main-bot_wrapper-tag {
     border-radius: 100px;
@@ -1897,7 +1894,11 @@ background: #e5f1fa;
     font-size: 48px;
     text-transform: uppercase;
     color: #121212;
-    margin-bottom: 40px;
+    margin-bottom: 15px;
+    line-height: 1;
+}
+.truth_block_q{
+    margin-top: 1.5rem;
 }
 .truth_content-end .truth_block-title,
 .truth_success .truth_block-title{
@@ -1936,7 +1937,7 @@ background: #e5f1fa;
 }
 .truth_error .truth_block-text p,
 .truth_success .truth_block-text p {
-    max-width: 592px;
+    max-width: 460px;
     font-size: 20px;
     line-height: 24px;
     font-weight: 500;
@@ -2021,6 +2022,10 @@ background: #e5f1fa;
     width: 800px;
     max-width: 100%;
 }
+.truth_pictures{
+        margin-left: -5rem;
+    margin-right: 11rem;
+}
 .truth_pictures_brain {
     display: block;
     position: absolute;
@@ -2033,13 +2038,13 @@ background: #e5f1fa;
     position: absolute;
     bottom: 5%;
     z-index: 0;
-    left: 10%;
+    left: 8%;
 }
 .truth_pictures_arrow {
     display: block;
     position: absolute;
     top: 5%;
-    left: 28%;
+    left: 26%;
 }
 .main-truth_title {
     font-weight: 700;
@@ -2551,6 +2556,8 @@ height: 100%;
 .truth_pictures_present{
     max-width: 333px;
     width: 333px;
+        position: relative;
+    left: 4rem;
 }
 @media (max-width: 940px) {
     .gallery-box{
@@ -2668,6 +2675,7 @@ height: 100%;
     .cosmopet-x__item{
         height: 340px;
    padding: 16px;
+   border-radius: 24px;
     }
     .cosmopet-x .swiper-slide, .cosmopet-x__item::before, .cosmopet-x__bg{
         border-radius: 24px;
@@ -3340,9 +3348,6 @@ font-weight: 500;
     text-align: left;
     background: #f4f1f0;
 }
-.truth_block .truth_link{
-    width: 100%;
-}
 .truth_links{
     margin-top: -40px;
 }
@@ -3965,12 +3970,18 @@ background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-top: 2rem;
 border-bottom: 1px rgb(86, 158, 240) solid;
+display: block;
+width: max-content;
 }
 
 @media (max-width: 640px) {
-    .mform__review{
+    .mform__review-wrap{
         padding: 24px;
-        padding-top: 40px;
+        padding-top: 60px;
+        padding-right: 10px;
+    }
+    .mform__review{
+        padding-right: 16px;
     }
 }
 
@@ -3994,3 +4005,97 @@ border-bottom: 1px rgb(86, 158, 240) solid;
 .mform__review::-webkit-scrollbar-thumb:hover {
     background-color: #63acff;
 }
+
+@media (max-width: 576px) {
+    .main-food_reviews {
+        min-height: 600px;
+        height: 80vh;
+        max-height: 750px;
+    }
+    .main-food_reviews-slide {
+        min-height: 520px;
+        height: calc(80vh - 80px);
+        max-height: 670px;
+    }
+    .main-bot .swiper-pagination-bullet{
+    width: 91px;
+}
+.main-bot .swiper-pagination{
+    gap: 12px;
+}
+
+.truth_block .truth_link{
+    width: 100%;
+}
+.cosmopet-x .slider-arrows .cosmopet-prev{
+    left: 0;
+}
+.cosmopet-x .slider-arrows .slider-next{
+    right: 0;
+}
+}
+
+.bot-slider .swiper-slide:not(.swiper-slide-active){
+        pointer-events: none;
+}
+
+@media (max-width: 776px) {
+    .truth .truth_block{
+        height: auto;
+    }
+}
+
+.new-grad .mini-profile__button--counter {
+    color: #fff;
+}
+
+.main-slider__bullets{
+    position: absolute;
+    width: 100%;
+bottom: 8rem !important;
+    left: 0;
+    display: flex;
+    justify-content: center;
+    gap: 16px;
+    top: unset !important;
+}
+
+.main-slider__bullet{
+    height: 2px;
+    width: 120px;
+    opacity: 1;
+    background-color: rgba(25, 25, 25, .4);
+    position: relative;
+}
+.main-slider__bullet::after{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 0;
+    background-color: rgba(25, 25, 25, 1);
+    height: 100%;
+    content: '';
+}
+.main-slider__bullet-active::after{
+    animation: 5s fullFill linear;
+}
+
+@media (max-width: 768px) {
+    .main-slider__bullet{
+        width: 48px;
+        background-color: rgba(255, 255, 255, 1);
+        opacity: 1;
+        box-shadow: rgba(11, 11, 11, 0.5) 0px 2px 6px 0px;
+        height: 6px;
+        border-radius: 10px;
+    }
+    .main-slider__bullet::after{
+        background: radial-gradient(154.31% 232.33% at 128.36% -48.29%, #EE6868 0%, #569EF0 57.69%);
+        border-radius: inherit;
+    }
+    .main-slider__bullets{
+        gap: 8px;
+        z-index: 10;
+    }
+    
+}

wp-content/themes/cosmopet/static/js/new-front-page.js

@@ -8,7 +8,13 @@ document.addEventListener('DOMContentLoaded', function() {
         },
         fadeEffect: { crossFade: true },
         autoplay: { delay: 5000, disableOnInteraction: false },
-        loop: true
+        loop: true,
+        pagination: {
+            el: '.main-slider__bullets',
+            clickable: true,
+            bulletClass: 'main-slider__bullet',
+            bulletActiveClass: 'main-slider__bullet-active',
+        },
     });
 
     // Ingredients slider
@@ -148,8 +154,6 @@ document.addEventListener('DOMContentLoaded', function() {
         }
     });
    
-
-        
     const whySwiper = new Swiper('.main-why_swiper', {
         slidesPerView: 1,
         spaceBetween: 20,

wp-content/themes/cosmopet/temp-functions/woocommerce-logic.php

@@ -134,7 +134,7 @@ function get_collection_siblings ($term) {
         'posts_per_page' => -1,
         'post_type' => 'product',
         'order' => 'ASC',
-        'order_by' => 'name',
+        'orderby' => 'name', // Fixed parameter name (was 'order_by')
         'tax_query' => [
             [
                 'taxonomy' => 'pa_collection',
@@ -146,13 +146,27 @@ function get_collection_siblings ($term) {
 
     $siblings = get_posts($args);
     
-    $sibl_arr = [];
+    // Create array with products and their weights
-
+    $siblings_with_weights = [];
     foreach ($siblings as $sibling) {
-        $sibl_arr [] = $sibling;
+        $weight = function_exists('get_product_info') ? get_product_info($sibling->ID, 'weight') : 0;
+        $siblings_with_weights[] = [
+            'post' => $sibling,
+            'weight' => floatval($weight) // Ensure weight is treated as a number
+        ];
     }
     
-    return $sibl_arr;
+    // Sort by weight
+    usort($siblings_with_weights, function($a, $b) {
+        return $a['weight'] <=> $b['weight'];
+    });
+    
+    // Extract just the posts in sorted order
+    $sorted_siblings = array_map(function($item) {
+        return $item['post'];
+    }, $siblings_with_weights);
+    
+    return $sorted_siblings;
 }
 
 add_filter( 'woocommerce_price_trim_zeros', '__return_true' );

wp-content/themes/cosmopet/templates/_pages/new-front-page/main-bot.twig

@@ -5,13 +5,13 @@
                 <div class="swiper-slide main-bot_wrapper main-bot_wrapper--bot">
                     <div class="main-bot_wrapper-tag">Первый в России</div>
                     <h2 class="main-bot_wrapper-title">ветеринарный бот с&nbsp;бесплатными вет консультациями</h2>
-                    <a href="#" target="_blank" class="main-bot_wrapper-link">Перейти</a>
+                    <a href="https://t.me/cosmopet_bot" target="_blank" class="main-bot_wrapper-link">Перейти</a>
                     <img class="main-bot_wrapper__img" src="/wp-content/themes/cosmopet/static/img/new-front/banner1.png">
                 </div>
                 <div class="swiper-slide main-bot_wrapper main-bot_wrapper--tg">
-                    <h2 class="main-bot_wrapper-title">Телеграм с&nbsp;инструкцией о том, как понимать своего пета</h2>
+                    <h2 class="main-bot_wrapper-title">Телеграм каналл с&nbsp;инструкцией о том, как понимать своего пета</h2>
                     <p>зоопсихология, петхакинг, советы кинологов и&nbsp;ветеринаров</p>
-                    <a href="#" target="_blank" class="main-bot_wrapper-link">Перейти в Telegram</a>
+                    <a href="https://t.me/cosmospet" target="_blank" class="main-bot_wrapper-link">Перейти в Telegram</a>
                     <img class="main-bot_wrapper__img" src="/wp-content/themes/cosmopet/static/img/new-front/banner2.png">
                 </div>
             </div>

wp-content/themes/cosmopet/templates/_pages/new-front-page/main-quiz.twig

@@ -22,8 +22,8 @@
                         <span></span>
                         <span></span>
                     </div>
-                    <div class="truth_block-title">{{ q_1.title }}</div>
+                    <div class="truth_block-title">Правда или миф</div>
-                    <div class="truth_block-text">
+                    <div class="truth_block-text truth_block_q">
                         <img src="{{ theme.link }}/static/img/truth_num.svg"
                             alt="">
                         <p>Индейка - самый гипоаллергенный протеин для кошек и собак</p>
@@ -90,8 +90,8 @@
                         <span></span>
                     </div>
                 
-                    <div class="truth_block-title"><p>{{ q_2.title }}</p></div>
+                    <div class="truth_block-title"><p>Правда или миф</p></div>
-                    <div class="truth_block-text">
+                    <div class="truth_block-text truth_block_q">
                         <img src="{{ theme.link }}/static/img/truth_num2.svg"
                             alt="">
                         <p>Сухого корма недостаточно для поддержания здоровья питомца</p>
@@ -160,8 +160,8 @@
                         <span></span>
                         <span></span>
                     </div>
-                    <div class="truth_block-title">{{q_2.title}}</div>
+                    <div class="truth_block-title">Правда или миф</div>
-                    <div class="truth_block-text">
+                    <div class="truth_block-text truth_block_q">
                         <img src="{{ theme.link }}/static/img/truth_num3.svg"
                             alt="">
                         <p>Переводить питомца на новый корм нужно постепенно</p>
@@ -241,8 +241,8 @@
                         <span class="active"></span>
                         <span></span>
                     </div>
-                    <div class="truth_block-title">{{q_4.text_title}}</div>
+                    <div class="truth_block-title ">Правда или миф</div>
-                    <div class="truth_block-text">
+                    <div class="truth_block-text truth_block_q">
                         <img src="{{ theme.link }}/static/img/truth_num4.svg"
                             alt="">
                         <p>Котят и щенят нельзя кормить кормом для взрослых питомцев на постоянной основе</p>
@@ -309,8 +309,8 @@
                         <span></span>
                         <span class="active"></span>
                     </div>
-                    <div class="truth_block-title">{{q_5.title}}</div>
+                    <div class="truth_block-title">Правда или миф</div>
-                    <div class="truth_block-text">
+                    <div class="truth_block-text truth_block_q">
                         <img src="{{ theme.link }}/static/img/truth_num5.svg"
                             alt="">
                         <p>Сухой и горячий нос у питомца - симптом заболевания</p>

wp-content/themes/cosmopet/templates/_pages/new-front-page/main-slider.twig

@@ -15,5 +15,6 @@
         </div>  
       </div>
     {% endfor %}
+    <div class="main-slider__bullets"></div>
   </div>
 </section>

wp-content/themes/cosmopet/templates/forms/parthners-form.twig

@@ -14,6 +14,7 @@
           <input type="tel" name="phone" placeholder="Телефон *" required>
         </div>
         <div class="form-group full-width">
+          <label for="parthnership-select" class="form-select-label">
             <select id="parthnership-select" name="parthner_type">
               <option value="Заводчики">Заводчики</option>
               <option value="Инфлюенсеры">Инфлюенсеры</option>
@@ -23,6 +24,7 @@
               <option value="Приюты">Приюты</option>
               <option value="Коллаборации">Коллаборации</option>
             </select>
+          </label>
         </div>
       </div>
       <div class="form-group half-width message-container">

wp-content/themes/cosmopet/templates/shop/reviews-section_block.twig

@@ -25,7 +25,7 @@
                             </div>
                             <p class="main-food_reviews-slide-position {% if not fn('get_field', 'photo', slide) %}--no-padding-left{% endif %}">{{fn('get_field', 'desc', slide)}}</p>
                             {% if fn('get_field', 'text', slide) %}
-                                {% set maxLength = 500 %}
+                                {% set maxLength = 350 %}
                                 {% set content = fn('get_field', 'text', slide) %}
                                      
                                 {% if content|length > maxLength %}