diff --git a/scripts/script.js b/scripts/script.js deleted file mode 100644 index fdb3fb4..0000000 --- a/scripts/script.js +++ /dev/null @@ -1,89 +0,0 @@ -const skillsList = document.querySelector(".skills__list"); - -const allButton = document.querySelector("button[data-type='all']"); -const frontendButton = document.querySelector("button[data-type='frontend']"); -const backendButton = document.querySelector("button[data-type='backend']"); -const filterButtons = [allButton, frontendButton, backendButton]; - -filterButtons.forEach((button) => { - button.addEventListener("click", () => { - skillsList.className = "skills__list"; // Reset class name - skillsList.classList.add(button.dataset.type); // Add relevant class - skillsItems.forEach((skill) => skill.classList.remove("underline")); - }); -}); - -const skillsArray = [ - { name: "HTML", experience: "2013", type: "frontend" }, - { name: "CSS", experience: "2013", type: "frontend" }, - { name: "Javascript", experience: "2013", type: "frontend" }, - { name: "React", experience: "2016", type: "frontend" }, - { name: "Redux", experience: "2017", type: "frontend" }, - { name: "React Testing Library", experience: "2020", type: "frontend" }, - { name: "Node.js", experience: "2020", type: "backend" }, - { name: "Express.js", experience: "2020", type: "backend" }, - { name: "MongoDB", experience: "2020", type: "backend" }, -]; - -const currentYear = new Date().getFullYear(); - -skillsArray.forEach((skillData) => { - const skill = ` -
  • -

    - ${skillData.name} -

    - - ${currentYear - skillData.experience} years - -
  • `; - - skillsList.innerHTML += skill; -}); - -const skillsButton = document.querySelectorAll(".skills__button"); - -skillsButton.forEach((button) => { - button.addEventListener("click", () => { - skillsButton.forEach((skill) => - skill.classList.remove("skills__button--isActive") - ); - button.classList.add("skills__button--isActive"); - }); -}); - -const skillsItems = document.querySelectorAll(".skills__item"); - -skillsItems.forEach((item) => { - item.addEventListener("click", () => { - if (item.classList.contains("underline")) { - item.classList.remove("underline"); - } else { - skillsItems.forEach((skill) => skill.classList.remove("underline")); - item.classList.add("underline"); - } - }); -}); - -const submitButton = document.querySelector(".contact__button"); -const inputs = document.querySelectorAll(".contact__input"); - -inputs.forEach((item) => { - if (item.tagName !== "TEXTAREA") { - item.addEventListener("keydown", (event) => { - if (event.key === "_") { - event.preventDefault(); - alert("Text don't contain '_'"); - } - }); - } -}); - -inputs.forEach((item) => { - item.addEventListener("focus", () => item.classList.add("border-blue")); - item.addEventListener("blur", () => item.classList.add("border-red")); -});