This commit is contained in:
2026-04-19 16:50:40 +03:00
parent ab788c762c
commit c19df05b57
8 changed files with 231 additions and 487 deletions

BIN
2026-04-19_16-19-23.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 118 KiB

BIN
2026-04-19_16-24-26.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 450 KiB

View File

@@ -1306,7 +1306,6 @@
line-height: 1.7; line-height: 1.7;
} }
.cart-drawer,
.modal-backdrop { .modal-backdrop {
position: fixed; position: fixed;
inset: 0; inset: 0;
@@ -1316,13 +1315,11 @@
transition: opacity 0.24s ease; transition: opacity 0.24s ease;
} }
.cart-drawer.open,
.modal-backdrop.open { .modal-backdrop.open {
pointer-events: auto; pointer-events: auto;
opacity: 1; opacity: 1;
} }
.cart-drawer::before,
.modal-backdrop::before { .modal-backdrop::before {
content: ""; content: "";
position: absolute; position: absolute;
@@ -1331,7 +1328,6 @@
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
} }
.cart-panel,
.modal-card { .modal-card {
position: absolute; position: absolute;
background: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.94);
@@ -1340,23 +1336,6 @@
backdrop-filter: blur(24px); backdrop-filter: blur(24px);
} }
.cart-panel {
top: 0;
right: 0;
width: min(440px, 100%);
height: 100%;
padding: 22px;
display: grid;
grid-template-rows: auto auto 1fr auto;
gap: 16px;
transform: translateX(100%);
transition: transform 0.28s ease;
}
.cart-drawer.open .cart-panel {
transform: translateX(0);
}
.modal-card { .modal-card {
top: 50%; top: 50%;
left: 50%; left: 50%;
@@ -1371,7 +1350,6 @@
transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1);
} }
.drawer-head,
.modal-head { .modal-head {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -1379,7 +1357,6 @@
align-items: start; align-items: start;
} }
.drawer-head h3,
.modal-head h3 { .modal-head h3 {
margin: 0; margin: 0;
font-size: 28px; font-size: 28px;
@@ -1403,84 +1380,6 @@
font-weight: 800; font-weight: 800;
} }
.cart-list {
display: grid;
align-content: start;
gap: 12px;
overflow: auto;
padding-right: 4px;
}
.cart-item {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 14px;
padding: 16px;
border-radius: 20px;
background: rgba(255, 255, 255, 0.76);
border: 1px solid rgba(18, 48, 89, 0.08);
}
.cart-item strong {
display: block;
margin-bottom: 6px;
}
.cart-item span {
color: var(--muted);
font-size: 14px;
}
.cart-item button {
justify-self: end;
color: #d53b5c;
font-weight: 800;
}
.cart-summary {
display: grid;
gap: 12px;
padding: 18px;
border-radius: 22px;
background: linear-gradient(135deg, rgba(13, 79, 214, 0.08), rgba(60, 200, 255, 0.12));
border: 1px solid rgba(18, 48, 89, 0.08);
}
.summary-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
font-weight: 700;
}
.summary-row strong {
font-size: 28px;
color: var(--primary-strong);
}
.cart-actions {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.cart-actions .ghost-button,
.cart-actions .button {
justify-content: center;
text-align: center;
}
.empty-state {
padding: 20px;
border-radius: 22px;
background: rgba(255, 255, 255, 0.72);
border: 1px dashed rgba(18, 48, 89, 0.14);
text-align: center;
color: var(--muted);
line-height: 1.7;
}
.success-note { .success-note {
display: none; display: none;
margin-top: 14px; margin-top: 14px;
@@ -1627,9 +1526,6 @@
grid-column: auto; grid-column: auto;
} }
.cart-actions {
grid-template-columns: 1fr;
}
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,34 +1,16 @@
const mobileToggle = document.getElementById('mobileToggle') const mobileToggle = document.getElementById('mobileToggle')
const mobilePanel = document.getElementById('mobilePanel') const mobilePanel = document.getElementById('mobilePanel')
const cartDrawer = document.getElementById('cartDrawer')
const cartOpenButton = document.getElementById('cartOpenButton')
const mobileCartOpenButton = document.getElementById('mobileCartOpenButton')
const cartCloseButton = document.getElementById('cartCloseButton')
const modalBackdrop = document.getElementById('orderModal') const modalBackdrop = document.getElementById('orderModal')
const modalCloseButton = document.getElementById('modalCloseButton') const modalCloseButton = document.getElementById('modalCloseButton')
const viewCartButton = document.getElementById('viewCartButton')
const checkoutButton = document.getElementById('checkoutButton')
const orderButtons = document.querySelectorAll('[data-open-order]') const orderButtons = document.querySelectorAll('[data-open-order]')
const addToCartButtons = document.querySelectorAll('.add-to-cart')
const faqItems = document.querySelectorAll('.faq-item') const faqItems = document.querySelectorAll('.faq-item')
const cartCount = document.getElementById('cartCount')
const mobileCartCount = document.getElementById('mobileCartCount')
const cartItemsCount = document.getElementById('cartItemsCount')
const cartTotal = document.getElementById('cartTotal')
const cartList = document.getElementById('cartList')
const orderForm = document.getElementById('orderForm') const orderForm = document.getElementById('orderForm')
const contactForm = document.getElementById('contactForm') const contactForm = document.getElementById('contactForm')
const orderItemsField = document.getElementById('orderItemsField') const orderItemsField = document.getElementById('orderItemsField')
const orderSuccess = document.getElementById('orderSuccess') const orderSuccess = document.getElementById('orderSuccess')
const contactSuccess = document.getElementById('contactSuccess') const contactSuccess = document.getElementById('contactSuccess')
const wooCommerceConfig = window.test1WooCommerce || null
const cartPageUrl = (wooCommerceConfig && wooCommerceConfig.cartUrl) ? wooCommerceConfig.cartUrl : '/cart/'
const checkoutPageUrl = (wooCommerceConfig && wooCommerceConfig.checkoutUrl) ? wooCommerceConfig.checkoutUrl : '/checkout/'
const cartPanel = cartDrawer?.querySelector('.cart-panel')
const modalCard = modalBackdrop?.querySelector('.modal-card') const modalCard = modalBackdrop?.querySelector('.modal-card')
let cart = []
let lastCartTrigger = null
let lastModalTrigger = null let lastModalTrigger = null
const getFocusableElements = container => { const getFocusableElements = container => {
@@ -49,43 +31,36 @@ const mobileToggle = document.getElementById('mobileToggle')
} }
const openMobileMenu = () => { const openMobileMenu = () => {
if (!mobilePanel || !mobileToggle) {
return
}
mobilePanel.classList.add('active') mobilePanel.classList.add('active')
mobileToggle.setAttribute('aria-expanded', 'true') mobileToggle.setAttribute('aria-expanded', 'true')
document.body.classList.add('menu-open') document.body.classList.add('menu-open')
} }
const closeMobileMenu = () => { const closeMobileMenu = () => {
if (!mobilePanel || !mobileToggle) {
return
}
mobilePanel.classList.remove('active') mobilePanel.classList.remove('active')
mobileToggle.setAttribute('aria-expanded', 'false') mobileToggle.setAttribute('aria-expanded', 'false')
document.body.classList.remove('menu-open') document.body.classList.remove('menu-open')
} }
const openCart = triggerElement => {
lastCartTrigger = triggerElement || document.activeElement
cartDrawer.classList.add('open')
cartDrawer.setAttribute('aria-hidden', 'false')
document.body.classList.add('modal-open')
focusFirstElement(cartPanel)
}
const closeCart = () => {
const shouldRestoreFocus = cartDrawer.classList.contains('open')
cartDrawer.classList.remove('open')
cartDrawer.setAttribute('aria-hidden', 'true')
document.body.classList.remove('modal-open')
if (shouldRestoreFocus && lastCartTrigger && typeof lastCartTrigger.focus === 'function') {
lastCartTrigger.focus()
}
lastCartTrigger = null
}
const openModal = triggerElement => { const openModal = triggerElement => {
if (!modalBackdrop) {
return
}
lastModalTrigger = triggerElement || document.activeElement lastModalTrigger = triggerElement || document.activeElement
orderItemsField.value = cart.length
? cart.map(item => `${item.name} (${item.volume}) - ${item.price}`).join('\n') if (orderItemsField) {
: '' orderItemsField.value = ''
}
modalBackdrop.classList.add('open') modalBackdrop.classList.add('open')
modalBackdrop.setAttribute('aria-hidden', 'false') modalBackdrop.setAttribute('aria-hidden', 'false')
document.body.classList.add('modal-open') document.body.classList.add('modal-open')
@@ -93,7 +68,12 @@ const mobileToggle = document.getElementById('mobileToggle')
} }
const closeModal = () => { const closeModal = () => {
if (!modalBackdrop) {
return
}
const shouldRestoreFocus = modalBackdrop.classList.contains('open') const shouldRestoreFocus = modalBackdrop.classList.contains('open')
modalBackdrop.classList.remove('open') modalBackdrop.classList.remove('open')
modalBackdrop.setAttribute('aria-hidden', 'true') modalBackdrop.setAttribute('aria-hidden', 'true')
document.body.classList.remove('modal-open') document.body.classList.remove('modal-open')
@@ -105,39 +85,6 @@ const mobileToggle = document.getElementById('mobileToggle')
lastModalTrigger = null lastModalTrigger = null
} }
const renderCart = () => {
const total = cart.reduce((sum, item) => sum + item.price, 0)
const count = cart.length
cartCount.textContent = count
mobileCartCount.textContent = count
cartItemsCount.textContent = count
cartTotal.textContent = `${total}`
if (!count) {
cartList.innerHTML = '<div class="empty-state">Корзина пока пуста. Добавьте воду 19 литров, компактные форматы или минеральную воду из каталога.</div>'
return
}
cartList.innerHTML = cart.map((item, index) => `
<div class="cart-item">
<div>
<strong>${item.name}</strong>
<span>${item.volume} · ${item.price} ₽</span>
</div>
<button type="button" data-remove-index="${index}" aria-label="Удалить ${item.name} из корзины">Удалить</button>
</div>
`).join('')
cartList.querySelectorAll('[data-remove-index]').forEach(button => {
button.addEventListener('click', () => {
const index = Number(button.dataset.removeIndex)
cart.splice(index, 1)
renderCart()
})
})
}
const submitLeadForm = (formElement, successElement, formType, onSuccess) => { const submitLeadForm = (formElement, successElement, formType, onSuccess) => {
if (!formElement || !successElement) { if (!formElement || !successElement) {
return return
@@ -187,110 +134,38 @@ const mobileToggle = document.getElementById('mobileToggle')
}) })
} }
if (mobileToggle && mobilePanel) {
mobileToggle.addEventListener('click', () => { mobileToggle.addEventListener('click', () => {
const isOpen = mobilePanel.classList.contains('active') const isOpen = mobilePanel.classList.contains('active')
if (isOpen) { if (isOpen) {
closeMobileMenu() closeMobileMenu()
return return
} }
openMobileMenu() openMobileMenu()
}) })
document.querySelectorAll('.mobile-nav a').forEach(link => { document.querySelectorAll('.mobile-nav a').forEach(link => {
link.addEventListener('click', closeMobileMenu) link.addEventListener('click', closeMobileMenu)
}) })
addToCartButtons.forEach(button => {
button.addEventListener('click', () => {
const productId = Number(button.dataset.productId || 0)
if (wooCommerceConfig && productId && wooCommerceConfig.addToCartUrl && wooCommerceConfig.checkoutUrl) {
button.disabled = true
fetch(wooCommerceConfig.addToCartUrl, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
},
body: new URLSearchParams({
product_id: String(productId),
quantity: '1'
})
})
.then(async response => {
let payload = null
try {
payload = await response.json()
} catch (error) {
payload = null
} }
if (!response.ok) {
throw new Error('add_to_cart_failed')
}
if (payload && payload.error && payload.product_url) {
window.location.href = payload.product_url
return
}
cart.push({
name: button.dataset.name,
volume: button.dataset.volume,
price: Number(button.dataset.price)
})
renderCart()
openCart(button)
button.disabled = false
})
.catch(() => {
button.disabled = false
})
return
}
cart.push({
name: button.dataset.name,
volume: button.dataset.volume,
price: Number(button.dataset.price)
})
renderCart()
openCart(button)
})
})
cartOpenButton.addEventListener('click', () => openCart(cartOpenButton))
mobileCartOpenButton.addEventListener('click', () => {
closeMobileMenu()
openCart(mobileCartOpenButton)
})
cartCloseButton.addEventListener('click', closeCart)
viewCartButton.addEventListener('click', () => {
window.location.href = cartPageUrl
})
checkoutButton.addEventListener('click', () => {
window.location.href = checkoutPageUrl
})
orderButtons.forEach(button => { orderButtons.forEach(button => {
button.addEventListener('click', () => openModal(button)) button.addEventListener('click', () => openModal(button))
}) })
if (modalCloseButton) {
modalCloseButton.addEventListener('click', closeModal) modalCloseButton.addEventListener('click', closeModal)
cartDrawer.addEventListener('click', event => {
if (event.target === cartDrawer) {
closeCart()
} }
})
if (modalBackdrop) {
modalBackdrop.addEventListener('click', event => { modalBackdrop.addEventListener('click', event => {
if (event.target === modalBackdrop) { if (event.target === modalBackdrop) {
closeModal() closeModal()
} }
}) })
}
faqItems.forEach(item => { faqItems.forEach(item => {
const trigger = item.querySelector('.faq-question') const trigger = item.querySelector('.faq-question')
@@ -302,6 +177,7 @@ const mobileToggle = document.getElementById('mobileToggle')
trigger.addEventListener('click', () => { trigger.addEventListener('click', () => {
const isOpen = item.classList.contains('open') const isOpen = item.classList.contains('open')
faqItems.forEach(entry => { faqItems.forEach(entry => {
const entryTrigger = entry.querySelector('.faq-question') const entryTrigger = entry.querySelector('.faq-question')
const entryAnswer = entry.querySelector('.faq-answer') const entryAnswer = entry.querySelector('.faq-answer')
@@ -313,6 +189,7 @@ const mobileToggle = document.getElementById('mobileToggle')
entryAnswer.hidden = true entryAnswer.hidden = true
} }
}) })
if (!isOpen) { if (!isOpen) {
item.classList.add('open') item.classList.add('open')
trigger.setAttribute('aria-expanded', 'true') trigger.setAttribute('aria-expanded', 'true')
@@ -322,8 +199,6 @@ const mobileToggle = document.getElementById('mobileToggle')
}) })
submitLeadForm(orderForm, orderSuccess, 'landing_order', () => { submitLeadForm(orderForm, orderSuccess, 'landing_order', () => {
cart = []
renderCart()
setTimeout(() => { setTimeout(() => {
closeModal() closeModal()
}, 700) }, 700)
@@ -335,9 +210,7 @@ const mobileToggle = document.getElementById('mobileToggle')
if (event.key !== 'Escape') { if (event.key !== 'Escape') {
return return
} }
closeCart()
closeModal() closeModal()
closeMobileMenu() closeMobileMenu()
}) })
renderCart()

View File

@@ -503,17 +503,6 @@ function twentytwentyfour_test1_assets() {
) )
); );
if ( class_exists( 'WooCommerce' ) ) {
wp_localize_script(
'twentytwentyfour-test1-script',
'test1WooCommerce',
array(
'addToCartUrl' => WC_AJAX::get_endpoint( 'add_to_cart' ),
'cartUrl' => wc_get_cart_url(),
'checkoutUrl' => wc_get_checkout_url(),
)
);
}
} }
if ( is_page( 'faq' ) ) { if ( is_page( 'faq' ) ) {

View File

@@ -50,6 +50,8 @@ function twentytwentyfour_test1_catalog_markup() {
if ( '' === $volume ) { if ( '' === $volume ) {
$volume = __( 'Товар', 'twentytwentyfour' ); $volume = __( 'Товар', 'twentytwentyfour' );
} }
$add_to_cart_url = $product->add_to_cart_url();
$add_to_cart_text = $product->add_to_cart_text();
?> ?>
<article class="catalog-card reveal<?php echo esc_attr( $delay_class ); ?>"> <article class="catalog-card reveal<?php echo esc_attr( $delay_class ); ?>">
<?php if ( $image_html ) : ?> <?php if ( $image_html ) : ?>
@@ -66,14 +68,18 @@ function twentytwentyfour_test1_catalog_markup() {
<?php endif; ?> <?php endif; ?>
</div> </div>
<div class="card-price"><strong><?php echo esc_html( $price ); ?></strong></div> <div class="card-price"><strong><?php echo esc_html( $price ); ?></strong></div>
<button <?php if ( $product->is_purchasable() && $product->is_in_stock() ) : ?>
class="mini-button add-to-cart" <a
data-product-id="<?php echo esc_attr( (string) $product->get_id() ); ?>" class="mini-button add_to_cart_button product_type_<?php echo esc_attr( $product->get_type() ); ?>"
data-name="<?php echo esc_attr( $product->get_name() ); ?>" href="<?php echo esc_url( $add_to_cart_url ); ?>"
data-volume="<?php echo esc_attr( $volume ); ?>" data-product_id="<?php echo esc_attr( (string) $product->get_id() ); ?>"
data-price="<?php echo esc_attr( (string) wc_get_price_to_display( $product ) ); ?>" data-quantity="1"
type="button" rel="nofollow"
><?php esc_html_e( 'Добавить в корзину', 'twentytwentyfour' ); ?></button> aria-label="<?php echo esc_attr( sprintf( __( 'Добавить в корзину: %s', 'twentytwentyfour' ), $product->get_name() ) ); ?>"
><?php echo esc_html( $add_to_cart_text ); ?></a>
<?php else : ?>
<a class="mini-button" href="<?php echo esc_url( get_permalink( $product->get_id() ) ); ?>"><?php esc_html_e( 'Подробнее', 'twentytwentyfour' ); ?></a>
<?php endif; ?>
</article> </article>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
@@ -183,7 +189,7 @@ get_header( 'test1' );
<span class="chip">для кулера</span> <span class="chip">для кулера</span>
</div> </div>
<div class="card-price"><strong>290 ₽</strong><span>за бутыль</span></div> <div class="card-price"><strong>290 ₽</strong><span>за бутыль</span></div>
<button class="mini-button add-to-cart" data-name="Вода артезианская 19 л" data-volume="19 л" data-price="290">Добавить в корзину</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</article> </article>
<article class="catalog-card reveal reveal-delay-1"> <article class="catalog-card reveal reveal-delay-1">
@@ -195,7 +201,7 @@ get_header( 'test1' );
<span class="chip">компактно</span> <span class="chip">компактно</span>
</div> </div>
<div class="card-price"><strong>95 ₽</strong><span>за бутылку</span></div> <div class="card-price"><strong>95 ₽</strong><span>за бутылку</span></div>
<button class="mini-button add-to-cart" data-name="Питьевая вода 5 л" data-volume="5 л" data-price="95">Добавить в корзину</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</article> </article>
<article class="catalog-card reveal reveal-delay-2"> <article class="catalog-card reveal reveal-delay-2">
@@ -207,7 +213,7 @@ get_header( 'test1' );
<span class="chip">мероприятия</span> <span class="chip">мероприятия</span>
</div> </div>
<div class="card-price"><strong>39 ₽</strong><span>от 0.5 л</span></div> <div class="card-price"><strong>39 ₽</strong><span>от 0.5 л</span></div>
<button class="mini-button add-to-cart" data-name="Питьевая вода 1.5 л" data-volume="1.5 л" data-price="49">Добавить в корзину</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</article> </article>
<article class="catalog-card reveal reveal-delay-3"> <article class="catalog-card reveal reveal-delay-3">
@@ -219,7 +225,7 @@ get_header( 'test1' );
<span class="chip">рестораны</span> <span class="chip">рестораны</span>
</div> </div>
<div class="card-price"><strong>68 ₽</strong><span>за 1.5 л</span></div> <div class="card-price"><strong>68 ₽</strong><span>за 1.5 л</span></div>
<button class="mini-button add-to-cart" data-name="Минеральная вода 1.5 л" data-volume="1.5 л" data-price="68">Добавить в корзину</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</article> </article>
<article class="catalog-card reveal reveal-delay-4"> <article class="catalog-card reveal reveal-delay-4">
@@ -231,7 +237,7 @@ get_header( 'test1' );
<span class="chip">на выбор</span> <span class="chip">на выбор</span>
</div> </div>
<div class="card-price"><strong>45 ₽</strong><span>за 0.5 л</span></div> <div class="card-price"><strong>45 ₽</strong><span>за 0.5 л</span></div>
<button class="mini-button add-to-cart" data-name="Газированная вода 0.5 л" data-volume="0.5 л" data-price="45">Добавить в корзину</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</article> </article>
</div> </div>
<?php <?php
@@ -263,7 +269,7 @@ get_header( 'test1' );
<span>19 л, мягкий вкус, ежедневное потребление</span> <span>19 л, мягкий вкус, ежедневное потребление</span>
</div> </div>
<div class="price">290 ₽</div> <div class="price">290 ₽</div>
<button class="mini-button add-to-cart" data-name="АкваЛиния Классик" data-volume="19 л" data-price="290">Заказать</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</div> </div>
<div class="product-row"> <div class="product-row">
<div> <div>
@@ -271,7 +277,7 @@ get_header( 'test1' );
<span>19 л, артезианская вода, усиленный контроль</span> <span>19 л, артезианская вода, усиленный контроль</span>
</div> </div>
<div class="price">340 ₽</div> <div class="price">340 ₽</div>
<button class="mini-button add-to-cart" data-name="АкваЛиния Премиум" data-volume="19 л" data-price="340">Заказать</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</div> </div>
<div class="product-row"> <div class="product-row">
<div> <div>
@@ -279,7 +285,7 @@ get_header( 'test1' );
<span>2 бутыли 19 л + помпа для первого заказа</span> <span>2 бутыли 19 л + помпа для первого заказа</span>
</div> </div>
<div class="price">690 ₽</div> <div class="price">690 ₽</div>
<button class="mini-button add-to-cart" data-name="Стартовый комплект 19 л + помпа" data-volume="2 x 19 л" data-price="690">Заказать</button> <a class="mini-button" href="<?php echo esc_url( home_url( '/shop/' ) ); ?>">В каталог</a>
</div> </div>
</div> </div>
</div> </div>
@@ -687,32 +693,6 @@ get_header( 'test1' );
</section> </section>
</main> </main>
<div class="cart-drawer" id="cartDrawer" aria-hidden="true">
<div class="cart-panel" role="dialog" aria-modal="true" aria-labelledby="cartTitle">
<div class="drawer-head">
<div>
<h3 id="cartTitle">Корзина</h3>
<p class="dialog-copy">Проверьте состав заказа и переходите к оформлению.</p>
</div>
<button class="close-button" id="cartCloseButton" aria-label="Закрыть корзину">×</button>
</div>
<div class="cart-summary">
<div class="summary-row"><span>Товаров</span><span id="cartItemsCount" aria-live="polite" aria-atomic="true">0</span></div>
<div class="summary-row"><span>Сумма</span><strong id="cartTotal" aria-live="polite" aria-atomic="true">0 ₽</strong></div>
</div>
<div class="cart-list" id="cartList">
<div class="empty-state">Корзина пока пуста. Добавьте нужные позиции из каталога и переходите к оформлению.</div>
</div>
<div class="cart-actions">
<button class="ghost-button" id="viewCartButton">Смотреть корзину</button>
<button class="button" id="checkoutButton">Оформить заказ</button>
</div>
</div>
</div>
<div class="modal-backdrop" id="orderModal" aria-hidden="true"> <div class="modal-backdrop" id="orderModal" aria-hidden="true">
<div class="modal-card" role="dialog" aria-modal="true" aria-labelledby="orderModalTitle"> <div class="modal-card" role="dialog" aria-modal="true" aria-labelledby="orderModalTitle">
<div class="modal-head"> <div class="modal-head">

View File

@@ -10,6 +10,12 @@ $test1_header_action_label = isset( $test1_header_action_label ) ? $test1_header
$test1_header_mode = isset( $test1_header_mode ) ? $test1_header_mode : 'link'; $test1_header_mode = isset( $test1_header_mode ) ? $test1_header_mode : 'link';
$posts_page_id = (int) get_option( 'page_for_posts' ); $posts_page_id = (int) get_option( 'page_for_posts' );
$blog_url = $posts_page_id > 0 ? get_permalink( $posts_page_id ) : home_url( '/blog/' ); $blog_url = $posts_page_id > 0 ? get_permalink( $posts_page_id ) : home_url( '/blog/' );
$cart_url = function_exists( 'wc_get_cart_url' ) ? wc_get_cart_url() : home_url( '/cart/' );
$cart_count = 0;
if ( function_exists( 'WC' ) && WC()->cart ) {
$cart_count = (int) WC()->cart->get_cart_contents_count();
}
if ( ! $blog_url ) { if ( ! $blog_url ) {
$blog_url = home_url( '/blog/' ); $blog_url = home_url( '/blog/' );
@@ -47,10 +53,10 @@ $blog_is_active = is_home() || is_singular( 'post' ) || is_category() || is_tag(
<span aria-hidden="true">+7 (911) 774-89-23</span> <span aria-hidden="true">+7 (911) 774-89-23</span>
</a> </a>
<?php if ( 'cart' === $test1_header_mode ) : ?> <?php if ( 'cart' === $test1_header_mode ) : ?>
<button class="cart-button" id="cartOpenButton" aria-label="Открыть корзину"> <a class="cart-button" href="<?php echo esc_url( $cart_url ); ?>" aria-label="Перейти в корзину">
<span aria-hidden="true">Корзина</span> <span aria-hidden="true">Корзина</span>
<span class="cart-count" id="cartCount" aria-live="polite" aria-atomic="true">0</span> <span class="cart-count" aria-live="polite" aria-atomic="true"><?php echo esc_html( (string) $cart_count ); ?></span>
</button> </a>
<button class="mobile-toggle" id="mobileToggle" aria-label="Открыть меню" aria-expanded="false" aria-controls="mobilePanel"> <button class="mobile-toggle" id="mobileToggle" aria-label="Открыть меню" aria-expanded="false" aria-controls="mobilePanel">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"> <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path d="M4 7H20" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> <path d="M4 7H20" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
@@ -76,10 +82,10 @@ $blog_is_active = is_home() || is_singular( 'post' ) || is_category() || is_tag(
<a href="<?php echo esc_url( home_url( '/contacts/' ) ); ?>">Контакты</a> <a href="<?php echo esc_url( home_url( '/contacts/' ) ); ?>">Контакты</a>
</nav> </nav>
<a class="header-phone" href="tel:+79117748923">+7 (911) 774-89-23</a> <a class="header-phone" href="tel:+79117748923">+7 (911) 774-89-23</a>
<button class="cart-button" id="mobileCartOpenButton" aria-label="Открыть корзину с мобильного меню"> <a class="cart-button" href="<?php echo esc_url( $cart_url ); ?>" aria-label="Перейти в корзину с мобильного меню">
<span>Корзина</span> <span>Корзина</span>
<span class="cart-count" id="mobileCartCount" aria-live="polite" aria-atomic="true">0</span> <span class="cart-count" aria-live="polite" aria-atomic="true"><?php echo esc_html( (string) $cart_count ); ?></span>
</button> </a>
</div> </div>
</div> </div>
<?php endif; ?> <?php endif; ?>