Andrei | фикс каталога (правки в выводе рекоммендуемых товаров, кнопка узнать о наличии на странице товара при его отсутствии)

dev_10_fixbugs
Andrei 2 months ago
parent 272909cf61
commit 8180ba14cf
  1. 55
      wp-content/themes/cosmopet/modules/layout/assets/css/gp-style-core.css
  2. 16
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css
  3. 8
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-desktop.css
  4. 4
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-tablet.css
  5. 125
      wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig
  6. 2
      wp-content/themes/cosmopet/woocommerce/assets/css/gp-style-core.css

@ -578,34 +578,6 @@ textarea{
.button--red-48-px{
border-radius: 48px;
}
.to-know{
width: 100%;
padding: 12px;
display: flex;
justify-content: center;
border: none;
transition: opacity .2s ease-out;
}
.to-know:hover{
opacity: .8;
}
.to-know p{
padding-bottom: 4px;
font-family: var(--font-family);
font-weight: 700;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border-bottom: 1px var(--text-black) solid;
cursor: pointer;
}
.to-know--background-none{
background: none;
}
@ -1699,35 +1671,8 @@ textarea{
.button--red-48-px{
border-radius: 48px;
}
.to-know{
/* width: 100%; */
padding: 12px 24px 7px 24px;
display: flex;
justify-content: center;
border: none;
transition: opacity .2s ease-out;
text-decoration: none;
}
.to-know:hover{
opacity: .8;
}
.to-know p{
padding-bottom: 4px;
font-family: var(--font-family);
font-weight: 700;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border-bottom: 1px var(--text-black) solid;
cursor: pointer;
}
.to-know--background-none{
background: none;
}

@ -951,6 +951,7 @@ button{
display: flex;
align-items: start;
flex-wrap: wrap;
}
.compound__item{
margin: 5px;
@ -1083,18 +1084,17 @@ button{
}
.to-know{
/* width: 100%; */
padding: 12px 24px 7px 24px;
display: flex;
justify-content: center;
border: none;
transition: opacity .2s ease-out;
text-decoration: none;
text-transform: uppercase;
}
.product__item .to-know{
margin-right: auto;
margin-left: auto;
width: auto;
display: flex;
}
.to-know--start{
justify-content: start;
padding-left: 0;

@ -553,7 +553,6 @@ main{
font-size: 20px;
line-height: 200%;
text-transform: uppercase;
color: var(--text-black);
}
.product-item__price p::after{
@ -593,8 +592,8 @@ main{
.product__item.hiding .product-item__images{
filter: grayscale(1)
}
.product__item.hiding .product-item__price{
color: var(--text-grey);
.product__item.hiding .product-item__price p{
color: #999;
}
.product-item__overlay{
position: absolute;
@ -843,6 +842,7 @@ main{
}
.detail__image--width-perc-100{
width: calc(100% - 24px);
height: 600px;
}
@ -1059,7 +1059,7 @@ main{
display: flex;
}
.detail__catalot .product__item{
width: calc(100% - 24px);
width: calc(100%);
}
.detail__images-phone{
display: none;

@ -1,5 +1,9 @@
/* Стили для планшетов */
@media only screen and (max-width: 1200px) {
.product__main{
margin: 36px 0 0;
}
/* header */
main{
padding-top: 64px;

@ -133,7 +133,19 @@
{% endif %}
{% endif %}
</form>
{% if product.in_stock %}
{{ function('do_action', 'woocommerce_' ~ product.get_type() ~ '_add_to_cart') }}
{# Start | Вывод кнопки узнать о поступлении если товара нет в наличии #}
{% else %}
<div class="detail-block-form__item detail-block-form__item--tn">
<button type="button" data-pname="{{ product.title }}" class="to-know open-to-know" >
<p>{{ function('pll_e', 'Узнать о поступлении') }}</p>
</button>
</div>
{% endif %}
{# End | Вывод кнопки узнать о поступлении если товара нет в наличии #}
{# End | Кнопка добавить в корзину + варинанты подписки на товар #}
{# Start | Табы с информацией #}
@ -415,118 +427,7 @@
{% set post_id = related_product.ID is defined ? related_product.ID : related_product %}
{% set wc_product = fn('wc_get_product', post_id) %}
{% if wc_product %}
<div class="product__item">
<div class="product-item__label">
{% if wc_product.get_date_created|date('Y-m-d') >= criteria_for_new_product %}
<span href="#" class="product-item-label__tag product-item-label__tag--new">
{{ function('pll_e', 'Новинка') }}
</span>
{% endif %}
{% if is_subscription %}
<span href="#" class="product-item-label__tag product-item-label__tag--sale">
{{ function('pll_e', 'Распродажа %') }}
</span>
{% endif %}
</div>
<a href="{{ wc_product.get_permalink() }}" class="product-item__product-card">
<img src="{{ fn('wp_get_attachment_url', wc_product.get_image_id()) }}" alt="{{ wc_product.get_name() }}" class="product-item__images">
</a>
<div class="product-item__content-card">
<div class="compound">
{% set compound = fn('wc_get_product_terms', post_id, 'pa_compound') %}
{% for option in compound %}
{% set term = get_term(option) %}
<a href="/compound/{{ term.slug }}" class="compound__item">{{ term.name }}</a>
{% endfor %}
</div>
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<div class="product-item__price">
<p>{{ wc_product.get_price() }} {{ fn('get_woocommerce_currency_symbol') }}</p>
</div>
<div class="product-item__bye">
<button class="button button--white button--100-perc open-overlay">
{{ function('pll_e', 'Купить') }}
</button>
</div>
</div>
<div class="product-item__overlay">
<div class="product-item-overlay__header">
<a href="{{ wc_product.get_permalink() }}" class="product-item__title">{{ wc_product.get_name() }}</a>
<ul class="product-item-overlay__tags">
{% set features = fn('wc_get_product_terms', post_id, 'pa_features') %}
{% for option in features %}
{% set term = get_term(option) %}
<li>{{ term.name }}</li>
{% endfor %}
</ul>
</div>
<form class="product-item__form" method="post" action="/send-telegram.php">
<div class="product-item-overlay__input-block">
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Объем</p>
<div class="select">
{% set cur_weight = function('get_product_info', post_id, 'weight') %}
<input type="text" class="select__state" value="{{ cur_weight }}" readonly data-product_id="{{ post_id }}" data-product_price="{{ wc_product.get_price() }}">
<div class="state__block">
<ul class="state__content">
{% set collection = fn('wc_get_product_terms', post_id, 'pa_collection') %}
{% for option in collection %}
{% set term = get_term(option) %}
{% if term %}
{% set siblings = function('get_collection_siblings', term.term_id) %}
{% for sibling in siblings %}
{% set weight = function('get_product_info', sibling.ID, 'weight') %}
{% set class = '' %}
{% if weight == cur_weight %}
{% set class = 'active' %}
{% endif %}
<li>
<button class="state__button {{ class }}" data-product_id="{{ sibling.ID }}" data-product_price="{{ function('get_product_info', sibling.ID, 'price') }}">
{{ weight }}
</button>
</li>
{% endfor %}
{% endif %}
{% endfor %}
</ul>
</div>
</div>
</div>
<div class="product-item-overlay__field">
<p class="product-item-overlay-field__title">Количество</p>
<div class="counter">
<button class="counter__button minus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/minus.svg" alt="">
</button>
<input type="text" class="counter__input" value="1">
<button class="counter__button plus">
<img src="{{ theme.uri }}/woocommerce/assets/img/svg/main/plus.svg" alt="">
</button>
</div>
</div>
</div>
<p class="product-item-overlay__price">
{{ wc_product.get_price() }}
</p>
<div class="product-item-overlay__block-button">
<div class="product-item-overlay__button">
{{ function('get_add_to_cart_button', post_id) }}
</div>
<div class="product-item-overlay__more_button">
<a class="to-know button--100-perc" href="{{ wc_product.get_permalink() }}">
<p>{{ function('pll_e', 'Подробнее') }}</p>
</a>
</div>
</div>
</form>
</div>
</div>
{% include '_blocks/shop/archive-product-tease.twig' with {post: wc_product} %}
{% endif %}
</div>
{% endfor %}

@ -1339,4 +1339,4 @@ color: #FA0505;
}
.product-item__price-sale__perc::after{
display: none;
}
}

Loading…
Cancel
Save