diff --git a/index.html b/index.html index 0b8843f..852fa99 100644 --- a/index.html +++ b/index.html @@ -1,51 +1,52 @@ - - - - - - - - - - Project 2 - + + + - -
- - + + + + - - + + Project 2 + - -
-
- -
-
+ +
+ + + + + + + +
+
+ +
+
+

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

+
+ +
+ + - - - - diff --git a/script.js b/script.js index 3ae109e..a6716d8 100644 --- a/script.js +++ b/script.js @@ -15,3 +15,31 @@ menuIcon.addEventListener("click", () => { } }); +// 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"); +//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 { +} diff --git a/style.css b/style.css index c096bae..80748ad 100644 --- a/style.css +++ b/style.css @@ -9,18 +9,18 @@ box-sizing: border-box; } -/* Harry ( header) */ +/* Terminal ( header) */ header { + margin-top: 25px; display: flex; align-items: center; - background-color: var(--special-blue); height: 70px; flex-direction: row; } .title { - padding-top: 25px; + padding-top: 25px; } .logo { @@ -30,12 +30,12 @@ header { .logo img { /*width: 100px;*/ + display: inline-block; /* zajistí, že rámeček bude mít rozměry odpovídající obsahu */ height: 100px; - padding-top: 15px; margin-left: 20px; } -/* Harry - navigation */ +/* Terminal - navigation */ nav { margin-right: 30px; } @@ -48,10 +48,10 @@ nav li { nav li a { text-decoration: none; - color: var(--special-white); + color: black; } -/*Harry - navigation icons */ +/*Terminal - navigation icons */ .menu-icon { display: none; @@ -64,16 +64,16 @@ nav li a { position: relative; } header nav { + background-color: white; position: absolute; top: 70px; - background-color: var(--special-blue); width: 100%; display: none; } .menu-icon { display: block; - color: var(--special-white); + /*color: var(--special-white);*/ font-size: 23px; } @@ -85,19 +85,25 @@ nav li a { } } - - - - - - +/* Sekce */ +hr { + margin-top: 25px; +} +.section1 { + padding-top: 50px; + text-align: center; +} /*footer pevná pozice*/ footer { position: fixed; bottom: 0; - position: center; - - } + margin-bottom: 10px; + margin-left: 25px; + } +footer a { + text-decoration: none; + color: black; +}