67 lines
2.1 KiB
JavaScript
67 lines
2.1 KiB
JavaScript
//Nastavení Header menu
|
|
const menuIcon = document.querySelector(".menu-icon");
|
|
const menuList = document.querySelector("nav");
|
|
const hamburgerIcon = document.querySelector(".fa-solid");
|
|
|
|
menuIcon.addEventListener("click", () => {
|
|
if (hamburgerIcon.classList[1] === "fa-bars") {
|
|
hamburgerIcon.classList.add("fa-xmark");
|
|
hamburgerIcon.classList.remove("fa-bars");
|
|
menuList.style.display = "block";
|
|
} else {
|
|
hamburgerIcon.classList.add("fa-bars");
|
|
hamburgerIcon.classList.remove("fa-xmark");
|
|
menuList.style.display = "none";
|
|
}
|
|
});
|
|
|
|
// Dark Light Mode
|
|
|
|
const body = document.querySelector("body");
|
|
const logo = document.querySelector(".picture");
|
|
const link = document.querySelector(".link");
|
|
const link1 = document.querySelector(".link1");
|
|
const link2 = document.querySelector(".link2");
|
|
const nav = document.querySelector(".navigation");
|
|
const h1 = document.querySelector("h1");
|
|
const h3 = document.querySelector("h3");
|
|
const p = document.querySelector("p");
|
|
|
|
|
|
// Funkce pro přepnutí módu
|
|
function toggleMode() {
|
|
if (body.classList.contains("dark-mode")) {
|
|
// Pokud je momentálně dark mode, změň na light mode
|
|
body.classList.remove("dark-mode")
|
|
body.classList.add("light-mode");
|
|
body.style.backgroundColor = "white";
|
|
//logo.style.backgroundColor = "black";
|
|
link.style.color = "black";
|
|
link1.style.color = "black";
|
|
link2.style.color = "black";
|
|
nav.style.backgroundColor = "white";
|
|
h1.style.color = "black";
|
|
h3.style.color = "black";
|
|
p.style.color = "black";
|
|
} else {
|
|
// Pokud je momentálně light mode, změň na dark mode
|
|
body.classList.remove("light-mode")
|
|
body.classList.add("dark-mode");
|
|
body.style.backgroundColor = "black";
|
|
logo.style.backgroundColor = "white";
|
|
link.style.color = "white";
|
|
link1.style.color = "white";
|
|
link2.style.color = "white";
|
|
nav.style.backgroundColor = "black";
|
|
h1.style.color = "white";
|
|
h3.style.color = "yellow";
|
|
p.style.color = "white";
|
|
}
|
|
}
|
|
|
|
// Tlačítko pro přepnutí módu dark a light mode
|
|
document.getElementById("toggleButton").addEventListener("click", toggleMode);
|
|
|
|
|
|
|