remove DeMIL.WG workshop

build_pages.py

@@ -31,7 +31,7 @@ PAGES = [
 
 
 def buildPage(
-    filename: str, pageTitle: str, pageHtml: str, pageStyle: str, template: str, lang: str
+    filename: str, pageTitle: str, pageHtml: str, pageStyle: str, template: str
 ) -> str:
     template = template.replace("<!--TITLE-->", pageTitle)
     style = (
@@ -42,13 +42,6 @@ def buildPage(
     template = template.replace("<!--ADDITIONAL_STYLE-->", style)
     template = template.replace("PAGE_NAME", filename)
     template = template.replace("<!--MAIN-->", pageHtml)
-    
-    # Fix language switcher links
-    if lang == "en":
-        template = template.replace('href="/PAGE_NAME"', f'href="/en/{filename}"')
-    else:
-        template = template.replace('href="/en/PAGE_NAME"', f'href="/sr/{filename}"')
-    
     return template
 
 
@@ -64,7 +57,7 @@ def main():
                 pageHtml = "<div class='cover-wrap'><img src='/img/students_bug.jpg' alt='Studenti su nasli bug' /></div>"
                 pageHtml += f.read()
                 html = buildPage(
-                    page["name"], page["titleSR"], pageHtml, page["style"], templateSR, "sr"
+                    page["name"], page["titleSR"], pageHtml, page["style"], templateSR
                 )
                 f = open(f'site/{page["name"]}.html', "w")
                 f.write(html)
@@ -73,7 +66,7 @@ def main():
                 pageHtml = "<div class='cover-wrap'><img src='/img/students_bug.jpg' alt='Students found the bug' /></div>"
                 pageHtml += f.read()
                 html = buildPage(
-                    page["name"], page["titleEN"], pageHtml, page["style"], templateEN, "en"
+                    page["name"], page["titleEN"], pageHtml, page["style"], templateEN
                 )
                 f = open(f'site/en/{page["name"]}.html', "w")
                 f.write(html)

dogadjaji.csv

@@ -383,3 +383,7 @@ datum, vreme, lokacija, tema, tip, link, temaEN
 17-08-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Mail server - 1. deo,workshop,, Mail server - part 1
 24-08-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Film: Primer (2004),movie,,Movie: Primer (2004)
 31-08-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Lightning talks,lightning,,Lightning talks
+07-09-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Sysadmin radionica,workshop,,Sysadmin workshop
+14-09-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Druzenje,party,,Party
+21-09-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Mail server - 2. deo,workshop,, Mail server - part 2
+28-09-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876, Hakaton, hack, https://wiki.dmz.rs/decentrala/dogadjaji/hakaton, Hackathon

pages/en/services.html

@@ -5,45 +5,45 @@
     <th>Description</th>
   </tr>
   <tr>
-    <td><a href="/account">E-mail</a></td>
+    <td><a href="/account" target="_blank">E-mail</a></td>
     <td>
       E-mail account that you can use with any e-mail client (for example, with
-      the <a href="https://www.thunderbird.net/">Thunderbird</a>).
+      the <a href="https://www.thunderbird.net/" target="_blank">Thunderbird</a>).
     </td>
   </tr>
   <tr>
-    <td><a href="https://forum.dmz.rs/">Forum</a></td>
+    <td><a href="https://forum.dmz.rs/" target="_blank">Forum</a></td>
     <td>
-      Forum for general discussion and <a href="/events">event</a> organization.
+      Forum for general discussion and <a href="/events" target="_blank">event</a> organization.
     </td>
   </tr>
   <tr>
-    <td><a href="/account">Chat</a></td>
+    <td><a href="/account" target="_blank">Chat</a></td>
     <td>
       We have our XMPP server, on which you can make an account. If you already
       have an account, you can find us at group
-      <a href="decentrala@conference.dmz.rs">decentrala@conference.dmz.rs</a>.
+      <a href="decentrala@conference.dmz.rs" target="_blank">decentrala@conference.dmz.rs</a>.
     </td>
   </tr>
   <tr>
-    <td><a href="https://gitea.dmz.rs/">Git</a></td>
+    <td><a href="https://gitea.dmz.rs/" target="_blank">Git</a></td>
     <td>
-      <a href="https://gitea.io/en-us/">Gitea</a> instance on which we host our
+      <a href="https://gitea.io/en-us/" target="_blank">Gitea</a> instance on which we host our
       code and resources (including the code for this site).
     </td>
   </tr>
   <tr>
-    <td><a href="https://wiki.dmz.rs/">Wiki</a></td>
+    <td><a href="https://wiki.dmz.rs/" target="_blank">Wiki</a></td>
     <td>
-      <a href="https://js.wiki/">Wiki.js</a> instance on which we publish
+      <a href="https://js.wiki/" target="_blank">Wiki.js</a> instance on which we publish
-      documentation for our projects, <a href="/events">events</a> resources,
+      documentation for our projects, <a href="/events" target="_blank">events</a> resources,
       and tutorials.
     </td>
   </tr>
   <tr>
-    <td><a href="https://jitsi.dmz.rs/">Jitsi</a></td>
+    <td><a href="https://jitsi.dmz.rs/" target="_blank">Jitsi</a></td>
     <td>
-      <a href="https://jitsi.org/">Jitsi.org</a> meeting app, conferences, group video calls, online events, alternative
+      <a href="https://jitsi.org/" target="_blank">Jitsi.org</a> meeting app, conferences, group video calls, online events, alternative
       to zoom.
     </td>
   </tr>
@@ -59,33 +59,36 @@
       <a href="https://cryptpad.org/">CryptPad</a> alternative to google office
     </td>
   </tr>-->
-  <!--<tr>
   <tr>
-    <td><a href="https://search.dmz.rs/">Search</a></td>
-    <td>
-      <a href="https://github.com/searxng/searxg/">SearXNG</a> instance used for
-      Web searching.
-    </td>
-  </tr> -->
   <tr>
-    <td><a href="https://pastebin.dmz.rs/">Pastebin</a></td>
+    <td><a href="https://invidious.dmz.rs/" target="_blank">Invidious</a></td>
     <td>
-      <a href="https://privatebin.info/">PrivateBin</a> instance we use for
+      <a href="https://invidious.io/" target="_blank">Invidious</a>, alternative font-end to YouTube.
-      sharing text files
     </td>
   </tr>
   <tr>
-    <td><a href="ssh://soft.dmz.rs:2222/">Soft Serve</a></td>
+    <td><a href="https://search.dmz.rs/" target="_blank">Search</a></td>
     <td>
-      <a href="https://github.com/charmbracelet/soft-serve">Soft Serve</a>
+      <a href="https://github.com/searxng/searxg/" target="_blank">SearXNG</a> instance used for Web searching.
-      instance that we use as a replacement for the Gitea service. Soft Serve
+    </td>
-      works entirely from the terminal.
+  </tr>
+  <tr>
+    <td><a href="https://pastebin.dmz.rs/" target="_blank">Pastebin</a></td>
+    <td>
+      <a href="https://privatebin.info/" target="_blank">PrivateBin</a> instance for sharing textal data, like codes, logs, etc.
+    </td>
+  </tr>
+  <tr>
+    <td><a href="ssh://soft.dmz.rs:2222/" target="_blank">Soft Serve</a></td>
+    <td>
+      <a href="https://github.com/charmbracelet/soft-serve" target="_blank">Soft Serve</a>
+      TUI git instance. Soft Serve works entirely from the terminal over ssh.
     </td>
   </tr>
 </table>
 <p>
   These are some of the services we currently maintain on our servers. To use
   these services, you can register for each service separately, or you can
-  create a unique <a href="/en/account">account</a>
+  create a unique <a href="/en/account" target="_blank">account</a>
   on our server and use all services with the same account.
 </p>

pages/sr/services.html

@@ -5,33 +5,33 @@
     <th>Opis</th>
   </tr>
   <tr>
-    <td><a href="/account">E-mail</a></td>
+    <td><a href="/account" target="_blank">E-mail</a></td>
     <td>
       E-mail nalog koji možeš da koristiš sa bilo kojim email klijentom
       generalne namene (na primer
-      <a href="https://www.thunderbird.net/">Thunderbird</a>-om).
+      <a href="https://www.thunderbird.net/" target="_blank">Thunderbird</a>-om).
     </td>
   </tr>
   <tr>
-    <td><a href="https://forum.dmz.rs/">Forum</a></td>
+    <td><a href="https://forum.dmz.rs/" target="_blank">Forum</a></td>
     <td>
-      Forum na kom obično organizujemo naše <a href="/events">događaje</a>.
+      Forum na kom obično organizujemo naše <a href="/events" target="_blank">događaje</a>.
     </td>
   </tr>
   <tr>
-    <td><a href="/account">Chat</a></td>
+    <td><a href="/account" target="_blank">Chat</a></td>
     <td>
       Održavamo sopstveni XMPP server, na kojem možeš da napraviš nalog. Ako već
       poseduješ nalog možeš da nas nađeš u grupi
-      <a href="decentrala@conference.dmz.rs">decentrala@conference.dmz.rs</a>.
+      <a href="decentrala@conference.dmz.rs" target="_blank">decentrala@conference.dmz.rs</a>.
     </td>
   </tr>
   <tr>
-    <td><a href="https://gitea.dmz.rs/">Git</a></td>
+    <td><a href="https://gitea.dmz.rs/" target="_blank">Git</a></td>
     <td>
-      <a href="https://gitea.io/en-us/">Gitea</a> instanca na kojoj držimo kôd
+      <a href="https://gitea.io/en-us/" target="_blank">Gitea</a> instanca na kojoj držimo kôd
-      kao i ostale resurse za naše <a href="/projects">projekte</a>,
+      kao i ostale resurse za naše <a href="/projects" target="_blank">projekte</a>,
-      <a href="/events">događaje</a>, kao i projekte naših prijatelja. Ovo može
+      <a href="/events" target="_blank">događaje</a>, kao i projekte naših prijatelja. Ovo može
       biti dom tvog sledećeg projekta. Bolji od Github-a.
     </td>
   </tr>
@@ -39,14 +39,14 @@
     <td><a href="https://wiki.dmz.rs/">Wiki</a></td>
     <td>
       <a href="https://js.wiki/">Wiki.js</a> instanca koju koristimo da
-      dokumentujemo naše <a href="/projects">projekte</a> kao i ostale
+      dokumentujemo naše <a href="/projects" target="_blank">projekte</a> kao i ostale
-      <a href="/events">događaje</a>.
+      <a href="/events" target="_blank">događaje</a>.
     </td>
   </tr>
   <tr>
-    <td><a href="https://jitsi.dmz.rs/">Jitsi</a></td>
+    <td><a href="https://jitsi.dmz.rs/" target="_blank">Jitsi</a></td>
     <td>
-      <a href="https://jitsi.org/">Jitsi.org</a> aplikacija za sastanke, groupne video pozive, online dogadjaje, alternativa za zoom.
+      <a href="https://jitsi.org/" target="_blank">Jitsi.org</a> aplikacija za sastanke, groupne video pozive, online dogadjaje, alternativa za zoom.
     </td>
   </tr>
   <!--<tr>
@@ -62,32 +62,35 @@
       <a href="https://cryptpad.org/">CryptPad</a> zamena za google office
     </td>
   <tr>-->
-  <!--<tr>
-    <td><a href="https://search.dmz.rs/">Search</a></td>
-    <td>
-      <a href="https://github.com/searxng/searxng/">SearXNG</a> instanca koju
-      koristimo za pretraživanje Interneta. Zamena za Google.
-    </td>
-  </tr>-->
   <tr>
-    <td><a href="https://pastebin.dmz.rs/">Pastebin</a></td>
+    <td><a href="https://invidious.dmz.rs/" target="_blank">Invidious</a></td>
     <td>
-      <a href="https://privatebin.info/">PrivateBin</a> instanca koju koristimo
+      <a href="https://invidious.io/" target="_blank">Invidious</a> instanca kao alternativa za YouTube.
-      za brzo deljenje tekstualnih fajlova
     </td>
   </tr>
   <tr>
-    <td><a href="ssh://soft.dmz.rs:2222/">Soft Serve</a></td>
+    <td><a href="https://search.dmz.rs/" target="_blank">Search</a></td>
     <td>
-      <a href="https://github.com/charmbracelet/soft-serve">Soft Serve</a>
+      <a href="https://github.com/searxng/searxng/" target="_blank">SearXNG</a> instanca za pretraživanje Interneta. Zamena za Google.
-      instanca koju koristimo kao zamenu za Gitea servis. Soft Serve radi
+    </td>
-      potpuno iz terminala
+  </tr>
+  <tr>
+    <td><a href="https://pastebin.dmz.rs/" target="_blank">Pastebin</a></td>
+    <td>
+      <a href="https://privatebin.info/" target="_blank">PrivateBin</a> instanca za brzo deljenje tekstualnih fajlova, kodova, logova i sl.
+    </td>
+  </tr>
+  <tr>
+    <td><a href="ssh://soft.dmz.rs:2222/" target="_blank">Soft Serve</a></td>
+    <td>
+      <a href="https://github.com/charmbracelet/soft-serve" target="_blank">Soft Serve</a>
+      TUI git instanca. Soft Serve radi potpuno iz terminala preko ssh.
     </td>
   </tr>
 </table>
 <p>
   Ovo su neki od servisa koje trenutno održavamo na našim serverima. Da bi
   koristio ove servise, <em>možeš</em> da se registuješ na svaki servis posebno,
-  a možeš i da napraviš jedinstveni <a href="/account">nalog</a> na našem
+  a možeš i da napraviš jedinstveni <a href="/account" target="_blank">nalog</a> na našem
   serveru i da koristiš sve servise sa istim nalogom.
 </p>

site/404.html

@@ -6,6 +6,7 @@
   <link rel="stylesheet" href="/styles/style.css">
   <link rel="stylesheet" href="/styles/404.css">
   <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js"></script>
   <title>404</title>
 </head>
 <body>

site/deconference.html

@@ -32,18 +32,17 @@
     <link rel="stylesheet" href="/styles/style.css" />
     <link rel="stylesheet" href="/styles/deconference.css">
     <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" />
+    <script src="/scripts/main.js"></script>
     <title>Dekonferencija Decentrala</title>
     <link rel="alternate" hreflang="en" href="/en/deconference" />
   </head>
   <body>
-    <input type="checkbox" id="menu-toggle" />
-    <input type="checkbox" id="theme-toggle" />
     <header>
       <a id="logo" href="/">
         <img src="/img/logo-light.svg" alt="Logo" />
         Decentrala
       </a>
-      <label for="theme-toggle" id="theme-switcher"></label>
+      <button id="theme-switcher"></button>
       <a class="lang" hreflang="en" href="/en/deconference">EN</a>
     </header>
     <main>
@@ -87,9 +86,9 @@
       </div>
     </main>
     <footer>
-      <label for="menu-toggle" class="hamburger">
+      <button class="hamburger closed">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </label>
+      </button>
       <nav class="menu">
         <a href="/events">Događaji</a>
         <a href="/services">Servisi</a>

site/scripts/main.js

@@ -0,0 +1,92 @@
+(function () {
+  const theme = window.localStorage.getItem("theme");
+  const prefersDark = window?.matchMedia?.("(prefers-color-scheme: dark)").matches;
+  const isDark = theme === "dark" || (!theme && prefersDark);
+
+  if (isDark) document.documentElement.classList.add("dark");
+
+  // Swap images as soon as DOM is ready (script runs in <head>, imgs not parsed yet)
+  if (isDark) {
+    window.addEventListener("DOMContentLoaded", () => {
+      document.querySelectorAll("img[src*='-light']").forEach((img) => {
+        img.src = img.src.replace("-light", "-dark");
+      });
+    }, { once: true });
+  }
+
+  window.changeTheme = (toDark) => {
+    if (toDark) {
+      window.localStorage.setItem("theme", "dark");
+      document.documentElement.classList.add("dark");
+      document.querySelectorAll("img[src*='-light']").forEach((img) => {
+        img.src = img.src.replace("-light", "-dark");
+      });
+    } else {
+      window.localStorage.setItem("theme", "light");
+      document.documentElement.classList.remove("dark");
+      document.querySelectorAll("img[src*='-dark']").forEach((img) => {
+        img.src = img.src.replace("-dark", "-light");
+      });
+    }
+  }
+})();
+
+window.addEventListener("DOMContentLoaded", () => {
+  const getById = (id) => document.getElementById(id);
+  const getByClass = (className) => document.getElementsByClassName(className)[0];
+
+  const themeBtn = getById("theme-switcher");
+  const hamburger = getByClass("hamburger");
+  const hamburgerIcon = hamburger?.children[0];
+  const menu = document.getElementsByTagName("nav")[0];
+  const main = document.getElementsByTagName("main")[0];
+  const isMenuOpen = () => hamburger?.classList.contains("open");
+
+  /* Functions */
+
+  const closeMenu = () => {
+    hamburger.classList = "hamburger closed"
+    hamburgerIcon.src = hamburgerIcon.src.replace("opened", "closed");
+    menu.classList = "menu closed";
+  }
+
+  const openMenu = () => {
+    hamburger.classList = "hamburger open"
+    hamburgerIcon.src = hamburgerIcon.src.replace("closed", "opened");
+    menu.classList = "menu open";
+  }
+
+  /* Listeners */
+
+  window.addEventListener("resize", () => isMenuOpen() && closeMenu());
+  if (main) main.addEventListener("click", () => isMenuOpen() && closeMenu());
+
+  /* Language persistence */
+  const currentLang = document.documentElement.lang || "sr";
+  const anchors = document.getElementsByTagName("a");
+  Array.from(anchors).forEach((a) => {
+    // Skip language switcher links
+    if (a.classList.contains("lang")) return;
+    const href = a.getAttribute("href");
+    if (!href) return;
+    if (href.startsWith("/")) {
+      // Replace existing language prefix or add one
+      if (href.startsWith("/sr") || href.startsWith("/en")) {
+        if (!href.startsWith(`/${currentLang}`)) {
+          a.setAttribute("href", `/${currentLang}${href.slice(3)}`);
+        }
+      } else if (currentLang !== "sr") {
+        // Only prepend language prefix for non-default languages
+        a.setAttribute("href", `/${currentLang}${href}`);
+      }
+    }
+  });
+  hamburger?.addEventListener("click", () => isMenuOpen() ? closeMenu() : openMenu());
+
+  if (themeBtn) {
+    themeBtn.addEventListener("click", () => {
+      const isDark = document.documentElement.classList.contains("dark");
+      changeTheme(!isDark);
+    });
+  }
+});

site/styles/style.css

@@ -11,39 +11,12 @@
   --bg: var(--light-bg);
 }
 
-/* Theme toggle via checkbox hack */
+html.dark {
-#theme-toggle {
-  display: none;
-}
-
-/* Use :has() selector to detect checkbox state */
-body:has(#theme-toggle:checked) {
   --border: var(--dark-border);
   --text: var(--dark-text);
   --bg: var(--dark-bg);
 }
 
-body:has(#theme-toggle:checked) header #theme-switcher {
-  background: linear-gradient(
-    90deg,
-    var(--dark-border) 0%,
-    var(--dark-border) 50%,
-    var(--dark-bg) 51%,
-    var(--dark-bg) 100%
-  );
-}
-
-body:has(#theme-toggle:checked) header #theme-switcher:hover {
-  border-color: var(--hightlight);
-  background: linear-gradient(
-    90deg,
-    var(--hightlight) 0%,
-    var(--hightlight) 50%,
-    var(--dark-bg) 51%,
-    var(--dark-bg) 100%
-  );
-}
-
 @font-face {
   font-family: "Iosevka";
   src: url("/font/iosevka-regular.woff") format("woff");
@@ -150,7 +123,6 @@ a:visited {
     var(--bg) 51%,
     var(--bg) 100%
   );
-  cursor: pointer;
 }
 
 #theme-switcher:hover {
@@ -164,27 +136,6 @@ a:visited {
   );
 }
 
-#theme-toggle:checked ~ body header #theme-switcher {
-  background: linear-gradient(
-    90deg,
-    var(--dark-border) 0%,
-    var(--dark-border) 50%,
-    var(--dark-bg) 51%,
-    var(--dark-bg) 100%
-  );
-}
-
-#theme-toggle:checked ~ body header #theme-switcher:hover {
-  border-color: var(--hightlight);
-  background: linear-gradient(
-    90deg,
-    var(--hightlight) 0%,
-    var(--hightlight) 50%,
-    var(--dark-bg) 51%,
-    var(--dark-bg) 100%
-  );
-}
-
 .lang {
   font-size: 2rem;
 }
@@ -261,46 +212,6 @@ button {
 
   .hamburger {
     display: block !important;
-    cursor: pointer;
-  }
-
-  #menu-toggle {
-    display: none;
-  }
-
-  #menu-toggle:checked ~ footer .menu {
-    display: flex;
-    flex-direction: column;
-  }
-
-  #menu-toggle:checked ~ footer .hamburger {
-    position: relative;
-  }
-
-  #menu-toggle:checked ~ footer .hamburger::after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-image: url("/img/strelica-opened-light.svg");
-    background-repeat: no-repeat;
-    background-size: contain;
-  }
-
-  /* Show hamburger icon on mobile */
-  .hamburger {
-    cursor: pointer;
-  }
-
-  .hamburger img {
-    width: 1.5rem;
-    height: 1.5rem;
-  }
-
-  #menu-toggle:checked ~ footer .hamburger img {
-    opacity: 0;
   }
 }
 

template/page-en.html

@@ -3,7 +3,6 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <input type="checkbox" id="theme-toggle" />
 
     <!-- <pre>
 
@@ -33,17 +32,16 @@
     <link rel="stylesheet" href="/styles/style.css" />
     <!--ADDITIONAL_STYLE-->
     <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" />
+    <script src="/scripts/main.js"></script>
     <title><!--TITLE--> Decentrala</title>
     <link rel="alternate" hreflang="sr" href="/PAGE_NAME" />
   </head>
   <body>
-    <input type="checkbox" id="theme-toggle" />
-    <input type="checkbox" id="menu-toggle" />
     <header>
       <a id="logo" href="/en/index">
         <img src="/img/logo-light.svg" alt="Logo" /> Decentrala
       </a>
-      <label for="theme-toggle" id="theme-switcher"></label>
+      <button id="theme-switcher"></button>
       <a class="lang" hreflang="sr" href="/PAGE_NAME">SR</a>
     </header>
     <main>
@@ -52,9 +50,9 @@
       </div>
     </main>
     <footer>
-      <label for="menu-toggle" class="hamburger">
+      <button class="hamburger closed">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </label>
+      </button>
       <nav class="menu">
         <a href="/en/events">Events</a>
         <a href="/en/services">Services</a>

template/page-sr.html

@@ -32,18 +32,17 @@
     <link rel="stylesheet" href="/styles/style.css" />
     <!--ADDITIONAL_STYLE-->
     <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon" />
+    <script src="/scripts/main.js"></script>
     <title><!--TITLE--> Decentrala</title>
     <link rel="alternate" hreflang="en" href="/en/PAGE_NAME" />
   </head>
   <body>
-    <input type="checkbox" id="menu-toggle" />
-    <input type="checkbox" id="theme-toggle" />
     <header>
       <a id="logo" href="/">
         <img src="/img/logo-light.svg" alt="Logo" />
         Decentrala
       </a>
-      <label for="theme-toggle" id="theme-switcher"></label>
+      <button id="theme-switcher"></button>
       <a class="lang" hreflang="en" href="/en/PAGE_NAME">EN</a>
     </header>
     <main>
@@ -52,9 +51,9 @@
       </div>
     </main>
     <footer>
-      <label for="menu-toggle" class="hamburger">
+      <button class="hamburger closed">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </label>
+      </button>
       <nav class="menu">
         <a href="/events">Događaji</a>
         <a href="/services">Servisi</a>