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

View File

@@ -1306,7 +1306,6 @@
line-height: 1.7;
}
.cart-drawer,
.modal-backdrop {
position: fixed;
inset: 0;
@@ -1316,13 +1315,11 @@
transition: opacity 0.24s ease;
}
.cart-drawer.open,
.modal-backdrop.open {
pointer-events: auto;
opacity: 1;
}
.cart-drawer::before,
.modal-backdrop::before {
content: "";
position: absolute;
@@ -1331,7 +1328,6 @@
backdrop-filter: blur(10px);
}
.cart-panel,
.modal-card {
position: absolute;
background: rgba(255, 255, 255, 0.94);
@@ -1340,23 +1336,6 @@
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 {
top: 50%;
left: 50%;
@@ -1371,7 +1350,6 @@
transform: translate(-50%, -50%) scale(1);
}
.drawer-head,
.modal-head {
display: flex;
justify-content: space-between;
@@ -1379,7 +1357,6 @@
align-items: start;
}
.drawer-head h3,
.modal-head h3 {
margin: 0;
font-size: 28px;
@@ -1403,84 +1380,6 @@
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 {
display: none;
margin-top: 14px;
@@ -1627,9 +1526,6 @@
grid-column: auto;
}
.cart-actions {
grid-template-columns: 1fr;
}
}
@media (prefers-reduced-motion: reduce) {

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1,343 +1,216 @@
const mobileToggle = document.getElementById('mobileToggle')
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 modalCloseButton = document.getElementById('modalCloseButton')
const viewCartButton = document.getElementById('viewCartButton')
const checkoutButton = document.getElementById('checkoutButton')
const orderButtons = document.querySelectorAll('[data-open-order]')
const addToCartButtons = document.querySelectorAll('.add-to-cart')
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 contactForm = document.getElementById('contactForm')
const orderItemsField = document.getElementById('orderItemsField')
const orderSuccess = document.getElementById('orderSuccess')
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 mobilePanel = document.getElementById('mobilePanel')
const modalBackdrop = document.getElementById('orderModal')
const modalCloseButton = document.getElementById('modalCloseButton')
const orderButtons = document.querySelectorAll('[data-open-order]')
const faqItems = document.querySelectorAll('.faq-item')
const orderForm = document.getElementById('orderForm')
const contactForm = document.getElementById('contactForm')
const orderItemsField = document.getElementById('orderItemsField')
const orderSuccess = document.getElementById('orderSuccess')
const contactSuccess = document.getElementById('contactSuccess')
const modalCard = modalBackdrop?.querySelector('.modal-card')
let cart = []
let lastCartTrigger = null
let lastModalTrigger = null
let lastModalTrigger = null
const getFocusableElements = container => {
if (!container) {
return []
}
const getFocusableElements = container => {
if (!container) {
return []
}
return Array.from(container.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])'))
.filter(element => !element.hasAttribute('hidden') && !element.closest('[hidden]'))
return Array.from(container.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])'))
.filter(element => !element.hasAttribute('hidden') && !element.closest('[hidden]'))
}
const focusFirstElement = container => {
const [first] = getFocusableElements(container)
if (first) {
first.focus()
}
}
const openMobileMenu = () => {
if (!mobilePanel || !mobileToggle) {
return
}
mobilePanel.classList.add('active')
mobileToggle.setAttribute('aria-expanded', 'true')
document.body.classList.add('menu-open')
}
const closeMobileMenu = () => {
if (!mobilePanel || !mobileToggle) {
return
}
mobilePanel.classList.remove('active')
mobileToggle.setAttribute('aria-expanded', 'false')
document.body.classList.remove('menu-open')
}
const openModal = triggerElement => {
if (!modalBackdrop) {
return
}
lastModalTrigger = triggerElement || document.activeElement
if (orderItemsField) {
orderItemsField.value = ''
}
modalBackdrop.classList.add('open')
modalBackdrop.setAttribute('aria-hidden', 'false')
document.body.classList.add('modal-open')
focusFirstElement(modalCard)
}
const closeModal = () => {
if (!modalBackdrop) {
return
}
const shouldRestoreFocus = modalBackdrop.classList.contains('open')
modalBackdrop.classList.remove('open')
modalBackdrop.setAttribute('aria-hidden', 'true')
document.body.classList.remove('modal-open')
if (shouldRestoreFocus && lastModalTrigger && typeof lastModalTrigger.focus === 'function') {
lastModalTrigger.focus()
}
lastModalTrigger = null
}
const submitLeadForm = (formElement, successElement, formType, onSuccess) => {
if (!formElement || !successElement) {
return
}
formElement.addEventListener('submit', async event => {
event.preventDefault()
const leadFormConfig = window.test1LeadForm || null
if (!leadFormConfig?.ajaxUrl || !leadFormConfig?.action || !leadFormConfig?.nonce) {
window.alert('Форма временно недоступна. Обновите страницу и попробуйте снова.')
return
}
const focusFirstElement = container => {
const [first] = getFocusableElements(container)
const formData = new window.FormData(formElement)
formData.append('action', leadFormConfig.action)
formData.append('nonce', leadFormConfig.nonce)
formData.append('form_type', formType)
formData.append('page_url', window.location.href)
if (first) {
first.focus()
}
}
const openMobileMenu = () => {
mobilePanel.classList.add('active')
mobileToggle.setAttribute('aria-expanded', 'true')
document.body.classList.add('menu-open')
}
const closeMobileMenu = () => {
mobilePanel.classList.remove('active')
mobileToggle.setAttribute('aria-expanded', 'false')
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 => {
lastModalTrigger = triggerElement || document.activeElement
orderItemsField.value = cart.length
? cart.map(item => `${item.name} (${item.volume}) - ${item.price}`).join('\n')
: ''
modalBackdrop.classList.add('open')
modalBackdrop.setAttribute('aria-hidden', 'false')
document.body.classList.add('modal-open')
focusFirstElement(modalCard)
}
const closeModal = () => {
const shouldRestoreFocus = modalBackdrop.classList.contains('open')
modalBackdrop.classList.remove('open')
modalBackdrop.setAttribute('aria-hidden', 'true')
document.body.classList.remove('modal-open')
if (shouldRestoreFocus && lastModalTrigger && typeof lastModalTrigger.focus === 'function') {
lastModalTrigger.focus()
}
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()
})
try {
const response = await window.fetch(leadFormConfig.ajaxUrl, {
method: 'POST',
credentials: 'same-origin',
body: formData,
})
}
const submitLeadForm = (formElement, successElement, formType, onSuccess) => {
if (!formElement || !successElement) {
return
const payload = await response.json().catch(() => null)
if (!response.ok || !payload?.success) {
throw new Error('submit_failed')
}
formElement.addEventListener('submit', async event => {
event.preventDefault()
const leadFormConfig = window.test1LeadForm || null
if (!leadFormConfig?.ajaxUrl || !leadFormConfig?.action || !leadFormConfig?.nonce) {
window.alert('Форма временно недоступна. Обновите страницу и попробуйте снова.')
return
}
const formData = new window.FormData(formElement)
formData.append('action', leadFormConfig.action)
formData.append('nonce', leadFormConfig.nonce)
formData.append('form_type', formType)
formData.append('page_url', window.location.href)
try {
const response = await window.fetch(leadFormConfig.ajaxUrl, {
method: 'POST',
credentials: 'same-origin',
body: formData,
})
const payload = await response.json().catch(() => null)
if (!response.ok || !payload?.success) {
throw new Error('submit_failed')
}
successElement.classList.add('visible')
if (typeof onSuccess === 'function') {
onSuccess()
}
setTimeout(() => {
formElement.reset()
successElement.classList.remove('visible')
}, 2200)
} catch (error) {
window.alert('Не удалось отправить заявку. Попробуйте еще раз.')
}
})
}
mobileToggle.addEventListener('click', () => {
const isOpen = mobilePanel.classList.contains('active')
if (isOpen) {
closeMobileMenu()
return
}
openMobileMenu()
})
document.querySelectorAll('.mobile-nav a').forEach(link => {
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 => {
button.addEventListener('click', () => openModal(button))
})
modalCloseButton.addEventListener('click', closeModal)
cartDrawer.addEventListener('click', event => {
if (event.target === cartDrawer) {
closeCart()
}
})
modalBackdrop.addEventListener('click', event => {
if (event.target === modalBackdrop) {
closeModal()
}
})
faqItems.forEach(item => {
const trigger = item.querySelector('.faq-question')
const answer = item.querySelector('.faq-answer')
if (!trigger || !answer) {
return
successElement.classList.add('visible')
if (typeof onSuccess === 'function') {
onSuccess()
}
trigger.addEventListener('click', () => {
const isOpen = item.classList.contains('open')
faqItems.forEach(entry => {
const entryTrigger = entry.querySelector('.faq-question')
const entryAnswer = entry.querySelector('.faq-answer')
entry.classList.remove('open')
entryTrigger?.setAttribute('aria-expanded', 'false')
if (entryAnswer) {
entryAnswer.hidden = true
}
})
if (!isOpen) {
item.classList.add('open')
trigger.setAttribute('aria-expanded', 'true')
answer.hidden = false
}
})
})
submitLeadForm(orderForm, orderSuccess, 'landing_order', () => {
cart = []
renderCart()
setTimeout(() => {
closeModal()
}, 700)
})
formElement.reset()
successElement.classList.remove('visible')
}, 2200)
} catch (error) {
window.alert('Не удалось отправить заявку. Попробуйте еще раз.')
}
})
}
submitLeadForm(contactForm, contactSuccess, 'landing_contacts')
if (mobileToggle && mobilePanel) {
mobileToggle.addEventListener('click', () => {
const isOpen = mobilePanel.classList.contains('active')
document.addEventListener('keydown', event => {
if (event.key !== 'Escape') {
return
}
closeCart()
closeModal()
if (isOpen) {
closeMobileMenu()
return
}
openMobileMenu()
})
document.querySelectorAll('.mobile-nav a').forEach(link => {
link.addEventListener('click', closeMobileMenu)
})
}
orderButtons.forEach(button => {
button.addEventListener('click', () => openModal(button))
})
if (modalCloseButton) {
modalCloseButton.addEventListener('click', closeModal)
}
if (modalBackdrop) {
modalBackdrop.addEventListener('click', event => {
if (event.target === modalBackdrop) {
closeModal()
}
})
}
faqItems.forEach(item => {
const trigger = item.querySelector('.faq-question')
const answer = item.querySelector('.faq-answer')
if (!trigger || !answer) {
return
}
trigger.addEventListener('click', () => {
const isOpen = item.classList.contains('open')
faqItems.forEach(entry => {
const entryTrigger = entry.querySelector('.faq-question')
const entryAnswer = entry.querySelector('.faq-answer')
entry.classList.remove('open')
entryTrigger?.setAttribute('aria-expanded', 'false')
if (entryAnswer) {
entryAnswer.hidden = true
}
})
renderCart()
if (!isOpen) {
item.classList.add('open')
trigger.setAttribute('aria-expanded', 'true')
answer.hidden = false
}
})
})
submitLeadForm(orderForm, orderSuccess, 'landing_order', () => {
setTimeout(() => {
closeModal()
}, 700)
})
submitLeadForm(contactForm, contactSuccess, 'landing_contacts')
document.addEventListener('keydown', event => {
if (event.key !== 'Escape') {
return
}
closeModal()
closeMobileMenu()
})

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' ) ) {

View File

@@ -50,6 +50,8 @@ function twentytwentyfour_test1_catalog_markup() {
if ( '' === $volume ) {
$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 ); ?>">
<?php if ( $image_html ) : ?>
@@ -66,14 +68,18 @@ function twentytwentyfour_test1_catalog_markup() {
<?php endif; ?>
</div>
<div class="card-price"><strong><?php echo esc_html( $price ); ?></strong></div>
<button
class="mini-button add-to-cart"
data-product-id="<?php echo esc_attr( (string) $product->get_id() ); ?>"
data-name="<?php echo esc_attr( $product->get_name() ); ?>"
data-volume="<?php echo esc_attr( $volume ); ?>"
data-price="<?php echo esc_attr( (string) wc_get_price_to_display( $product ) ); ?>"
type="button"
><?php esc_html_e( 'Добавить в корзину', 'twentytwentyfour' ); ?></button>
<?php if ( $product->is_purchasable() && $product->is_in_stock() ) : ?>
<a
class="mini-button add_to_cart_button product_type_<?php echo esc_attr( $product->get_type() ); ?>"
href="<?php echo esc_url( $add_to_cart_url ); ?>"
data-product_id="<?php echo esc_attr( (string) $product->get_id() ); ?>"
data-quantity="1"
rel="nofollow"
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>
<?php endforeach; ?>
</div>
@@ -183,7 +189,7 @@ get_header( 'test1' );
<span class="chip">для кулера</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 class="catalog-card reveal reveal-delay-1">
@@ -195,7 +201,7 @@ get_header( 'test1' );
<span class="chip">компактно</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 class="catalog-card reveal reveal-delay-2">
@@ -207,7 +213,7 @@ get_header( 'test1' );
<span class="chip">мероприятия</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 class="catalog-card reveal reveal-delay-3">
@@ -219,7 +225,7 @@ get_header( 'test1' );
<span class="chip">рестораны</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 class="catalog-card reveal reveal-delay-4">
@@ -231,7 +237,7 @@ get_header( 'test1' );
<span class="chip">на выбор</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>
</div>
<?php
@@ -263,7 +269,7 @@ get_header( 'test1' );
<span>19 л, мягкий вкус, ежедневное потребление</span>
</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 class="product-row">
<div>
@@ -271,7 +277,7 @@ get_header( 'test1' );
<span>19 л, артезианская вода, усиленный контроль</span>
</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 class="product-row">
<div>
@@ -279,7 +285,7 @@ get_header( 'test1' );
<span>2 бутыли 19 л + помпа для первого заказа</span>
</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>
@@ -687,32 +693,6 @@ get_header( 'test1' );
</section>
</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-card" role="dialog" aria-modal="true" aria-labelledby="orderModalTitle">
<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';
$posts_page_id = (int) get_option( 'page_for_posts' );
$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 ) {
$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>
</a>
<?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 class="cart-count" id="cartCount" aria-live="polite" aria-atomic="true">0</span>
</button>
<span class="cart-count" aria-live="polite" aria-atomic="true"><?php echo esc_html( (string) $cart_count ); ?></span>
</a>
<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">
<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>
</nav>
<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 class="cart-count" id="mobileCartCount" aria-live="polite" aria-atomic="true">0</span>
</button>
<span class="cart-count" aria-live="polite" aria-atomic="true"><?php echo esc_html( (string) $cart_count ); ?></span>
</a>
</div>
</div>
<?php endif; ?>