ht-OwnCraft/assets/js/menu.js
2025-01-04 02:44:56 +01:00

44 lines
No EOL
1.7 KiB
JavaScript

document.addEventListener('DOMContentLoaded', function() {
// Menu category switching
const tabButtons = document.querySelectorAll('[data-tab]');
const menuContents = document.querySelectorAll('.menu-content');
tabButtons.forEach(button => {
button.addEventListener('click', () => {
const targetId = `${button.dataset.tab}-content`;
// Update button styles
tabButtons.forEach(btn => {
const isActive = btn === button;
btn.classList.toggle('bg-pizza-red', isActive);
btn.classList.toggle('text-white', isActive);
btn.classList.toggle('bg-gray-200', !isActive);
btn.classList.toggle('dark:bg-pizza-darker', !isActive);
btn.classList.toggle('text-gray-700', !isActive);
btn.classList.toggle('dark:text-white', !isActive);
});
// Show/hide content
menuContents.forEach(content => {
content.classList.toggle('hidden', content.id !== targetId);
});
});
});
// Pizza price group toggles
const priceGroupHeaders = document.querySelectorAll('.price-group-header');
priceGroupHeaders.forEach(header => {
header.addEventListener('click', () => {
const content = header.nextElementSibling;
const arrow = header.querySelector('svg');
// Toggle content visibility
content.classList.toggle('hidden');
// Rotate arrow
arrow.style.transform = content.classList.contains('hidden')
? 'rotate(0deg)'
: 'rotate(180deg)';
});
});
});