prvni várka

2024-04-17 23:13:56 +02:00
commit 25ef045289
19 changed files with 433 additions and 0 deletions
--- a/theme/index.html
+++ b/theme/index.html
@ -0,0 +1,10 @@
+<head>
+  <!--icons dark, go to up-->
+  <link
+    rel="stylesheet"
+    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
+  />
+</head>
+<body>
+  <button id="toggleButton"><i class="fas fa-adjust"></i></button>
+</body>
--- a/theme/script.js
+++ b/theme/script.js
@ -0,0 +1,89 @@
+// 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");
+const gotop = document.querySelector("#scrollToTopBtn");
+const theme = document.querySelector("#toggleButton");
+const box = document.querySelectorAll(".code-box");
+const form = document.querySelector(".log");
+let isDraculaMode = false;
+
+// Funkce pro nastavení stylů pro Dracula mód
+function setDraculaStyles() {
+  body.style.backgroundColor = "#2a232b";
+  body.style.color = "#f8f8f2";
+  head.style.backgroundColor = "#2a232b";
+  theme.style.color = "#9fea8a";
+  gotop.style.color = "#9fea8a";
+  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";
+  //gotop.style.backgroundColor = "#18f700";
+  //theme.style.backgroundColor = "#18f700";
+  form.style.backgroundColor = "#18f700";
+  form.style.color = "black";
+}
+
+// Funkce pro nastavení stylů pro Light mód;
+function setKakouneStyles() {
+  body.style.backgroundColor = "#9fea8a";
+  body.style.color = "#282a36";
+  h1.style.color = "#e84046";
+  theme.style.color = "#2a232b";
+  links.forEach((a) => {
+    a.style.color = "#ea3838";
+  });
+  gotop.style.color = "#2a232b";
+  head.style.backgroundColor = "#9fea8a";
+  nav.style.backgroundColor = "#9fea8a";
+  solid.style.backgroundColor = "#9fea8a";
+  solid1.style.backgroundColor = "#9fea8a";
+  footer.style.backgroundColor = "#9fea8a";
+  nadpish2.forEach((h2) => {
+    h2.style.color = "#1909f4";
+  });
+  //gotop.style.backgroundColor = "#a7e6ef";
+  //theme.style.backgroundColor = "#a7e6ef";
+  box.forEach((p) => {
+    p.style.color = "white";
+  });
+  form.style.backgroundColor = "#1909f4";
+  form.style.color = "white";
+}
+
+// Funkce pro přepnutí módu
+function toggleMode() {
+  if (isDraculaMode) {
+    // Pokud je momentálně v Dracula modu, přepnout na Light mód
+    setKakouneStyles();
+    isDraculaMode = false;
+  } else {
+    // Pokud je momentálně v Light modu, přepnout na Dracula mód
+    setDraculaStyles();
+    isDraculaMode = true;
+  }
+}
+
+// Funkce na změnu stylů
+document.getElementById("toggleButton").addEventListener("click", toggleMode);
+
+// Nastavení - výchozí styl na Light(Kakoune)
+setKakouneStyles();
+isDraculaMode = true;
--- a/theme/style.css
+++ b/theme/style.css
@ -0,0 +1,17 @@
+/*Dark/Light mode button*/
+#toggleButton {
+  float: right;
+  margin-right: 30px;
+  margin-top: 10px;
+  padding: 5px;
+}
+
+#toggleButton {
+  bottom: 20px;
+  right: 20px;
+  border: none;
+  outline: none;
+  background-color: transparent;
+  font-size: 34px;
+  cursor: pointer;
+}