diff --git a/.script.js.kate-swp b/.script.js.kate-swp new file mode 100644 index 0000000..d3ef982 Binary files /dev/null and b/.script.js.kate-swp differ diff --git a/index.html b/index.html index 852fa99..b1503ea 100644 --- a/index.html +++ b/index.html @@ -1,52 +1,71 @@ - - - + + + - - - - + + + + - - Project 2 - + + Project 2 + - -
- - + +
+ + - - + + -
- - - - -
-
-
- -
-
-

Vítám tě na Terminalu, webu věnovanému Terminalům a aplikacim v Terminalu.

+
+ + + + +
+
+
+ + + +
+
+

+ Vítám tě na Terminalu, webu věnovanému Terminalům a aplikacim v + Terminalu. +

+

+ Tento projekt je věnován Terminálum hlavně na systémech Linux a MacOS. + Najdeš tu všechny možné terminály a multiplexory co si můžeš + naistalovat do svého OS, aplikace pro terminály, rady a tipy pro + terminály. +

+

Terminály nejsou jen pro programátory a správce sítí, pracovat nebo objevat kouzlo terminálů může každý a brzy zjistí že to není nic čeho se bát. Díky Terminálům můžeš monitorovat systém, automatizovat opakující se činnosti, editovat textové soubory, nastavovat svůj OS, programovat, hrát hry a sposty dalšího. To vš zvládneš v jednom Terminálu na jednou s nainatalovaným multiplexrem jako je Zellij nebo Tmux.

+
+
- - - - - + + diff --git a/script.js b/script.js index a6716d8..93afbaf 100644 --- a/script.js +++ b/script.js @@ -26,20 +26,41 @@ const nav = document.querySelector(".navigation"); const h1 = document.querySelector("h1"); const h3 = document.querySelector("h3"); const p = document.querySelector("p"); -//const footer = document.querySelector(".footer"); -const mode = prompt("Chcete dark mode nebo light mode? dark / light"); -if (mode === "dark") { - 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 = "white"; - p.style.color = "yellow"; - footer.style.backgroundColor = "white"; -} else { +// 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); + + + diff --git a/style.css b/style.css index 80748ad..dbf4960 100644 --- a/style.css +++ b/style.css @@ -8,7 +8,11 @@ box-sizing: border-box; } +body { + max-width: 1200px; + margin: 0 auto; +} /* Terminal ( header) */ header { @@ -56,10 +60,24 @@ nav li a { .menu-icon { display: none; margin-right: 30px; +background-color: white; } +/*Dark/Light mode button*/ +#toggleButton { +float: right; +margin-right: 30px; +margin-top: 10px; +background-color: red; +} + + /*Header small display*/ @media (max-width: 600px) { + body { +padding: 10px; + } + header { position: relative; } @@ -73,7 +91,6 @@ nav li a { .menu-icon { display: block; - /*color: var(--special-white);*/ font-size: 23px; } @@ -101,6 +118,7 @@ footer { bottom: 0; margin-bottom: 10px; margin-left: 25px; + background-color: white; } footer a {