Traderdimages.fr

jQuery(function($) {

    const QUANTITY_INPUT_SELECTOR = '.quantity input.qty';
    const PLUS_BUTTON_SELECTOR = '.plus-btn';
    const MINUS_BUTTON_SELECTOR = '.minus-btn';

    let singleItemPrice = 0;

    function initializePrice() {
        const totalElement = $('#newTotal');
        if (totalElement.length && totalElement.text().trim() !== '') {
            const initialPriceText = totalElement.text().replace(/[^0-9.,]/g, '').replace(',', '.');
            singleItemPrice = parseFloat(initialPriceText);
        }
    }

    function updateTotalPrice() {
        const quantityInput = $(QUANTITY_INPUT_SELECTOR);
        const totalElement = $('#newTotal');

        if (quantityInput.length === 0 || totalElement.length === 0 || singleItemPrice === 0) {
            return;
        }

        const currencySymbol = totalElement.parent().find('.woocommerce-Price-currencySymbol').prop('outerHTML') || '€';
        const quantity = parseInt(quantityInput.val());
        const validQuantity = isNaN(quantity) ? 1 : quantity;
        const newTotal = singleItemPrice * validQuantity;
        const newPriceString = newTotal.toFixed(1).replace('.', ',');

        totalElement.html(`${newPriceString} ${currencySymbol}`);
    }

    $('.variations_form').on('found_variation', function(event, variation) {
        singleItemPrice = variation.display_price;
        updateTotalPrice();
    });

    $('body').on('input click', `${QUANTITY_INPUT_SELECTOR}, ${PLUS_BUTTON_SELECTOR}, ${MINUS_BUTTON_SELECTOR}`, function() {
        setTimeout(updateTotalPrice, 50);
    });

    initializePrice();
});
  

    <?php
}
>

.woocommerce div.product form.cart div.quantity {
	display: flex !important;
	border-radius: 20px;
	width: 250px;
	background-color: #f8f5f1;
	align-self: center;
	margin: 0px 0px 15px 0px !important;
}

.woocommerce .quantity input.qty, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
	background-color: #f8f5f1;
}

.et-db #et-boc .et-l .et_pb_wc_add_to_cart .quantity input.qty {
	max-width: none;
	width: 100%;
	order: 2;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.minus-btn {
	order: 0;
	align-self: center;
	border-radius: 10px;
	border-color: #000000;
	border-width: 2px;
	margin: 5px;
	padding: 5px 10px 5px 10px;
}

.plus-btn {
	order: 3;
	align-self: center;
	border-radius: 10px;
	border-color: #000000;
	border-width: 2px;
	margin: 5px;
	padding: 5px 10px 5px 10px;
}

.quantity-label {
	margin-bottom: none;
	order: 1;
	white-space: nowrap;
	align-self: center;
	margin-left: 10px;
}