78 lines
2.5 KiB
JavaScript
78 lines
2.5 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 head = document.querySelector("header");
|
|
const links = document.querySelectorAll("a");
|
|
const nav = document.querySelector(".navigation");
|
|
const h1 = document.querySelector("h1");
|
|
const nadpish2 = document.querySelectorAll("h2");
|
|
const p = document.querySelector("p");
|
|
const solid = document.querySelector(".fa-solid");
|
|
const solid1 = document.querySelector(".menu-icon");
|
|
const footer = document.querySelector("footer");
|
|
|
|
let isDraculaMode = false;
|
|
|
|
// Funkce pro nastavení stylů pro Dracula mód
|
|
function setDraculaStyles() {
|
|
body.style.backgroundColor = "#2a232b"; // Barva pozadí pro Dracula mód
|
|
body.style.color = "#f8f8f2"; // Barva textu pro Dracula mód
|
|
head.style.backgroundColor = "#2a232b";
|
|
links.forEach((a) => {
|
|
a.style.color = "#f76b00";
|
|
});
|
|
nav.style.backgroundColor = "#2a232b";
|
|
h1.style.color = "#e54472";
|
|
nadpish2.forEach((h2) => {
|
|
h2.style.color = "#18f700";
|
|
});
|
|
solid.style.backgroundColor = "#2a232b";
|
|
solid.style.color = "#f76b00";
|
|
solid1.style.backgroundColor = "#2a232b";
|
|
footer.style.backgroundColor = "#2a232b";
|
|
}
|
|
|
|
// Funkce pro nastavení stylů pro Light mód
|
|
function setLightStyles() {
|
|
body.style.backgroundColor = "#f8f8f2"; // Barva pozadí pro Light mód
|
|
body.style.color = "#282a36"; // Barva textu pro Light mód
|
|
head.style.backgroundColor = "#f8f8f2";
|
|
}
|
|
|
|
// Funkce pro přepnutí módu
|
|
function toggleMode() {
|
|
if (isDraculaMode) {
|
|
// Pokud je momentálně v Dracula modu, přepnout na Light mód
|
|
setLightStyles();
|
|
isDraculaMode = false;
|
|
} else {
|
|
// Pokud je momentálně v Light modu, přepnout na Dracula mód
|
|
setDraculaStyles();
|
|
isDraculaMode = true;
|
|
}
|
|
}
|
|
|
|
// Při kliknutí na tlačítko spusť funkci pro přepnutí módu
|
|
document.getElementById("toggleButton").addEventListener("click", toggleMode);
|
|
|
|
// Nastavit výchozí styl na Dracula mód po načtení stránky
|
|
setDraculaStyles();
|
|
isDraculaMode = true;
|