[NoJS] reimplementing js features without the js

This reverts commit cc0127dbe3.

.flake8

@@ -0,0 +1,8 @@
+[tool.black]
+line-length = 88
+target-version = ['py312']
+
+[tool.flake8]
+max-line-length = 88
+extend-ignore = "E203"
+exclude = ".venv"

.gitignore

@@ -17,6 +17,7 @@ events.ical
 .vscode/
 events.html
 events_archive.html
+nginx.pid
 
 
 !site/lif*

Makefile

@@ -0,0 +1,36 @@
+.PHONY: build events dev stop help prep lint format
+
+help:
+	@echo "Available commands:"
+	@echo "  make prep    - Create venv and install requirements"
+	@echo "  make events  - Update site from CSV (build pages + images)"
+	@echo "  make dev     - Start development server"
+	@echo "  make stop    - Stop development server"
+	@echo "  make build   - Full website build sequence"
+	@echo "  make help    - Show this help message"
+
+prep:
+	python3 -m venv .venv
+	./.venv/bin/pip install --upgrade pip
+	./.venv/bin/pip install -r requirements.txt
+
+build:
+	./.venv/bin/python atom_gen.py
+	./.venv/bin/python prep.py
+	./.venv/bin/python build_pages.py
+
+events:
+	./.venv/bin/python build_pages.py
+	./.venv/bin/python image_poster.py
+
+dev:
+	nginx -p . -c nginx.dev.conf
+
+stop:
+	nginx -p . -c nginx.dev.conf -s stop
+
+lint:
+	./.venv/bin/flake8 . --config .flake8 --exclude .venv
+
+format:
+	./.venv/bin/black .

README.md

@@ -1,40 +1,50 @@
 # Decentrala
 
-dmz.rs/decentrala.org website
+[dmz.rs](https://dmz.rs/) / [decentrala.org](https://decentrala.org) website
+
+## Setup
+
+First, prepare the virtual environment and install dependencies:
+
+```sh
+make prep
+```
 
 ## Build site
 
-Run
+To build the complete website:
 
 ```sh
-python atom_gen.py
+make build
-python prep.py
-python build_pages.py
 ```
 
-Complete website will be contained in `site/`. You can copy this to server.
+The complete website will be contained in `site/`. You can copy this to your server.
 
 ## Development server
 
-To start a development server, first build site, then run (possibly with `sudo`)
+To start a development server, first build the site, then run (possibly with `sudo`):
 
 ```sh
-nginx -p . -c nginx.dev.conf
+make dev
 ```
 
 To stop it:
 
 ```sh
-nginx -p . -s stop
+make stop
 ```
 
 ## Events
 
-To update events, update the `events.csv` then run commands
+To update events, update `dogadjaji.csv` then run:
 
 ```sh
-python build_pages.py # builds html out of csv
+make events
-python image_poster.py # generates images for events
+```
+
+For checking the csv data, suggestion is the [tennis pkg](https://github.com/gurgeous/tennis), with example command:
+```sh 
+tennis -nt --zebra --color on --theme dark --tail 20 dogadjaji.csv  
 ```
 
 

atom_gen.py

@@ -11,7 +11,7 @@ import os
 
 blogs_dir = os.fsencode("blog")
 
-#def blogposts_list_gen():
+# def blogposts_list_gen():
 #    output_list = []
 #    for file in os.listdir(blogs_dir):
 #        filename = os.fsdecode(file)
@@ -26,46 +26,48 @@ blogs_dir = os.fsencode("blog")
 #            output_list.append([author, title, time, content_html, full_path])
 #    return output_list
 
+
 def events_list_gen():
     output_list = []
     events_file = open("dogadjaji.csv", "r")
     for line in events_file.readlines():
-            date, time, location, title = line.split(", ")
+        date, time, location, title = line.split(", ")
-            author = "Decentrala"
+        author = "Decentrala"
-            content_html = f"Event is taking place at {location} on {date} at {time}. For more information see the forum at https://forum.dmz.rs"
+        content_html = f"Event is taking place at {location} on {date} at {time}. For more information see the forum at https://forum.dmz.rs"
 
-            output_list.append([author, title, content_html])
+        output_list.append([author, title, content_html])
     events_file.close()
     return output_list
 
+
 def feedgen(blogs, events):
     fg_blog = FeedGenerator()
-    fg_blog.id('http://dmz.rs/')
+    fg_blog.id("http://dmz.rs/")
-    fg_blog.title('Decentrala Blog')
+    fg_blog.title("Decentrala Blog")
-    fg_blog.author( {'name':'Decentrala','email':'dmz@dmz.rs'} )
+    fg_blog.author({"name": "Decentrala", "email": "dmz@dmz.rs"})
-    fg_blog.link( href='https://dmz.rs/atom_blog.xml', rel='self' )
+    fg_blog.link(href="https://dmz.rs/atom_blog.xml", rel="self")
 
     fg_events = FeedGenerator()
-    fg_events.id('http://dmz.rs/')
+    fg_events.id("http://dmz.rs/")
-    fg_events.title('Decentrala Blog')
+    fg_events.title("Decentrala Blog")
-    fg_events.author( {'name':'Decentrala','email':'dmz@dmz.rs'} )
+    fg_events.author({"name": "Decentrala", "email": "dmz@dmz.rs"})
-    fg_events.link( href='https://dmz.rs/atom_events.xml', rel='self' )
+    fg_events.link(href="https://dmz.rs/atom_events.xml", rel="self")
 
     for post in blogs:
         fe_blogs = fg_blog.add_entry()
         fe_blogs.id("https://dmz.rs/" + post[4][:-3] + ".html")
-        fe_blogs.author({'name': post[0]})
+        fe_blogs.author({"name": post[0]})
         fe_blogs.title(post[1])
         fe_blogs.updated(post[2])
-        fe_blogs.content(content=post[3], type='html')
+        fe_blogs.content(content=post[3], type="html")
 
     for event in events:
         fe_events = fg_events.add_entry()
         fe_events.id("https://dmz.rs/pages/events.html")
-        fe_events.author({'name': event[0]})
+        fe_events.author({"name": event[0]})
         fe_events.title(event[1])
         fe_events.updated(datetime.datetime.now(datetime.timezone.utc))
-        fe_events.content(content=event[2], type='html')
+        fe_events.content(content=event[2], type="html")
 
-    fg_blog.atom_file('site/atom_blog.xml')
+    fg_blog.atom_file("site/atom_blog.xml")
-    fg_events.atom_file('site/atom_events.xml')
+    fg_events.atom_file("site/atom_events.xml")

blog.py

@@ -5,8 +5,8 @@ from markdown import markdown as to_markdown
 
 blog = ""
 
-with open('blogs/Lorem Ipsum.md','rt') as file:
+with open("blogs/Lorem Ipsum.md", "rt") as file:
     blog = file.read()
 
-with open('blogs/Lorem Ipsum.html', 'wt') as file:
+with open("blogs/Lorem Ipsum.html", "wt") as file:
     file.write(to_markdown(blog))

build_pages.py

@@ -2,46 +2,83 @@
 import os
 
 PAGES = [
-    {'name': 'index', 'titleSR': 'Početna', 'titleEN': 'Home', 'style': 'home'},
+    {"name": "index", "titleSR": "Početna", "titleEN": "Home", "style": "home"},
-    {'name': 'account', 'titleSR': 'Nalog', 'titleEN': 'Account', 'style': 'account'},
+    {"name": "account", "titleSR": "Nalog", "titleEN": "Account", "style": "account"},
-    {'name': 'about', 'titleSR': 'O nama', 'titleEN': 'About us', 'style': 'about'},
+    {"name": "about", "titleSR": "O nama", "titleEN": "About us", "style": "about"},
-    {'name': 'statute', 'titleSR': 'Statut', 'titleEN': 'Statute', 'style': 'statute'},
+    {"name": "statute", "titleSR": "Statut", "titleEN": "Statute", "style": "statute"},
-    {'name': 'events', 'titleSR': 'Događaji', 'titleEN': 'Events', 'style': 'events'},
+    {"name": "events", "titleSR": "Događaji", "titleEN": "Events", "style": "events"},
-    {'name': 'events_archive', 'titleSR': 'Arhiva događaja', 'titleEN': 'Events archive', 'style': 'events'},
+    {
-    {'name': 'services', 'titleSR': 'Servisi', 'titleEN': 'Services', 'style': 'services'},
+        "name": "events_archive",
-    {'name': 'webring', 'titleSR': 'Webring', 'titleEN': 'Webring', 'style': ''},
+        "titleSR": "Arhiva događaja",
-    {'name': 'support', 'titleSR': 'Podrška', 'titleEN': 'Support', 'style': 'support'},
+        "titleEN": "Events archive",
-    {'name': 'deconference', 'titleSR': 'Dekonferencija', 'titleEN': 'Deconference', 'style': 'deconference'},
+        "style": "events",
+    },
+    {
+        "name": "services",
+        "titleSR": "Servisi",
+        "titleEN": "Services",
+        "style": "services",
+    },
+    {"name": "webring", "titleSR": "Webring", "titleEN": "Webring", "style": ""},
+    {"name": "support", "titleSR": "Podrška", "titleEN": "Support", "style": "support"},
+    {
+        "name": "deconference",
+        "titleSR": "Dekonferencija",
+        "titleEN": "Deconference",
+        "style": "deconference",
+    },
 ]
 
-def buildPage(filename: str, pageTitle: str, pageHtml: str, pageStyle: str, template: str) -> str:
+
-    template = template.replace('<!--TITLE-->', pageTitle)
+def buildPage(
-    style =  '' if not pageStyle else f'<link rel=\"stylesheet\" href=\"/styles/{pageStyle}.css\">'
+    filename: str, pageTitle: str, pageHtml: str, pageStyle: str, template: str, lang: str
-    template = template.replace('<!--ADDITIONAL_STYLE-->', style)
+) -> str:
-    template = template.replace('PAGE_NAME', filename)
+    template = template.replace("<!--TITLE-->", pageTitle)
-    template = template.replace('<!--MAIN-->', pageHtml)
+    style = (
+        ""
+        if not pageStyle
+        else f'<link rel="stylesheet" href="/styles/{pageStyle}.css">'
+    )
+    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
 
+
 def main():
-    os.makedirs('site/en/', exist_ok=True)
+    os.makedirs("site/en/", exist_ok=True)
-    with open('template/page-en.html') as fTempEN, open('template/page-sr.html') as fTempSR:
+    with open("template/page-en.html") as fTempEN, open(
+        "template/page-sr.html"
+    ) as fTempSR:
         templateSR = fTempSR.read()
         templateEN = fTempEN.read()
         for page in PAGES:
             with open(f'pages/sr/{page["name"]}.html') as f:
                 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)
+                html = buildPage(
-                f = open(f'site/{page["name"]}.html', 'w')
+                    page["name"], page["titleSR"], pageHtml, page["style"], templateSR, "sr"
+                )
+                f = open(f'site/{page["name"]}.html', "w")
                 f.write(html)
                 f.close()
             with open(f'pages/en/{page["name"]}.html') as f:
                 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)
+                html = buildPage(
-                f = open(f'site/en/{page["name"]}.html', 'w')
+                    page["name"], page["titleEN"], pageHtml, page["style"], templateEN, "en"
+                )
+                f = open(f'site/en/{page["name"]}.html', "w")
                 f.write(html)
                 f.close()
 
-if __name__ == '__main__':
+
+if __name__ == "__main__":
     main()

dogadjaji.csv

@@ -1,4 +1,4 @@
-datum, vreme, lokacija, tema, tip, link, temaE
+datum, vreme, lokacija, tema, tip, link, temaEN
 20-12-2022, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Uvod u računarske mreže,,,
 03-01-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Hackathon žurka, hack,,
 16-01-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Privatnost na internetu, workshop,,
@@ -362,6 +362,24 @@ datum, vreme, lokacija, tema, tip, link, temaE
 11-05-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Hardware hackathon,workshop,,Hardware hackathon
 12-05-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606,OpenSCAD,lecture,,OpenSCAD
 18-05-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,OverTheWire (Bandit),workshop,https://forum.dmz.rs/t/overthewire-bandit-1-14/1196,OverTheWire (Bandit)
-19-05-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606,Film: The Seventh Seal (1957),movie,,Movie: The Seventh Seal (1957)
+19-05-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606,The Strange Loop videos,lecture,https://www.thestrangeloop.com/index.html,The Strange Loop videos
 25-05-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Reverse engineering,workshop,,Reverse engineering
 26-05-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606,Film: TPB-AFK (2013),movie,,Movie: TPB-AFK (2013)
+31-05-2026, 17:00, Drustveni centar Loza - Ivankovačka 21 https://www.openstreetmap.org/node/4013343518,Uvod u informacionu bezbednost,lecture,,Introduction to information security
+01-06-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Sysadmin radionica,workshop,,Sysadmin workshop
+02-06-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606,Software hackathon,workshop,,Software hackathon
+07-06-2026, 10:00, KC Magacin - Marka Kraljevica 4 https://www.openstreetmap.org/#map=18/44.813246/20.453640, Zig Day,workshop,https://zig.day/europe/belgrade/1/,Zig Day
+08-06-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Decentrala offline forum,workshop,,Decentrala offline forum
+15-06-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,OverTheWire - Bandit CTF,workshop,,OverTheWire - Bandit CTF
+16-06-2026, 18:00, Matematički fakultet (Učionica JAG2) https://www.openstreetmap.org/node/3807078606, OSM contributing,workshop,,OSM contributing
+22-06-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,OverTheWire - Bandit CTF,workshop,,OverTheWire - Bandit CTF
+29-06-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,LAN party,party,,LAN Party
+06-07-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Linux ricing,lightning,,Linux ricing
+13-07-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Hardware CTF/Logic analyzer,workshop,,Hardware CTF/Logic analyzer
+20-07-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,T-shirt workshop,workshop,,T-shirt workshop
+27-07-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Lightning talks,lightning,,Lightning talks
+03-08-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,Sysadmin radionica,workshop,,Sysadmin workshop
+10-08-2026, 19:00, Xecut - Jovana Ćirilova 15 - Local 3 https://www.openstreetmap.org/node/11749277876,LAN party,party,,LAN Party
+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

image_poster.py

@@ -11,12 +11,36 @@ from cairosvg import svg2png
 CURRENT_TIME = dt.date.today()
 NEXT_MONTH = CURRENT_TIME + relativedelta.relativedelta(months=1, day=1)
 DAYS_OF_WEEK_SR = ("PON", "UTO", "SRE", "ČET", "PET", "SUB", "NED")
-DAYS_OF_WEEK_EN = ("MON", "TUE", "WED", "THU", "FRI", "SAT", "SUn")
+DAYS_OF_WEEK_EN = ("MON", "TUE", "WED", "THU", "FRI", "SAT", "SUN")
 
-MONTHS_SR = ("Januar", "Februar", "Mart", "April", "Maj", "Jun", "Jul",
+MONTHS_SR = (
-             "Avgust", "Septembar", "Oktobar", "Novembar", "Decembar")
+    "Januar",
-MONTHS_EN = ("January", "February", "March", "April", "May", "June", "July",
+    "Februar",
-             "August", "September", "October", "November", "December")
+    "Mart",
+    "April",
+    "Maj",
+    "Jun",
+    "Jul",
+    "Avgust",
+    "Septembar",
+    "Oktobar",
+    "Novembar",
+    "Decembar",
+)
+MONTHS_EN = (
+    "January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December",
+)
 
 HEADER_SR = "Plan za {}"
 
@@ -36,10 +60,15 @@ All events are always free
 
 def parseArgs(parser):
     """
-        Parse all arguments and return the list of argument values
+    Parse all arguments and return the list of argument values
     """
-    parser.add_argument("month", metavar="MM",
+    parser.add_argument(
-                        help="two digit number representing the month for which to generate poster", default="empty", nargs="?")
+        "month",
+        metavar="MM",
+        help="two digit number representing the month for which to generate poster",
+        default="empty",
+        nargs="?",
+    )
     return parser.parse_args()
 
 
@@ -51,18 +80,19 @@ def load_events(csv_path: str, month: int) -> list[dict]:
         next(csv_reader, None)
         for event in csv_reader:
             event_date = event[0]
-            event_date_parsed = dt.datetime.strptime(
+            event_date_parsed = dt.datetime.strptime(event_date, "%d-%m-%Y").date()
-                event_date, "%d-%m-%Y").date()
             event_time = event[1]
             event_title = event[3]
             event_title_en = event[3]
             if len(event) > 6:
                 event_title_en = event[6]
 
-            current_event = {"date": event_date_parsed,
+            current_event = {
-                             "time": event_time,
+                "date": event_date_parsed,
-                             "title": event_title.strip(),
+                "time": event_time,
-                             "title_en": event_title_en.strip()}
+                "title": event_title.strip(),
+                "title_en": event_title_en.strip(),
+            }
             if event_date_parsed >= month and event_date_parsed < monthafter:
                 events.append(current_event)
         return events
@@ -71,8 +101,7 @@ def load_events(csv_path: str, month: int) -> list[dict]:
 def drawMesh(draw, img, fg, bg, font, W, H):
     def drawCircle(x, y):
         r = 50
-        draw.ellipse((x - r, y - r, x + r, y+r),
+        draw.ellipse((x - r, y - r, x + r, y + r), fill=fg, outline=(0, 0, 0), width=0)
-                     fill=fg, outline=(0, 0, 0), width=0)
 
     LCX = 415  # logo center x
     LCY = 4350  # logo center y
@@ -84,11 +113,15 @@ def drawMesh(draw, img, fg, bg, font, W, H):
     drawCircle(LCX + d, LCY)
 
     draw.line([(LCX - d, LCY), (LCX + d, LCY)], fill=fg, width=20, joint=None)
-    draw.line([(LCX, LCY), (LCX, LCY + d), (LCX + d, LCY),
+    draw.line(
-              (LCX, LCY - d)], fill=fg, width=20, joint=None)
+        [(LCX, LCY), (LCX, LCY + d), (LCX + d, LCY), (LCX, LCY - d)],
-    draw.text((LCX - 1.7*d, LCY + 1.5*d), "dmz.rs", font=font, fill=fg)
+        fill=fg,
+        width=20,
+        joint=None,
+    )
+    draw.text((LCX - 1.7 * d, LCY + 1.5 * d), "dmz.rs", font=font, fill=fg)
 
-    mesh_svg = svg2png(url='site/img/mesh-light.svg')
+    mesh_svg = svg2png(url="site/img/mesh-light.svg")
     mesh_svg_bytes = io.BytesIO(mesh_svg)
     mesh_img = Image.open(mesh_svg_bytes)
     if bg == (0, 0, 0):
@@ -107,35 +140,32 @@ def drawMesh(draw, img, fg, bg, font, W, H):
 
 
 def drawPoster(events, bg, fg, month: int, en: bool):
-    fontFacade = ImageFont.truetype('./site/font/Facade-Sud.woff', size=365)
+    fontFacade = ImageFont.truetype("./site/font/Facade-Sud.woff", size=365)
-    fontIosevka = ImageFont.truetype(
+    fontIosevka = ImageFont.truetype("./site/font/iosevka-regular.woff", size=200)
-        './site/font/iosevka-regular.woff', size=200)
+    fontIosevkaSmall = ImageFont.truetype("./site/font/iosevka-regular.woff", size=150)
-    fontIosevkaSmall = ImageFont.truetype(
-        './site/font/iosevka-regular.woff', size=150)
 
     W = 3508
     H = 4960
-    img = Image.new('RGB', (W, H), bg)
+    img = Image.new("RGB", (W, H), bg)
     draw = ImageDraw.Draw(img)
 
     drawMesh(draw, img, fg, bg, fontIosevka, W, H)
 
     title = "DECENTRALA"
     _, _, w, _ = draw.textbbox((0, 0), title, font=fontFacade)
-    draw.text(((W-w)/2, 165), title, font=fontFacade, fill=fg)
+    draw.text(((W - w) / 2, 165), title, font=fontFacade, fill=fg)
 
     header = HEADER_EN if en else HEADER_SR
     months = MONTHS_EN if en else MONTHS_SR
     header = header.format(months[month.month - 1])
 
     _, _, w, _ = draw.textbbox((0, 0), header, font=fontIosevka)
-    draw.text(((W-w)/2, 560), header, font=fontIosevka, fill=fg)
+    draw.text(((W - w) / 2, 560), header, font=fontIosevka, fill=fg)
 
     height = 890
 
     sub_header = SUBHEADER_EN if en else SUBHEADER_SR
-    draw.text((165, height), sub_header,
+    draw.text((165, height), sub_header, font=fontIosevkaSmall, fill=fg)
-              font=fontIosevkaSmall, fill=fg)
     height += 800
 
     # Write list of events to sperate text file as well
@@ -167,8 +197,7 @@ def drawPoster(events, bg, fg, month: int, en: bool):
 
 def main():
     # Parse arguments
-    parser = argparse.ArgumentParser(
+    parser = argparse.ArgumentParser(description="Generate images of the poster")
-        description="Generate images of the poster")
     args = parseArgs(parser)
 
     # Set month based on user input
@@ -176,22 +205,24 @@ def main():
     if args.month.isdigit():
         month = dt.date(CURRENT_TIME.year, int(args.month), 1)
     elif args.month != "empty":
-        print("Month has to be specified as a number. I will use next month as the default")
+        print(
+            "Month has to be specified as a number. I will use next month as the default"
+        )
 
     # Load events and draw a poseter
     events = load_events("dogadjaji.csv", month)
 
     img = drawPoster(events, (0, 0, 0), (20, 250, 50), month, False)
-    img.save('poster_dark.png')
+    img.save("poster_dark.png")
 
     img = drawPoster(events, (255, 255, 255), (0, 0, 0), month, False)
-    img.save('poster_light.png')
+    img.save("poster_light.png")
 
     img = drawPoster(events, (0, 0, 0), (20, 250, 50), month, True)
-    img.save('poster_dark_en.png')
+    img.save("poster_dark_en.png")
 
     img = drawPoster(events, (255, 255, 255), (0, 0, 0), month, True)
-    img.save('poster_light_en.png')
+    img.save("poster_light_en.png")
 
 
 if __name__ == "__main__":

nginx.dev.conf

@@ -1,9 +1,12 @@
 # Start nginx in this directory with `nginx -p . -c nginx.conf`
 # Stop nginx with `nginx -p . -s stop`
+pid nginx.pid;
+
 events {}
 
 http {
     # edit this for your system
+    types_hash_max_size 2048;
     types_hash_bucket_size 128;
     include /etc/nginx/mime.types;
 

pages/en/services.html

@@ -66,14 +66,14 @@
       <a href="https://github.com/searxng/searxg/">SearXNG</a> instance used for
       Web searching.
     </td>
-  </tr>
+  </tr> -->
   <tr>
     <td><a href="https://pastebin.dmz.rs/">Pastebin</a></td>
     <td>
       <a href="https://privatebin.info/">PrivateBin</a> instance we use for
       sharing text files
     </td>
-  </tr> -->
+  </tr>
   <tr>
     <td><a href="ssh://soft.dmz.rs:2222/">Soft Serve</a></td>
     <td>

pages/en/statute.html

@@ -4,12 +4,14 @@
   <p>
     Decentrala is a community, united around the principles of decentralized technology and the spreading of knowledge.  
   </p>
-  <label>Key values include:</label>
+  <div class="values">
-  <ul>
+    <label>Our key values include:</label>
-    <li>Equal access to technology</li>
+    <ul>
-    <li>Free software</li>
+      <li>Equal access to technology</li>
-    <li>Privacy and security</li>
+      <li>Free and open source software</li>
-  </ul>
+      <li>Privacy and security</li>
+    </ul>
+  </div>
   <p> Donations are accepted only from individuals, with no conditions or obligations. </p>
   <p> Only open-source services are hosted on the Decentrala infrastructure. </p>
   <p> Parts of the statute can be defined immutable, and cannot be voted on. </p>

pages/en/support.html

@@ -25,15 +25,15 @@
     that way you joining the decetralization.
   </p>
   <p>
-    Also, we accept donations in bitcoin and monero to the following addresses:
+    Also, we accept donations in bitcoin on the following address:
   </p>
   <ul>
     <li>Bitcoin: <i>bc1qjhsfgq79wuzzv32yml9zglwzf9qcwfj3atuy74</i></li>
-    <li>
+    <!-- <li>
       Monero:
       <i
         >8BESz45LnxrgCwZP32KieiN1D4LinCfsS1YjdFHfGXrVCmPs35167QsW1gd7qbff4UAtBbT6oWrkbfZnJm71HornVRiRZFS</i
       >
-    </li>
+    </li> -->
   </ul>
 </dd>

pages/sr/services.html

@@ -68,14 +68,14 @@
       <a href="https://github.com/searxng/searxng/">SearXNG</a> instanca koju
       koristimo za pretraživanje Interneta. Zamena za Google.
     </td>
-  </tr>
+  </tr>-->
   <tr>
     <td><a href="https://pastebin.dmz.rs/">Pastebin</a></td>
     <td>
       <a href="https://privatebin.info/">PrivateBin</a> instanca koju koristimo
       za brzo deljenje tekstualnih fajlova
     </td>
-  </tr>-->
+  </tr>
   <tr>
     <td><a href="ssh://soft.dmz.rs:2222/">Soft Serve</a></td>
     <td>

pages/sr/statute.html

@@ -3,9 +3,16 @@
 <div>
   <p>
     Decentrala je zajednica okupljena oko decentralizacije tehnologija i širenja
-    znanja. Decentralizacija uključuje ravnopravnost korišćenja tehnologije,
+    znanja.
-    slobodnog softvera, privatnost i bezbednost.
   </p>
+  <div class="values">
+    <label> Decentralizacija uključuje: </label>
+    <ul>
+      <li>Ravnopravnost korišćenja tehnologije</li>
+      <li>Slobodan software otvorenog koda</li>
+      <li>Privatnost i bezbednost.</li>
+    </ul>
+  </div>
   <p>
     Na Decentralinoj arhitekturi hostuju se samo servisi koji su otvorenog koda
   </p>
@@ -51,7 +58,8 @@
     dodavanja novog clana, ako je prisutan na tom sastanku.
   </p>
   <p>
-    Trenutni članovi glasačkog tela su pod pseudonimom malin, coja, bora, mad3v, txrpe, euffrat, netstat.
+    Trenutni članovi glasačkog tela su pod pseudonimom malin, coja, bora, mad3v,
+    txrpe, euffrat, netstat.
   </p>
 </div>
 

pages/sr/support.html

@@ -24,14 +24,16 @@
     Jednostavno koriscenje naseg softwera se takodje racuna kao doprinos, posto
     bi se time pridruzili decentralizaciji.
   </p>
-  <p>Takođe primamo donacije u bitcoinu i moneru na adresama:</p>
+  <p>Takođe primamo donacije u bitcoin na adresi:</p>
   <ul>
     <li>Bitcoin: <i>bc1qjhsfgq79wuzzv32yml9zglwzf9qcwfj3atuy74</i></li>
+    <!--
     <li>
       Monero:
       <i
         >8BESz45LnxrgCwZP32KieiN1D4LinCfsS1YjdFHfGXrVCmPs35167QsW1gd7qbff4UAtBbT6oWrkbfZnJm71HornVRiRZFS</i
       >
     </li>
+    -->
   </ul>
 </dd>

poster.py

@@ -7,10 +7,23 @@ EVENTS_CSV_PATH = "dogadjaji.csv"
 CURRENT_TIME = dt.date.today()
 NEXT_MONTH = CURRENT_TIME + relativedelta.relativedelta(months=1, day=1)
 DAYS_OF_WEEK_SR = ("PON", "UTO", "SRE", "ČET", "PET", "SUB", "NED")
-MONTHS_SR = ("Januar", "Februar", "Mart", "April", "Maj", "Jun", "Jul", "Avgust",\
+MONTHS_SR = (
-            "Septembar", "Oktobar", "Novembar", "Decembar")
+    "Januar",
+    "Februar",
+    "Mart",
+    "April",
+    "Maj",
+    "Jun",
+    "Jul",
+    "Avgust",
+    "Septembar",
+    "Oktobar",
+    "Novembar",
+    "Decembar",
+)
 
-def load_events(csv_path:str) -> list[dict]:
+
+def load_events(csv_path: str) -> list[dict]:
     events = []
     with open(csv_path) as csv_file:
         csv_reader = csv.reader(csv_file)
@@ -20,14 +33,17 @@ def load_events(csv_path:str) -> list[dict]:
             event_date_parsed = dt.datetime.strptime(event_date, "%d-%m-%Y").date()
             event_time = event[1]
             event_title = event[3]
-            current_event = {"date":event_date_parsed,
+            current_event = {
-                             "time":event_time,
+                "date": event_date_parsed,
-                             "title":event_title.strip()}
+                "time": event_time,
+                "title": event_title.strip(),
+            }
             if event_date_parsed >= NEXT_MONTH:
                 events.append(current_event)
         return events
 
-def render_table(events:list[dict])-> str:
+
+def render_table(events: list[dict]) -> str:
     html = ""
     for event in events:
         date = DAYS_OF_WEEK_SR[event["date"].weekday()]
@@ -36,12 +52,13 @@ def render_table(events:list[dict])-> str:
         html += f"\t\t\t<tr> <td>{date}</td> <td>{day}.</td> <td>{title}</td> </tr>\n"
     return html
 
+
 def render_page(table: str) -> str:
-    head = "<head><meta charset=\"UTF-8\"><link rel=\"stylesheet\"\
+    head = '<head><meta charset="UTF-8"><link rel="stylesheet"\
-href=\"styles/poster.css\"><head>"
+href="styles/poster.css"><head>'
     header = "<h1>DECENTRALA</h1>"
     subheader = f"<h2>Plan za {MONTHS_SR[NEXT_MONTH.month - 1]}</h2>"
-    link = "<div id=link><img src=\"/img/logo-light.svg\"> dmz.rs</div>"
+    link = '<div id=link><img src="/img/logo-light.svg"> dmz.rs</div>'
     p1 = "<p>Radionice počinju u <strong>19h</strong> u Društvenom centru Krov\
 u <strong>Kraljice Marije 47</strong>.</p>"
     p2 = "<p>Ulaz u zgradu je u prolazu pored Štark prodavnice slatkiša, odmah\
@@ -50,6 +67,7 @@ pored menjačnice. DC Krov je na poslednjem spratu.</p>"
     return f"<html>{head}<body><main>{header}{subheader}\
 <table>{table}</table>{footer}</main></body></html>"
 
+
 def main():
     events = load_events(EVENTS_CSV_PATH)
     table = render_table(events)
@@ -58,5 +76,6 @@ def main():
     f.write(page)
     f.close()
 
+
 if __name__ == "__main__":
     main()

prep.py

@@ -5,6 +5,13 @@ from datetime import datetime
 
 DAYS_SR = ["PON", "UTO", "SRE", "ČET", "PET", "SUB", "NED"]
 DAYS_EN = ["MON", "TUE", "WED", "THU", "FRI", "SAT", "SUN"]
+ICAL_LOCATION_ADDRESSES = {
+    "Xecut": "XECUT\\, Jovana Ćirilova 15\\, Local 3\\, Beograd\\, Serbia",
+    "Matematički fakultet (Učionica JAG2)": "Matematički fakultet (JAG2)\\, Vatroslava Jagića 5\\, Beograd\\, Serbia",
+    "Matematički fakultet (Učionica JAG3)": "Matematički fakultet (JAG3)\\, Vatroslava Jagića 5\\, Beograd\\, Serbia",
+    "Matematički fakultet (Učionica 153)": "Matematički fakultet\\, Svetog Nikole 39\\, Beograd\\, Serbia",
+}
+
 TYPES_DICT = {
     "hack": ("hakaton", "hackathon"),
     "lecture": ("predavanje", "lecture"),
@@ -18,48 +25,61 @@ TYPES_DICT = {
     "party": ("zabava", "entertainment"),
 }
 
-def load_events(csv_path:str) -> list[dict]:
+
+def load_events(csv_path: str) -> list[dict]:
     events = []
-    with open(csv_path) as csv_file:
+    with open(csv_path, encoding="utf-8") as csv_file:
-        csv_reader = csv.reader(csv_file, skipinitialspace=True)
+        csv_reader = csv.DictReader(csv_file, skipinitialspace=True)
-        next(csv_reader, None)
         for event in csv_reader:
-            event_date = event[0]
+            event_date = event["datum"]
             event_date_parsed = datetime.strptime(event_date, "%d-%m-%Y").date()
-            event_time = event[1]
+            event_time = event["vreme"]
-            event_location = event[2]
+            event_location = event["lokacija"]
-            event_title = event[3]
+            event_title = event["tema"]
-            types =  event[4].split()
+            types = event["tip"].split()
-            try:
+            link = event.get("link", "")
-                link = event[5]
+            current_event = {
-            except IndexError:
+                "date": event_date_parsed,
-                link = ""
+                "time": event_time,
-            current_event = {"date":event_date_parsed,
+                "location": event_location,
-                             "time":event_time,
+                "title": event_title.strip(),
-                             "location": event_location,
+                "types": types,
-                             "title":event_title.strip(),
+                "link": link,
-                             "types": types,
+            }
-                             "link": link}
             events.append(current_event)
         return events
 
+
 def build_html(events: list[dict], dayNames: list[str], typesNames: dict) -> str:
     events_html = []
     for event in events:
         title = event["title"]
         location = event["location"]
         date = event["date"]
-        date = dayNames[date.weekday()]+", "+str(date.day)+". "+str(date.month)+". "+str(date.year)+", "
+        date = (
-        time = event["time"]+"h"
+            dayNames[date.weekday()]
+            + ", "
+            + str(date.day)
+            + ". "
+            + str(date.month)
+            + ". "
+            + str(date.year)
+            + ", "
+        )
+        time = event["time"] + "h"
         event_html = []
         event_html.append(f"<div class='date'>{date} {time}</div>")
         if event["link"] != "":
-            event_html.append(f"<div class='title'><a href=\"{event['link']}\">{title}</a></div>")
+            event_html.append(
+                f"<div class='title'><a href=\"{event['link']}\">{title}</a></div>"
+            )
         else:
             event_html.append(f"<div class='title'>{title}</div>")
         if "https://" in location:
-            place,link = location.split("https://")
+            place, link = location.split("https://")
-            event_html.append(f"<div class='place'><a href=\"https://{link}\" target='_blank'>@{place.strip()}</a></div>")
+            event_html.append(
+                f"<div class='place'><a href=\"https://{link}\" target='_blank'>@{place.strip()}</a></div>"
+            )
         else:
             event_html.append(f"<div class='place'>@{location.strip()}</div>")
 
@@ -70,7 +90,7 @@ def build_html(events: list[dict], dayNames: list[str], typesNames: dict) -> str
                 if typesNames.get(t) is not None:
                     types_list += typesNames.get(t)
                     if t != last_item:
-                        types_list += ', '
+                        types_list += ", "
                 else:
                     print(f"Unknown type {t}!")
             types_list += "</div>"
@@ -80,6 +100,7 @@ def build_html(events: list[dict], dayNames: list[str], typesNames: dict) -> str
         events_html.append(f"\n<div class='event'>{event_html}</div>")
     return events_html
 
+
 def build_ical(events: list[dict]) -> str:
     today = datetime.today().now()
     # Header
@@ -96,7 +117,16 @@ def build_ical(events: list[dict]) -> str:
 
         uid = str(date.month).zfill(2) + str(date.day).zfill(2) + time[:2]
         date = str(date.year) + str(date.month).zfill(2) + str(date.day).zfill(2)
-        created = str(today.year) + str(today.month).zfill(2) + str(today.day).zfill(2) + "T" + str(today.hour).zfill(2) + str(today.minute).zfill(2) + str(today.second).zfill(2) + "Z"
+        created = (
+            str(today.year)
+            + str(today.month).zfill(2)
+            + str(today.day).zfill(2)
+            + "T"
+            + str(today.hour).zfill(2)
+            + str(today.minute).zfill(2)
+            + str(today.second).zfill(2)
+            + "Z"
+        )
         date = date + "T" + time.replace(":", "") + "00"
 
         event_template = ""
@@ -107,13 +137,12 @@ def build_ical(events: list[dict]) -> str:
         event_template = event_template.replace("<!--DATE-->", date)
         event_template = event_template.replace("<!--TITLE-->", title)
         event_template = event_template.replace("<!--URL-->", url)
-        if location.startswith("DC Krov"):
+        ical_location = location
-            event_template = event_template.replace("<!--LOCATION-->", "DC Krov\\, Kraljice Marije 47\\, 6\\, Beograd\\, Serbia")
+        for prefix, address in ICAL_LOCATION_ADDRESSES.items():
-        elif location.startswith("Matematički fakultet (Učionica 153)"):
+            if location.startswith(prefix):
-            event_template = event_template.replace("<!--LOCATION-->", "Matematički fakultet\\, Svetog Nikole 39\\, Beograd\\, Serbia")
+                ical_location = address
-        else:
+                break
-            event_template = event_template.replace("<!--LOCATION-->", location)
+        event_template = event_template.replace("<!--LOCATION-->", ical_location)
-
 
         events_ical += event_template
     # Footer
@@ -121,13 +150,14 @@ def build_ical(events: list[dict]) -> str:
         events_ical += file.read()
     return events_ical
 
+
 events = sorted(load_events("dogadjaji.csv"), key=lambda e: e["date"])
 
 today = datetime.today().date()
 
 past_events = list(filter(lambda e: e["date"] <= today, events))
 past_events.reverse()
-new_events  = list(filter(lambda e: e["date"] >= today, events))
+new_events = list(filter(lambda e: e["date"] >= today, events))
 
 
 page_template = ""
@@ -142,7 +172,7 @@ for key, value_pair in TYPES_DICT.items():
 # Build Serbian Events page
 new_events_html = build_html(new_events, DAYS_SR, sr_types)
 with open("template/events-sr.html", "r") as file:
-    page_template = ([line for line in file])
+    page_template = [line for line in file]
 
 with open("pages/sr/events.html", "w") as file:
     file.writelines(page_template + new_events_html)
@@ -150,7 +180,7 @@ with open("pages/sr/events.html", "w") as file:
 # Build English Events page
 new_events_html = build_html(new_events, DAYS_EN, en_types)
 with open("template/events-en.html", "r") as file:
-    page_template = ([line for line in file])
+    page_template = [line for line in file]
 
 with open("pages/en/events.html", "w") as file:
     file.writelines(page_template + new_events_html)
@@ -158,7 +188,7 @@ with open("pages/en/events.html", "w") as file:
 # Build Serbian Archive page
 past_events_html = build_html(past_events, DAYS_SR, sr_types)
 with open("template/events_archive-sr.html", "r") as file:
-    page_template = ([line for line in file])
+    page_template = [line for line in file]
 
 with open("pages/sr/events_archive.html", "w") as file:
     file.writelines(page_template + past_events_html)
@@ -166,7 +196,7 @@ with open("pages/sr/events_archive.html", "w") as file:
 # Build English Archive page
 past_events_html = build_html(past_events, DAYS_EN, en_types)
 with open("template/events_archive-en.html", "r") as file:
-    page_template = ([line for line in file])
+    page_template = [line for line in file]
 
 with open("pages/en/events_archive.html", "w") as file:
     file.writelines(page_template + past_events_html)
@@ -176,4 +206,3 @@ new_events_ical = build_ical(new_events)
 # Build ical
 with open("site/events.ical", "w") as file:
     file.write(build_ical(new_events))
-

site/404.html

@@ -6,7 +6,6 @@
   <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" defer></script>
   <title>404</title>
 </head>
 <body>

site/deconference.html

@@ -1,16 +1,6 @@
 <!doctype html>
 <html lang="sr">
   <head>
-    <script>
-      (function () {
-        const theme = localStorage.getItem("theme");
-        const prefersDark = window.matchMedia(
-          "(prefers-color-scheme: dark)",
-        ).matches;
-        if (theme === "dark" || (!theme && prefersDark))
-          document.documentElement.classList.add("dark");
-      })();
-    </script>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
@@ -42,17 +32,18 @@
     <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" defer></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>
-      <button id="theme-switcher"></button>
+      <label for="theme-toggle" id="theme-switcher"></label>
       <a class="lang" hreflang="en" href="/en/deconference">EN</a>
     </header>
     <main>
@@ -96,9 +87,9 @@
       </div>
     </main>
     <footer>
-      <button class="hamburger closed">
+      <label for="menu-toggle" class="hamburger">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </button>
+      </label>
       <nav class="menu">
         <a href="/events">Događaji</a>
         <a href="/services">Servisi</a>

site/scripts/main.js

@@ -1,59 +0,0 @@
-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 imgs = document.getElementsByTagName("img");
-const main = document.getElementsByTagName("main")[0];
-const isMenuOpen = () => hamburger.classList.contains("open");
-const theme = window.localStorage.getItem("theme");
-
-/* Functions */
-
-const changeToDarkTheme = () => {
-  document.documentElement.classList.add("dark");
-  themeBtn?.setAttribute("title", "turn the light on");
-  Array.from(imgs).forEach((img) => {
-    if (img.src.includes("-light")) img.src = img.src.replace("-light", "-dark");
-  });
-}
-
-const changeToLightTheme = () => {
-  document.documentElement.classList.remove("dark");
-  themeBtn?.setAttribute("title", "turn the light off");
-  Array.from(imgs).forEach((img) => {
-    if (img.src.includes("-dark")) img.src = img.src.replace("-dark", "-light");
-  });
-}
-
-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());
-main.addEventListener("click", () => isMenuOpen() && closeMenu());
-hamburger.addEventListener("click", () => isMenuOpen() ? closeMenu() : openMenu());
-
-themeBtn.addEventListener("click", () => {
-  const title = themeBtn.getAttribute("title") ?? "off"
-  if (title.indexOf("off") !== -1) changeToDarkTheme();
-  else changeToLightTheme();
-});
-
-/* Rest */
-
-const userPerfersDark = window?.matchMedia?.("(prefers-color-scheme: dark)").matches
-if (!theme && userPerfersDark) changeToDarkTheme();
-else theme === "light" ? changeToLightTheme() : changeToDarkTheme();

site/styles/statute.css

@@ -8,3 +8,15 @@ h2 {
 p {
   padding-bottom: 1.5rem;
 }
+
+.values {
+  margin-bottom: 1.5rem;
+  label {
+    display: block;
+    padding-bottom: 1rem;
+  }
+
+  ul > li {
+    padding-left: 1.5rem;
+  }
+}

site/styles/style.css

@@ -11,12 +11,39 @@
   --bg: var(--light-bg);
 }
 
-html.dark {
+/* Theme toggle via checkbox hack */
+#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");
@@ -123,6 +150,7 @@ a:visited {
     var(--bg) 51%,
     var(--bg) 100%
   );
+  cursor: pointer;
 }
 
 #theme-switcher:hover {
@@ -136,6 +164,27 @@ 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;
 }
@@ -212,6 +261,46 @@ 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/events-en.html

@@ -9,7 +9,6 @@
     Events are also available as an
     <a href="https://dmz.rs/events.ical">ical</a> file.
   </p>
-  <p>We also provide <a href="https://dmz.rs/events.ical">ical</a> file</p>
   <p>
     <a href="https://wiki.dmz.rs/en/kako-pronaci-prostor" target="_blank">
       Short description

template/page-en.html

@@ -1,18 +1,9 @@
 <!doctype html>
 <html lang="en">
   <head>
-    <script>
-      (function () {
-        const theme = localStorage.getItem("theme");
-        const prefersDark = window.matchMedia(
-          "(prefers-color-scheme: dark)",
-        ).matches;
-        if (theme === "dark" || (!theme && prefersDark))
-          document.documentElement.classList.add("dark");
-      })();
-    </script>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <input type="checkbox" id="theme-toggle" />
 
     <!-- <pre>
 
@@ -42,16 +33,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="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>
-      <button id="theme-switcher"></button>
+      <label for="theme-toggle" id="theme-switcher"></label>
       <a class="lang" hreflang="sr" href="/PAGE_NAME">SR</a>
     </header>
     <main>
@@ -60,9 +52,9 @@
       </div>
     </main>
     <footer>
-      <button class="hamburger closed">
+      <label for="menu-toggle" class="hamburger">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </button>
+      </label>
       <nav class="menu">
         <a href="/en/events">Events</a>
         <a href="/en/services">Services</a>

template/page-sr.html

@@ -1,16 +1,6 @@
 <!doctype html>
 <html lang="sr">
   <head>
-    <script>
-      (function () {
-        const theme = localStorage.getItem("theme");
-        const prefersDark = window.matchMedia(
-          "(prefers-color-scheme: dark)",
-        ).matches;
-        if (theme === "dark" || (!theme && prefersDark))
-          document.documentElement.classList.add("dark");
-      })();
-    </script>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
@@ -42,17 +32,18 @@
     <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" defer></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>
-      <button id="theme-switcher"></button>
+      <label for="theme-toggle" id="theme-switcher"></label>
       <a class="lang" hreflang="en" href="/en/PAGE_NAME">EN</a>
     </header>
     <main>
@@ -61,9 +52,9 @@
       </div>
     </main>
     <footer>
-      <button class="hamburger closed">
+      <label for="menu-toggle" class="hamburger">
         <img src="/img/strelica-closed-light.svg" alt="Menu" />
-      </button>
+      </label>
       <nav class="menu">
         <a href="/events">Događaji</a>
         <a href="/services">Servisi</a>