103 lines
2.6 KiB
JavaScript
103 lines
2.6 KiB
JavaScript
// main script
|
|
(function () {
|
|
"use strict";
|
|
|
|
// Dropdown Menu Toggler For Mobile
|
|
// ----------------------------------------
|
|
const dropdownMenuToggler = document.querySelectorAll(
|
|
".nav-dropdown > .nav-link",
|
|
);
|
|
|
|
dropdownMenuToggler.forEach((toggler) => {
|
|
toggler?.addEventListener("click", (e) => {
|
|
e.target.closest('.nav-item').classList.toggle("active");
|
|
});
|
|
});
|
|
|
|
// Testimonial Slider
|
|
// ----------------------------------------
|
|
new Swiper(".testimonial-slider", {
|
|
spaceBetween: 24,
|
|
loop: true,
|
|
pagination: {
|
|
el: ".testimonial-slider-pagination",
|
|
type: "bullets",
|
|
clickable: true,
|
|
},
|
|
breakpoints: {
|
|
768: {
|
|
slidesPerView: 2,
|
|
},
|
|
992: {
|
|
slidesPerView: 3,
|
|
},
|
|
},
|
|
});
|
|
|
|
|
|
// modals
|
|
// openers
|
|
const body = document.querySelector("body");
|
|
const show_modal_buttons = document.querySelectorAll("[data-modal-show]");
|
|
show_modal_buttons.forEach((btn) => {
|
|
const target = btn.getAttribute('data-modal-show');
|
|
const modal = document.querySelector(`#${target}`);
|
|
if (modal) {
|
|
btn.addEventListener("click", (e) => {
|
|
modal.classList.toggle("hidden", false);
|
|
body.classList.toggle("overflow-hidden", true);
|
|
});
|
|
}
|
|
});
|
|
|
|
const hide_modal_buttons = document.querySelectorAll("[data-modal-hide]");
|
|
hide_modal_buttons.forEach((btn) => {
|
|
const target = btn.getAttribute('data-modal-hide');
|
|
const modal = document.querySelector(`#${target}`);
|
|
if (modal) {
|
|
btn.addEventListener("click", (e) => {
|
|
modal.classList.toggle("hidden", true);
|
|
body.classList.toggle("overflow-hidden", false);
|
|
});
|
|
}
|
|
});
|
|
|
|
const modal_bg = document.querySelectorAll(".modal-bg");
|
|
modal_bg.forEach((bg) => {
|
|
bg.addEventListener("click", (e) => {
|
|
if(e.target === bg) {
|
|
bg.classList.toggle("hidden", true);
|
|
body.classList.toggle("overflow-hidden", false);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Swipers
|
|
// ----------------------------------------
|
|
const swipers = document.querySelectorAll(".swiper-slider");
|
|
|
|
swipers.forEach((swiper) => {
|
|
new Swiper(swiper, {
|
|
spaceBetween: 24,
|
|
loop: true,
|
|
pagination: {
|
|
el: swiper.querySelector(".swiper-slider-pagination"),
|
|
type: "bullets",
|
|
clickable: true,
|
|
},
|
|
navigation: {
|
|
nextEl: swiper.querySelector(".swiper-button-next"),
|
|
prevEl: swiper.querySelector(".swiper-button-prev"),
|
|
},
|
|
breakpoints: {
|
|
768: {
|
|
slidesPerView: 2,
|
|
},
|
|
992: {
|
|
slidesPerView: 3,
|
|
},
|
|
},
|
|
});
|
|
});
|
|
})();
|