Good-Production
/
cosmopet-architecture
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Feat | subscriptions

Browse Source 
Co-authored-by: Your Name <you@example.com>
Reviewed-on: #22
pull/23/head
Andrei-10 3 months ago
parent 3aa9b634b2
commit 0e27ae936e
7 changed files with 357 additions and 939 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 33
      wp-content/themes/cosmopet/functions.php
  2. 215
      wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js
  3. 946
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css
  4. 44
      wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-product.js
  5. 9
      wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig
  6. 47
      wp-content/themes/cosmopet/templates/modal/basket.twig
  7. 2
      wp-content/themes/cosmopet/templates/shop/cart-contents.twig

33
wp-content/themes/cosmopet/functions.php
Unescape View File

@ -1151,6 +1151,39 @@ function change_wbw_reset_button_text($text) {
return 'Сбросить'; return 'Сбросить';
} }
add_action('wp_ajax_get_cart_fragment', 'get_cart_fragment_callback');
add_action('wp_ajax_nopriv_get_cart_fragment', 'get_cart_fragment_callback');
function get_cart_fragment_callback() {
// Проверяем nonce для безопасности
check_ajax_referer('woocommerce-cart', 'security', false);
// Получаем содержимое корзины
ob_start();
wc_get_template('shop/cart-contents.twig', [], '', get_template_directory() . '/templates/');
$contents = ob_get_clean();
// Получаем футер корзины
ob_start();
wc_get_template('modal-basket-footer.twig', [], '', get_template_directory() . '/templates/');
$footer = ob_get_clean();
// Получаем данные корзины
$cart = WC()->cart;
$count = $cart->get_cart_contents_count();
$total = $cart->get_total('raw'); // Числовая сумма
$total_html = wc_cart_totals_order_total_html(); // Форматированная сумма
wp_send_json_success([
'contents' => $contents,
'footer' => $footer,
'count' => $count,
'total' => $total_html,
'total_raw' => $total
]);
}
add_action('template_redirect', 'custom_redirect_cart_page'); add_action('template_redirect', 'custom_redirect_cart_page');
function custom_redirect_cart_page() { function custom_redirect_cart_page() {
if (is_cart()) { if (is_cart()) {

215
wp-content/themes/cosmopet/modules/shop/components/cart/assets/js/cart.js
Unescape View File

@ -111,47 +111,62 @@ jQuery(document).ready(function($) {
restoreRemovedItems(); restoreRemovedItems();
// Функция удаления товара с возможностью восстановления // Функция удаления товара с возможностью восстановления
function removeItem(key) { function removeItem(key) {
const $item = $(`[data-key="${key}"]`); const $item = $(`[data-key="${key}"]`);
const productId = $item.data('product_id'); const productId = $item.data('product_id');
const variationId = $item.data('variation_id') || 0; const variationId = $item.data('variation_id') || 0;
const quantity = parseInt($item.find('.counter__input').val()); const quantity = parseInt($item.find('.counter__input').val());
// Сохраняем во временное хранилище // Сохраняем во временное хранилище
const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || [];
removedItems.push({ product_id: productId, variation_id: variationId, quantity: quantity, key: key }); removedItems.push({ product_id: productId, variation_id: variationId, quantity: quantity, key: key });
localStorage.setItem(removedItemsStorageKey, JSON.stringify(removedItems)); localStorage.setItem(removedItemsStorageKey, JSON.stringify(removedItems));
// Показываем кнопку восстановления // Показываем кнопку восстановления
$item.html(` $item.html(`
<p class="modal-basket-item__title"> <p class="modal-basket-item__title">
Удаление товара из корзины: <span id="${key}_timer" class="timer_counter">5</span>с Removing an item from the cart: <span id="${key}_timer" class="timer_counter">5</span>с
</p> </p>
<div class="modal-basket-item__return-wrapper"> <div class="modal-basket-item__return-wrapper">
<button class="modal-basket-item__return" data-key="${key}"> <button class="modal-basket-item__return" data-key="${key}">
${woocommerce_params.i18n_restore_item || 'Restore'} ${woocommerce_params.i18n_restore_item || 'Restore'}
</button> </button>
</div> </div>
`); `);
// Удаляем через 5 секунд, если не восстановили // Проверяем количество товаров в корзине
const removeTimeout = setTimeout(() => { $.ajax({
permanentRemoveItem(key, productId, variationId); type: 'POST',
}, 5000); url: woocommerce_params.ajax_url,
data: {
action: 'check_cart_count'
},
success: function(response) {
if (response.success && response.data.count <= 1) {
// Если после удаления корзина станет пустой (1 товар сейчас, удаляем его)
$('.proceed-to-checkout').css('display', 'none');
}
}
});
// Удаляем через 5 секунд, если не восстановили
const removeTimeout = setTimeout(() => {
permanentRemoveItem(key, productId, variationId);
}, 5000);
const product_remove_timer = setInterval(() => { const product_remove_timer = setInterval(() => {
let number = Number($(`#${key}_timer`).html()) - 1 let number = Number($(`#${key}_timer`).html()) - 1;
$(`#${key}_timer`).html(number) $(`#${key}_timer`).html(number);
}, 1000); }, 1000);
// Обработчик восстановления // Обработчик восстановления
$(document).off('click', `[data-key="${key}"] .modal-basket-item__return`).on('click', `[data-key="${key}"] .modal-basket-item__return`, function(e) { $(document).off('click', `[data-key="${key}"] .modal-basket-item__return`).on('click', `[data-key="${key}"] .modal-basket-item__return`, function(e) {
e.preventDefault(); e.preventDefault();
clearTimeout(removeTimeout); clearTimeout(removeTimeout);
clearInterval(product_remove_timer); // Очищаем интервал clearInterval(product_remove_timer); // Очищаем интервал
restoreItem(key, productId, variationId, quantity); restoreItem(key, productId, variationId, quantity);
}); });
} }
// Полное удаление товара // Полное удаление товара
function permanentRemoveItem(key, productId, variationId) { function permanentRemoveItem(key, productId, variationId) {
@ -182,36 +197,39 @@ jQuery(document).ready(function($) {
}); });
} }
// Восстановление товара // Восстановление товара
function restoreItem(key, productId, variationId, quantity) { function restoreItem(key, productId, variationId, quantity) {
$('#modal-basket').addClass('loading'); $('#modal-basket').addClass('loading');
$.ajax({ $.ajax({
type: 'POST', type: 'POST',
url: woocommerce_params.ajax_url, url: woocommerce_params.ajax_url,
data: { data: {
action: 'restore_cart_item', action: 'restore_cart_item',
product_id: productId, product_id: productId,
variation_id: variationId, variation_id: variationId,
quantity: quantity quantity: quantity
}, },
complete: function() { complete: function() {
$('#modal-basket').removeClass('loading'); $('#modal-basket').removeClass('loading');
}, },
success: function(response) { success: function(response) {
if (response.success) { if (response.success) {
// Удаляем из временного хранилища // Удаляем из временного хранилища
const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || []; const removedItems = JSON.parse(localStorage.getItem(removedItemsStorageKey)) || [];
const updatedItems = removedItems.filter(item => const updatedItems = removedItems.filter(item =>
!(item.product_id === productId && item.variation_id === variationId) !(item.product_id === productId && item.variation_id === variationId)
); );
localStorage.setItem(removedItemsStorageKey, JSON.stringify(updatedItems)); localStorage.setItem(removedItemsStorageKey, JSON.stringify(updatedItems));
updateCartFragment(); // Показываем кнопку Proceed to checkout
} $('.proceed-to-checkout').css('display', '');
updateCartFragment();
} }
}); }
} });
}
// --- Работа с cookie --- // --- Работа с cookie ---
function setCookie(name, value, days) { function setCookie(name, value, days) {
@ -304,36 +322,39 @@ jQuery(document).ready(function($) {
} }
// Обновление фрагментов корзины // Обновление фрагментов корзины
function updateCartFragment() { function updateCartFragment() {
$.ajax({ $.ajax({
type: 'POST', type: 'POST',
url: woocommerce_params.ajax_url, url: woocommerce_params.ajax_url,
data: { data: {
action: 'get_cart_fragment' action: 'get_cart_fragment'
}, },
beforeSend: function() { beforeSend: function() {
$('#modal-basket').addClass('loading'); $('#modal-basket').addClass('loading');
}, },
complete: function() { complete: function() {
$('#modal-basket').removeClass('loading'); $('#modal-basket').removeClass('loading');
}, },
success: function(response) { success: function(response) {
console.log(response) console.log(response);
if (response.success) { if (response.success) {
$('#modal-basket-content').html(response.data.contents); $('#modal-basket-content').html(response.data.contents);
$('.modal-block-price__price').html(response.data.total); $('.modal-block-price__price').html(response.data.total);
$('.mini-profile__button--counter').text(response.data.count); $('.mini-profile__button--counter').text(response.data.count);
if(response.data.count > 0){ if (response.data.count > 0) {
$('.mini-profile__button--counter').removeClass('disabled') $('.mini-profile__button--counter').removeClass('disabled');
} $('.proceed-to-checkout').css('display', ''); // Показываем кнопку, если есть товары
else( } else {
$('.mini-profile__button--counter').addClass('disabled') $('.mini-profile__button--counter').addClass('disabled');
) $('.proceed-to-checkout').css('display', 'none'); // Скрываем кнопку, если корзина пуста
} }
} }
}); },
} error: function(xhr, status, error) {
console.error('AJAX error:', error);
}
});
}
// Добавляем спиннер на кнопку 'Добавить в корзину' в корзине // Добавляем спиннер на кнопку 'Добавить в корзину' в корзине
$('body').on('click', '.add_to_cart_button', function() { $('body').on('click', '.add_to_cart_button', function() {

946
wp-content/themes/cosmopet/modules/shop/components/single-product/assets/css/gp-style-core.css
Unescape View File

@ -1330,814 +1330,6 @@ button{
} }
/* counter */ /* counter */
/* modal */
.modal{
position: fixed;
top: 0;
left: 0;
padding: 20px;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.25);
z-index: 200;
opacity: 0;
transition: opacity .2s ease-out;
pointer-events: none;
display: flex;
justify-content: center;
align-items: center;
overflow-y: auto;
}
.modal.active{
opacity: 1;
pointer-events: auto;
}
.modal__notification{}
.form__button-mobile{
display: none;
}
.modal__aside{
position: fixed;
top: 0;
right: 0;
width: 0;
height: 100%;
overflow: hidden;
transition: width .4s ease-out;
}
.modal__item{
height: 100%;
padding: 24px;
background: var(--background-white);
position: relative;
display: none;
filter: blur(10px);
transition: filter .2s ease-out;
}
.modal__item--no-title{
padding-top: 72px;
}
.modal__item.active{
display: flex;
flex-direction: column;
justify-content: space-between;
}
.modal__close{
position: absolute;
top: 32px;
right: 24px;
width: 24px;
height: 24px;
border: none;
background: none;
}
.modal__header{}
.modal__title{
padding-right: 48px;
font-family: var(--font-family);
font-weight: 700;
font-size: 36px;
line-height: 111%;
text-transform: uppercase;
color: var(--text-black);
}
.modal__small-title{
font-family: var(--font-family);
font-weight: 700;
font-size: 24px;
line-height: 100%;
text-transform: uppercase;
color: var(--text-black);
}
.modal__text{
margin-top: 16px;
padding-right: 10px;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-0);
}
.modal__form-sub{
margin-top: 48px;
}
.modal-form-sub__submit{
margin-top: 64px;
}
.modal__block-button{
margin-top: 24px;
}
.modal__button{
margin-top: 16px;
}
.modal__button:first-child{
margin-top: 0;
}
.modal__content{
margin-top: 24px;
}
.modal__filter{
width: 400px;
}
.modal__footer{
border-top: 1px solid var(--text-6);
padding-top: 23px;
}
.modal__block-price{
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-block-price__title{
font-family: var(--font-family);
font-weight: 600;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
}
.modal-block-price__price{
font-family: var(--font-family);
font-weight: 700;
font-size: 24px;
line-height: 100%;
text-transform: uppercase;
text-align: right;
color: var(--text-black);
}
.modal-block-price__price::after{
content: 'Р';
}
.modal__basket{
width: 600px;
}
.modal__to-know,
.modal__to-know-submit{
width: 412px;
}
.modal-basket__item{
padding-top: 23px;
padding-right: 15px;
padding-bottom: 24px;
display: flex;
border-top: 1px solid var(--background-grey);
position: relative;
}
.modal-basket__item::before{
content: '';
position: absolute;
top: 24px;
right: 6px;
width: 24px;
aspect-ratio: 1;
background-image: url(../img/svg/main/basket.svg);
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
transition: opacity .2s ease-out;
}
.modal-basket__item:hover .modal-basket__item::before{
opacity: .8;
}
.modal-basket__item--return{
padding-right: 5px;
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-basket__item--return .modal-basket-item__title{
padding-right: 10px;
}
.modal-basket__item--return::before{
display: none;
}
.modal-basket-item__return{
border-radius: 20px;
padding: 4px 24px;
font-family: var(--font-family);
font-weight: 600;
font-size: 20px;
line-height: 120%;
color: var(--text-white);
background: var(--background-black);
border: none;
}
.modal-basket-item__block-image{
width: 128px;
aspect-ratio: 1;
display: flex;
justify-content: center;
align-items: center;
}
.modal-basket-item__image{
width: 96px;
aspect-ratio: 1;
object-fit: contain;
}
.modal-basket-item__content{
margin-left: 16px;
}
.modal-basket-item__title{
padding-right: 40px;
font-family: var(--font-family);
font-weight: 500;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
}
.modal-basket-item__sub-title{
margin-top: 8px;
font-family: var(--font-family);
font-weight: 700;
font-size: 12px;
line-height: 133%;
color: var(--text-black);
}
.modal-basket-item__control{
margin-top: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-basket-item__price{
font-family: var(--font-family);
font-weight: 600;
font-size: 20px;
line-height: 120%;
text-align: right;
color: var(--text-black);
}
.modal-basket-item__price::after{
content: 'Р';
padding-left: 4px;
}
.modal__basket .modal__header{
height: calc(100% - 92px);
margin-bottom: -36px;
}
.modal__basket .modal__content{
height: calc(100% - 100px);
overflow-x: hidden;
}
.modal__basket .modal__content::-webkit-scrollbar {
width: 7px;
background-color: #f9f9fd;
}
.modal__basket .modal__content::-webkit-scrollbar-thumb {
background-color: var(--background-black);
border-radius: 2px;
}
.modal-form{
margin: auto;
width: 600px;
padding: 24px;
border-radius: 20px;
position: relative;
display: none;
}
.modal-form.active{
display: block;
}
.modal-form--white{
border: 1px solid var(--background-black);
background: var(--background-white);
}
.modal-form--green-gradient{
background: var(--gradient-blue);
}
.modal-form--width-584{
width: 584px;
}
.modal-form--cdek{
width: 836px;
}
.modal-form__close{
position: absolute;
top: 24px;
right: 24px;
width: 24px;
aspect-ratio: 1;
border: none;
background: none;
background-image: url(../img/svg/main/black-x.svg);
background-repeat: no-repeat;
background-size: 24px;
background-position: center;
transition: opacity .2s ease-out;
z-index: 10;
}
.modal-form__close--white{
background-image: url(../img/svg/main/white-x.svg);
}
.modal-form__close:hover{
opacity: .8;
}
.modal-form__button-close{}
.modal-form__title{
padding-right: 50px;
font-family: var(--font-family);
font-weight: 700;
font-size: 26px;
line-height: 123%;
text-transform: uppercase;
color: var(--text-dark);
}
.modal-form__text--center{
text-align: center;
}
.modal-form__text--center-pc{
text-align: center;
}
.modal-form__title--green-gradient{
background: var(--gradient-blue);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.modal-form__title--white{
color: var(--text-white);
}
.modal-form__element{
margin-top: 24px;
}
.modal-form__element--center{
display: flex;
justify-content: center;
}
.modal-form__element--top-40{
margin-top: 40px;
}
.modal-form__text{
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
}
.modal-form__text--weight-500{
font-weight: 500;
}
.modal-form__text--white{
color: var(--text-white);
}
.modal-form__img{
width: 100%;
height: 360px;
object-fit: contain;
}
.modal-form__content{
margin-top: 40px;
}
.modal-form-content__line{
margin-top: 24px;
}
.modal-form-content__line:first-child{
margin-top: 0;
}
.modal-form-content__line--two{
display: flex;
justify-content: space-between;
}
.modal-form-content__line--two-mobile{
display: flex;
justify-content: space-between;
}
.modal-form-content__line--two-mobile .modal-form-content-line__element{
width: calc(50% - 12px);
}
.modal-form-content-line__element{
position: relative;
}
.modal-form-content-line__element--arrow::after{
content: '';
position: absolute;
right: 16px;
bottom: 16px;
width: 16px;
height: 16px;
background-image: url(../img/svg/main/arrow-right-input.svg);
pointer-events: none;
}
.modal-form-content__line--two .modal-form-content-line__element{
width: calc(50% - 12px);
}
.modal-form-content__line--three{
display: flex;
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){
width: 85px;
flex-shrink: 0;
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){
margin-left: 8px;
width: 100%;
}
.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){
margin-left: 8px;
width: 85px;
flex-shrink: 0;
}
.modal-form-content__line--margin-top-16{
margin-top: 16px;
}
.modal-form__buttons{
margin-top: 32px;
}
.modal-form__buttons--two{
display: flex;
justify-content: space-between;
align-items: center;
}
.modal-form__buttons--two button,
.modal-form__buttons--two input{
width: calc(50% - 20px);
}
.modal-map{
margin: auto;
width: 1105px;
display: none;
border-radius: 24px;
border: none;
}
.modal-map.active{
display: flex;
}
.modal-map__left{
width: 600px;
padding: 24px;
position: relative;
}
.modal-map__control{
margin: 38px -12px -12px -12px;
display: flex;
}
.modal-map__control--delivery{
margin-top: 12px;
}
.modal-map-control__item{
margin: 12px;
padding: 2px;
width: calc(50% - 24px);
background: var(--background-9);
border-radius: 20px;
border: none;
}
.modal-map-control__item.active{
background: var(--gradient-blue);
}
.modal-map-control__item.active .form-input-radio__circle::before{
content: '';
position: absolute;
top: 4px;
left: 4px;
width: 12px;
aspect-ratio: 1;
border-radius: 50%;
background: var(--gradient-blue);
}
.modal-map-control-item__content{
padding: 14px;
border-radius: 18px;
background: var(--background-white);
}
.modal-map-control-item__header{
display: flex;
align-items: center;
}
.modal-map-control-item__circle{
padding: 2px;
width: 20px;
aspect-ratio: 1;
border-radius: 50%;
background: var(--background-9);
position: relative;
}
.modal-map-control-item__input{
display: none;
}
.modal-map-control-item-circle__content{
width: 16px;
aspect-ratio: 1;
border-radius: 50%;
background: var(--background-white);
}
.modal-map-control__item.active .modal-map-control-item__circle{
background: var(--gradient-blue);
}
.modal-map-control__item.active .modal-map-control-item__circle::before{
content: '';
position: absolute;
top: 4px;
left: 4px;
width: 12px;
aspect-ratio: 1;
border-radius: 50%;
background: var(--gradient-blue);
}
.modal-map-control-item__title{
margin-left: 8px;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-dark);
}
.modal-map-control-item__description{
margin-top: 16px;
}
.modal-map-control-item__time{
font-family: var(--font-family);
font-weight: 500;
font-size: 16px;
line-height: 125%;
color: var(--text-black);
text-align: start;
}
.modal-map-control-item__price{
margin-top: 8px;
font-family: var(--font-family);
font-weight: 700;
font-size: 12px;
line-height: 133%;
color: var(--text-6);
text-align: start;
}
.modal-map__form{
margin-top: 24px;
}
.modal-map-form__hidden{
}
.modal-map-form__button{
margin-top: 83px;
}
.modal-map-form__sub-button{
display: none;
}
.modal-map__right{
padding: 16px 0px 16px 16px;
}
.modal-map__map{
border: 2px solid var(--background-9);
border-radius: 16px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.modal-map__map iframe{
height: 650px;
}
.modal__age{
}
.modal__age > div{
display: none;
}
.modal__age > div.active{
display: flex;
}
/* modal */
/* toggle */
.toggle{
padding-top: 26px;
padding-bottom: 25px;
border-bottom: 1px solid var(--text-3);
position: relative;
}
.toggle::after{
content: '';
position: absolute;
top: 24px;
right: 0;
width: 24px;
aspect-ratio: 1;
background-image: url(../img/svg/main/black-x.svg);
transform: rotate(45deg);
transition: transform .2s;
pointer-events: none;
}
.toggle.active::after{
transform: rotate(0deg);
}
.toggle__title{
padding-right: 30px;
font-family: var(--font-family);
font-weight: 700;
font-size: 16px;
line-height: 125%;
color: var(--text-black);
cursor: pointer;
}
.toggle__block-content{
height: 0;
overflow: hidden;
transition: height .2s ease-out;
}
.toggle__content{
padding-top: 24px;
}
.toggle-content__item{
margin: 12px -12px -12px -12px;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.toggle-content__item:first-child{
margin-top: 0;
}
.toggle-content__element{
margin: 12px;
}
.toggle-content__element--width-perc-100{
width: 100%;
}
.toggle-content__element--width-perc-50{
width: calc(50% - 24px);
}
.toggle__text{
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-black);
}
/* toggle */
/* checkbox */
.checkbox{
display: flex;
align-items: center;
cursor: pointer;
}
.checkbox__state{
border-radius: 4px;
width: 18px;
height: 18px;
border: 2px solid var(--background-black);
background: var(--background-white);
flex-shrink: 0;
}
.checkbox.active .checkbox__state{
background-color: var(--background-black);
background-image: url(../img/svg/main/arrow-selected-white.svg);
background-repeat: no-repeat;
background-position: center;
}
.checkbox__input{
display: none;
}
.checkbox__label{
padding-left: 8px;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-dark);
cursor: pointer;
}
.checkbox__label a{
color: #76ce75;
text-decoration: none;
}
.checkbox--small{
margin-top: 24px;
}
.checkbox--small .checkbox__label{
padding-left: 24px;
font-weight: 500;
font-size: 12px;
line-height: 133%;
}
/* checkbox */
/* radio */
.radio{
display: flex;
align-items: center;
}
.radio__input{
width: 18px;
aspect-ratio: 1;
accent-color: var(--background-black);
cursor: pointer;
}
.radio__label{
padding-left: 8px;
font-family: var(--font-family);
font-weight: 400;
font-size: 20px;
line-height: 120%;
color: var(--text-dark);
cursor: pointer;
}
/* radio */
@keyframes slidein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.subscription{ .subscription{
@ -2230,4 +1422,142 @@ button{
.cabinet-card-order-payment__price span{ .cabinet-card-order-payment__price span{
font-size: 12px; font-size: 12px;
}
.wcsatt-add-to-subscription-wrapper,
form.cart .quantity,
.detail__content .in-stock,
.wcsatt-options-prompt-label-subscription,
.wcsatt-options-product-dropdown {
display: none;
}
.wcsatt-options-product-wrapper {
display: block!important;
}
form.cart .single_add_to_cart_button {
margin: 8px;
min-width: 345.89px;
height: 56px;
padding: 16px 24px 16px 24px;
font-weight: 700;
text-align: center;
position: relative;
background: var(--gradient-turquoise);
border: none;
transition: opacity .2s ease-out;
font-family: var(--font-family);
font-size: 20px;
line-height: 120%;
color: var(--text-black);
border-radius: 20px;
text-transform: none;
cursor: pointer;
}
form.cart .single_add_to_cart_button:hover {
opacity: 0.8;
}
.subscription-option-details span {
color: #000;
cursor: pointer;
}
ul.wcsatt-options-product, .wcsatt-options-product-dropdown {
margin: 0;
}
.wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input {
width: 18px;
aspect-ratio: 1;
accent-color: var(--background-black);
cursor: pointer;
}
.subscription-option label {
display: flex;
align-items: center;
gap: 5px;
}
form.cart {
margin: 25px 0 -48px;
}
ul.wcsatt-options-product--hidden, .wcsatt-options-product-dropdown--hidden {
display: block!important;
}
.detail-block__form{
margin-top: 48px;
display: flex;
flex-direction: column;
}
.wcsatt-options-prompt-text{
font-family: 'Craftwork Grotesk';
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 24px;
text-transform: uppercase;
color: #000000;
}
.subscription-option-details, .wcsatt-options-prompt-action, .subs-text-title{
font-size: 20px;
line-height: 24px;
display:flex;
gap: 12px;
align-items: center;
}
.subs-text{
max-width: 322px;
font-family: 'Craftwork Grotesk';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 20px;
margin-bottom: 20px;
}
input:checked + .subscription-option-details::before, input:checked + .wcsatt-options-prompt-action::before{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='url(%23paint0_radial_11890_46040)' stroke-width='2'/%3E%3Ccircle cx='10' cy='10' r='6' fill='url(%23paint1_radial_11890_46040)'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(19 1) rotate(135) scale(25.4558 34.7538)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3CradialGradient id='paint1_radial_11890_46040' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(16 4) rotate(135) scale(16.9706 23.1692)'%3E%3Cstop stop-color='%23188892'/%3E%3Cstop offset='0.45' stop-color='%231EA49C'/%3E%3Cstop offset='0.9' stop-color='%2376CE75'/%3E%3Cstop offset='1' stop-color='%23BBE38D'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E");
}
.subscription-option-details::before, .wcsatt-options-prompt-action::before{
content: '';
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' fill='white'/%3E%3Cpath d='M1 10C1 5.02944 5.02944 1 10 1C14.9706 1 19 5.02944 19 10C19 14.9706 14.9706 19 10 19C5.02944 19 1 14.9706 1 10Z' stroke='%23121212' stroke-width='2'/%3E%3C/svg%3E");
height: 20px; width: 20px;
}
.wcsatt-options-wrapper input, .wcsatt-add-to-subscription-wrapper input {
aspect-ratio: 1;
accent-color: var(--background-black);
cursor: pointer;
height: 0;
width: 0;
position: absolute;
opacity: 0;
}
.subscription-option .amount {
color: #1A1A1A;
font-weight: 600;
}
.subscription-option del .amount {
color: #bbb;
font-weight: 400;
font-size: .8em;
}
.subscription-option del .woocommerce-Price-amount.amount, .subscription-option del .woocommerce-Price-currencySymbol{
text-decoration: line-through !important;
}
.woocommerce-Price-amount.amount{
font-size: 1.15em;
}
.detail #wc-stripe-express-checkout-element{
display: none !important;
} }

44
wp-content/themes/cosmopet/modules/shop/components/single-product/assets/js/gp-product.js
Unescape View File

@ -107,4 +107,46 @@ const detailCatalot = new Swiper('.detail__catalot', {
}); });
// detail catalog // detail catalog
//
//
//
jQuery(document).ready(function($) {
// Основные радио-кнопки выбора типа покупки
const $oneTimeRadio = $('input[value="no"][name="subscribe-to-action-input"]');
const $subscribeRadio = $('input[value="yes"][name="subscribe-to-action-input"]');
// Все чекбоксы вариантов подписки
const $subscriptionOptions = $('.wcsatt-options-product input[type="radio"]');
// Обработчик для One-time
$oneTimeRadio.on('change', function() {
if ($(this).is(':checked')) {
// Снимаем выделение со всех вариантов подписки
$subscriptionOptions.prop('checked', false);
}
});
// Обработчик для Subscribe
$subscribeRadio.on('change', function() {
if ($(this).is(':checked')) {
// Снимаем выделение с One-time
$oneTimeRadio.prop('checked', false);
// Если ни один вариант подписки не выбран, выбираем первый
if ($subscriptionOptions.filter(':checked').length === 0) {
$subscriptionOptions.first().prop('checked', true);
}
}
});
// Обработчик для вариантов подписки
$subscriptionOptions.on('change', function() {
if ($(this).is(':checked')) {
// Снимаем выделение с One-time
$oneTimeRadio.prop('checked', false);
// Активируем Subscribe
$subscribeRadio.prop('checked', true);
}
});
});

9
wp-content/themes/cosmopet/modules/shop/components/single-product/component-template.twig
Unescape View File

@ -108,14 +108,9 @@
{% endif %} {% endif %}
{% endif %} {% endif %}
<div class="detail-block-form__items">
<a href="?add-to-cart={{ product.id }}" class="button button--gradient button--high add_to_cart_button ajax_add_to_cart" data-product_id="{{ product.id }}" data-quantity="1">
{{ function('pll_e', 'Добавить в корзину') }}
</a> </div>
</form> </form>
{{ function('do_action', 'woocommerce_' ~ product.get_type() ~ '_add_to_cart') }}
<div class="detail__toggle"> <div class="detail__toggle">
<div class="toggle"> <div class="toggle">
<p class="toggle__title"> <p class="toggle__title">

47
wp-content/themes/cosmopet/templates/modal/basket.twig
Unescape View File

@ -15,33 +15,30 @@
</div> </div>
</div> </div>
{% if not fn('WC').cart.is_empty %}
<div class="modal__footer" id="modal-basket-footer"> <div class="modal__footer" id="modal-basket-footer">
<div class="modal__block-price"> {% if not fn('WC').cart.is_empty and fn('WC').cart.get_total('raw') > 0 %}
<p class="modal-block-price__title">{{ __('Total', 'woocommerce') }}</p> <div class="modal__block-price">
<p class="modal-block-price__price"> <p class="modal-block-price__title">{{ __('Total', 'woocommerce') }}</p>
{{ fn('wc_cart_totals_order_total_html') }} <p class="modal-block-price__price">
</p> {{ fn('wc_cart_totals_order_total_html') }}
</div> </p>
</div>
<div class="modal__block-button">
<div class="modal__button"> <div class="modal__block-button">
<a href="{{ fn('wc_get_checkout_url') }}" class="button button--gradient button--high button--100-perc"> <div class="modal__button">
{{ __('Proceed to checkout', 'woocommerce') }} <a href="{{ fn('wc_get_checkout_url') }}" class="button button--gradient button--high button--100-perc proceed-to-checkout">
{{ __('Proceed to checkout', 'woocommerce') }}
</a>
</div>
</div>
{% else %}
<div class="modal__block-button">
<a href="/shop/" class="modal__button">
<button class="to-know button--100-perc to-know--background-none continue-shopping">
<p>{{ __('Continue shopping', 'woocommerce') }}</p>
</button>
</a> </a>
</div> </div>
</div> {% endif %}
</div>
{% else %}
<div class="modal__footer" id="modal-basket-footer">
<div class="modal__block-button">
<a href="/shop/" class="modal__button">
<button class="to-know button--100-perc to-know--background-none continue-shopping">
<p>{{ __('Continue shopping', 'woocommerce') }}</p>
</button>
</a>
</div>
</div> </div>
{% endif %}
</div> </div>

2
wp-content/themes/cosmopet/templates/shop/cart-contents.twig
Unescape View File

@ -1,5 +1,5 @@
{% if cart.is_empty %} {% if cart.is_empty %}
<p class="cart-empty">{{ function('pll_e', 'Ваша корзина пуста') }}</p> <p class="cart-empty">{{ function('pll_e', 'Your cart is empty') }}</p>
{% else %} {% else %}
{% for item_key, item in cart.get_cart %} {% for item_key, item in cart.get_cart %}
{% set product = item.data %} {% set product = item.data %}

Write Preview
Loading…
Cancel
Save