Added license to video recording

.gitignore

@@ -1 +1,2 @@
 /dst/
+/tmp

Makefile

@@ -1,16 +1,24 @@
-EMIT_ASSETS := index.html 404.html info.html \
+PAGES := index.html 404.html javascript.html contact.html downloads.html
-			   styles.css icons.css \
+SHARED_FILES := stallman.webp stallman_2024.webp favicon.ico \
-			   countdown.js theme.js theme.js \
+				poster_cz.webp poster_en.webp poster_cz.jpg poster_en.jpg \
-			   stallman.webp stallman_2024.webp
+				word_cloud_cz.png word_cloud_en.png background.jpg \
+				moon.svg sun.svg narrow_light.svg narrow_dark.svg wide_light.svg wide_dark.svg \
+				lang_cz.svg lang_en.svg styles.css icons.css countdown.js theme.js lang.js
+STATIC_ASSETS := jetbrains_mono.woff2 poster_cz.png poster_en.png
 SEARCH_REPLACE := lib/search_and_replace/target/release/search_and_replace
 COMPONENTS := head.html header.html nav.html footer.html
 
 .PHONY: build
-build: $(EMIT_ASSETS:%=dst/cz/%) $(EMIT_ASSETS:%=dst/en/%) dst/favicon.ico
+build: $(PAGES:%=dst/cz/%) $(PAGES:%=dst/en/%) $(SHARED_FILES:%=dst/%) $(STATIC_ASSETS:%=dst/%)
+
+.PHONY: pack
+pack: dst/libre_liberec.tar.gz dst/photos_talk.tar.gz dst/photos_people.tar.gz dst/photos_talk.zip \
+	dst/photos_people.zip
 
 .PHONY: clean
 clean:
 	rm -rf dst
+	rm -rf tmp
 
 $(SEARCH_REPLACE): $(shell find lib/search_and_replace/src)
 	cd lib/search_and_replace && cargo build --release
@@ -25,38 +33,97 @@ define make_page
 	> $(2)
 endef
 
-dst/cz/%.html: cz_%.html $(SEARCH_REPLACE) $(COMPONENTS:%=components/cz/%)
+dst/cz/%.html: pages/cz/%.html $(SEARCH_REPLACE) $(COMPONENTS:%=components/cz/%)
 	@mkdir -p $(@D)
 	$(call make_page,$<,$@,cz)
 
-dst/cz/%.css: %.css
+dst/en/%.html: pages/en/%.html $(SEARCH_REPLACE) $(COMPONENTS:%=components/en/%)
-	@mkdir -p $(@D)
-	ln -f $< $@
-
-dst/cz/%.js: js/%.js
-	@mkdir -p $(@D)
-	ln -f $< $@
-
-dst/cz/%.webp: images/%.jpg
-	@mkdir -p $(@D)
-	magick $< $@
-
-dst/en/%.html: en_%.html $(SEARCH_REPLACE) $(COMPONENTS:%=components/en/%)
 	@mkdir -p $(@D)
 	$(call make_page,$<,$@,en)
 
-dst/en/%.css: %.css
+dst/%.css: styles/%.css
 	@mkdir -p $(@D)
 	ln -f $< $@
 
-dst/en/%.js: js/%.js
+dst/%.js: scripts/%.js
 	@mkdir -p $(@D)
 	ln -f $< $@
 
-dst/en/%.webp: images/%.jpg
+dst/poster_%.webp: images/poster_%.png
+	@mkdir -p $(@D)
+	magick $< -resize 2000x2000 $@
+
+dst/poster_%.jpg: images/poster_%.png
+	@mkdir -p $(@D)
+	magick $< -resize 2000x2000 $@
+
+dst/word_cloud_%.png: images/word_cloud_%.png
+	@mkdir -p $(@D)
+	magick $< -resize 2000x2000 $@
+
+dst/background.jpg: images/background.jpg
+	@mkdir -p $(@D)
+	magick $< -quality 80 $@
+
+dst/%.jpg: images/%.jpg
+	@mkdir -p $(@D)
+	ln -f $< $@
+
+dst/%.webp: images/%.jpg
 	@mkdir -p $(@D)
 	magick $< $@
 
+dst/%.png: images/%.png
+	@mkdir -p $(@D)
+	ln -f $< $@
+
+dst/%.svg: icons/%.svg
+	@mkdir -p $(@D)
+	ln -f $< $@
+
 dst/favicon.ico: images/favicon.ico
 	@mkdir -p $(@D)
 	ln -f $< $@
+
+dst/%.woff2: fonts/%.woff2
+	@mkdir -p $(@D)
+	ln -f $< $@
+
+dst/libre_liberec.tar.gz: $(PAGES:%=dst/cz/%) $(PAGES:%=dst/en/%) $(SHARED_FILES:%=dst/%)
+	tar --transform='s,^dst/,libre_liberec/,' -czvf $@ $^ --owner=0 --group=0
+
+tmp/.anchor:
+	ln -sf "$$(mktemp -d)" tmp
+	touch tmp/.anchor
+
+tmp/photos_%.jpg: photos/%.* tmp/.anchor
+	@mkdir -p $(@D)
+	magick $< -quality 85 -strip $@
+
+dst/photos_talk.tar.gz: \
+	$(foreach t, $(shell ls photos/talk), tmp/photos_talk/$(t))
+	@mkdir -p $(@D)
+	rm -f $@
+	tar --transform='s,^tmp/,,' -czvf $@ \
+		$$(echo $^ | tr ' ' '\n' | sort) --owner=0 --group=0
+
+dst/photos_talk.zip: \
+	$(foreach t, $(shell ls photos/talk), tmp/photos_talk/$(t))
+	@mkdir -p $(@D)
+	rm -f $@
+	cd tmp && zip -r photos_talk.zip photos_talk
+	mv tmp/photos_talk.zip $@
+
+dst/photos_people.tar.gz: \
+	$(foreach t, $(shell ls photos/people), tmp/photos_people/$(t))
+	@mkdir -p $(@D)
+	rm -f $@
+	tar --transform='s,^tmp/,,' -czvf $@ \
+		$$(echo $^ | tr ' ' '\n' | sort) --owner=0 --group=0
+
+dst/photos_people.zip: \
+	$(foreach t, $(shell ls photos/talk), tmp/photos_talk/$(t))
+	@mkdir -p $(@D)
+	rm -f $@
+	cd tmp && zip -r photos_people.zip photos_people
+	mv tmp/photos_people.zip $@

components/cz/footer.html

@@ -1,3 +1,5 @@
 <footer>
+	<p>Tuto přednášku pořádá <a href="https://www.fm.tul.cz">Fakulta mechatroniky, informatiky a mezioborových studií</a> <a href="https://www.tul.cz">Technické univerzity v Liberci</a>.</p>
 	<p>Tato webová stránka podléhá licenci GNU Free Documentation License v1.3.</p>
+	<p>&copy; <a href="https://zumepro.cz/">Zumepro</a>, 2025</p>
 </footer>

components/cz/head.html

@@ -1,7 +1,8 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta name="theme-color" content="darkred">
-<link rel="icon" type="image/png" href="favicon.png">
+<link rel="icon" type="image/vnd.microsoft.icon" href="../favicon.ico">
-<link href="icons.css" rel="stylesheet">
+<link href="../icons.css" rel="stylesheet">
-<link href="styles.css" rel="stylesheet">
+<link href="../styles.css" rel="stylesheet">
-<script src="theme.js"></script>
+<script src="../theme.js"></script>
+<script src="../lang.js"></script>

components/cz/header.html

@@ -1,10 +1,10 @@
 <header>
 	<div>
-		<div class="header-title">Svobodný software Liberec</div>
+		<div class="header-title">Dr Richard Stallman</div>
-		<div class="header-subtitle">Richard Stallman na Technické univerzitě v Liberci</div>
+		<div class="header-subtitle">na Technické univerzitě v Liberci</div>
 	</div>
 	<div class="buttons">
-		<img src="data:," alt="Přepínač světlého a tmavého režimu" class="light-dark-switch" onclick="switch_theme();">
 		<img src="data:," alt="Přepínač širokého a úzkého rozvržení" class="layout-switch" onclick="switch_layout();">
+		<img src="data:," alt="Přepínač jazyka" class="lang-switch" onclick="switch_lang();">
 	</div>
 </header>

components/cz/nav.html

@@ -1,9 +1,17 @@
+<input type="checkbox" id="menu-trigger">
+<label class="menu-button" for="menu-trigger">
+	<div class="inner">
+		<div class="upper"></div>
+		<div class="center"></div>
+		<div class="lower"></div>
+	</div>
+</label>
 <nav>
 	<div>
 		<ul>
-			<li><a href=".">Domovská stránka</a></li>
+			<li><a href=".">Domů</a></li>
-			<li><a href="stallman">Richard Stallman</a></li>
+			<li><a href="contact">Kontakt</a></li>
-			<li><a href="free">Svobodný software</a></li>
+			<li><a href="downloads">Ke stažení</a></li>
 			<li><a href="javascript">JavaScript</a></li>
 		</ul>
 	</div>

components/en/footer.html

@@ -1,3 +1,5 @@
 <footer>
+	<p>This lecture is organized by the <a href="https://www.fm.tul.cz">Faculty of mechatronics, informatics and interdisciplinary studies</a> at the <a href="https://www.tul.cz">Technical University of Liberec</a>.</p>
 	<p>This website falls under the GNU Free Documentation License v1.3.</p>
+	<p>&copy; <a href="https://zumepro.cz/">Zumepro</a>, 2025</p>
 </footer>

components/en/head.html

@@ -1,7 +1,8 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta name="theme-color" content="darkred">
-<link rel="icon" type="image/png" href="favicon.png">
+<link rel="icon" type="image/vnd.microsoft.icon" href="../favicon.ico">
-<link href="icons.css" rel="stylesheet">
+<link href="../icons.css" rel="stylesheet">
-<link href="styles.css" rel="stylesheet">
+<link href="../styles.css" rel="stylesheet">
-<script src="theme.js"></script>
+<script src="../theme.js"></script>
+<script src="../lang.js"></script>

components/en/header.html

@@ -1,10 +1,10 @@
 <header>
 	<div>
-		<div class="header-title">Software Libre Liberec</div>
+		<div class="header-title">Dr Richard Stallman</div>
-		<div class="header-subtitle">Richard Stallman at Technical University of Liberec</div>
+		<div class="header-subtitle">at the Technical University of Liberec</div>
 	</div>
 	<div class="buttons">
-		<img src="data:," alt="Přepínač světlého a tmavého režimu" class="light-dark-switch" onclick="switch_theme();">
+		<img src="data:," alt="Wide/short layout switch" class="layout-switch" onclick="switch_layout();">
-		<img src="data:," alt="Přepínač širokého a úzkého rozvržení" class="layout-switch" onclick="switch_layout();">
+		<img src="data:," alt="Language selector" class="lang-switch" onclick="switch_lang();">
 	</div>
 </header>

components/en/nav.html

@@ -1,9 +1,17 @@
+<input type="checkbox" id="menu-trigger">
+<label class="menu-button" for="menu-trigger">
+	<div class="inner">
+		<div class="upper"></div>
+		<div class="center"></div>
+		<div class="lower"></div>
+	</div>
+</label>
 <nav>
 	<div>
 		<ul>
-			<li><a href=".">Homepage</a></li>
+			<li><a href=".">Home</a></li>
-			<li><a href="stallman">Richard Stallman</a></li>
+			<li><a href="contact">Contact</a></li>
-			<li><a href="free">Software Libre</a></li>
+			<li><a href="downloads">For Download</a></li>
 			<li><a href="javascript">JavaScript</a></li>
 		</ul>
 	</div>

cz_index.html

@@ -1,48 +0,0 @@
-<!DOCTYPE html>
-<html lang="cs">
-	<head>
-		<!--#include virtual="components/head.html" -->
-		<title>Svobodný software Liberec</title>
-		<meta name="description" content="Richard Stallman na Technické univerzitě v Liberci.">
-	</head>
-	<body>
-		<!--#include virtual="components/header.html" -->
-		<!--#include virtual="components/nav.html" -->
-		<main>
-			<h1>Richard Stallman o svobodném softwaru</h1>
-
-			<div class="img-text-container">
-				<div class="img-text">
-					<div class="countdown">--:--:--:--</div>
-				</div>
-				<a href="https://commons.wikimedia.org/wiki/File:Richard_Stallman_Bologna_2024_abc23.jpg">
-					<figure>
-						<img class="countdown-bg" src="stallman_2024.webp" alt="Pan Stallman v Itálii">
-						<figcaption>Snímek z přednášky pana Stallmana z roku 2024</figcaption>
-					</figure>
-				</a>
-			</div>
-
-			<p>
-				Akce se bude konat <b>7. května od 16:30 do 19:30</b> v aule budovy G na Technické univerzitě v Liberci.
-			</p>
-
-			<p>
-				Hlavní částí akce bude přednáška pana Richarda Stallmana týkající se svobodného softwaru &ndash;
-				hnutí, které sám pan Stallman v roce 1983 založil.
-				Zaměří se na nebezpečí neustálé rozšiřování nesvobodného softwaru v naší digitální společnosti,
-				jak nás jako uživatele takový software omezuje a jak proti němu můžeme pomocí svobodného softwaru bojovat.
-			</p>
-
-			<p>
-				Tato akce je organizována Fakultou mechatroniky, informatiky a mezioborových studií
-				Technické univerzity v Liberci. Jako většina přednášek pana Stallmana je i tato akce
-				určená pro širokou veřejnost. Bude se vybírat pouze dobrovolné vstupné,
-				po přednášce bude rovněž možné zakoupit předměty s tematikou operačního systému GNU
-				a Free Software Foundation.
-			</p>
-		</main>
-		<script src="countdown.js"></script>
-		<!--#include virtual="components/footer.html" -->
-	</body>
-</html>

cz_info.html

@@ -1,51 +0,0 @@
-<!DOCTYPE html>
-<html lang="cs">
-	<head>
-		<!--#include virtual="components/head.html" -->
-		<title>Richard Stallman - Svobodný software Liberec</title>
-		<meta name="description" content="Krátký životopis pana Stallmana.">
-		<script src="lang.js"></script>
-	</head>
-	<body>
-		<!--#include virtual="components/header.html" -->
-		<!--#include virtual="components/nav.html" -->
-		<main>
-			<h1>Kdo je Richard Stallman?</h1>
-
-			<a href="https://commons.wikimedia.org/wiki/File:Richard_Stallman_Bologna_2024_abc1.jpg">
-				<figure class="aside">
-					<img src="stallman.webp" alt="Richard Stallman">
-					<figcaption>Richard Stallman, 2024</figcaption>
-				</figure>
-			</a>
-
-			<div id="stallman_bio_cz">
-				<p>
-					Dr. Richard Stallman v roce 1983 založil hnutí svobodného softwaru
-					a následující rok započal vývoj operačního systému GNU
-					(vizte <a href="https://www.gnu.org">www.gnu.org</a>).
-					GNU je svobodný software, každý má možnost ho množit
-					a šířit dál, bez změn nebo i se změnami.
-					GNU/Linux (operační systém GNU s jádrem <a href="https://kernel.org/">Linux</a>)
-					se dnes využívá na desítkách milionů osobních počítačů.
-				</p>
-
-				<p>
-					Stallmanovi byla udělena <i>Cena Grace Hopperové</i> a <i>Cena Softwarových Systémů</i>
-					neziskovou organizací Association for Computing Machinery,
-					<i>Cena za sociální/ekonomické zlepšení</i> organizací Takeda Foundation a
-					<i>Cena Electronic Frontier Foundation</i> a mnoho čestných doktorátů.
-					Stallman je členem programu <i>MacArthur Fellowship</i>
-					a je členem <i><a href="https://www.internethalloffame.org/">Síně slávy Internetu</a></i>.
-				</p>
-
-				<p>
-					Dr. Richard Stallman<br>
-					Zakladatel <a href="https://www.fsf.org/">Free Software Foundation</a><br>
-					Zakladatel a vedoucí vývoje <a href="https://www.gnu.org/">operačního systému GNU</a>
-				</p>
-			</div>
-		</main>
-		<!--#include virtual="components/footer.html" -->
-	</body>
-</html>

doc/01_notes.md

@@ -0,0 +1,59 @@
+<!-- # Obecné -->
+<!-- - Je to Přednáška -->
+    <!-- - Skládá se z prezentace a interaktivní diskuze -->
+<!-- - Délka: 1h vystoupení Richarda Stallmana + 1h interaktivní diskuze -->
+<!-- - `přibližně dvouhodinový blok` -->
+
+# Plakát
+- Logo TUL pryč
+- Nadpis: Richard Stallman na Technické univerzitě v Liberci
+- Podnadpis pryč
+- Název FM TUL
+- 30 let
+- Bio Stallman blíž info packet (jak to chtěl Stallman)
+- Vstup zdarma
+- Budova G
+- Text blíž webu
+- Mnoha dalšího pryč
+- Bio Stallmana pryč
+- FSF do word cloudu
+
+# Web
+<!-- Úvod nad ~~plakátem~~ fotkou s word cloudem -->
+<!-- Odpočet dole (pod textem, nad fotkou) -->
+- Předělat index stránku do podoby plakátu
+<!-- - Info dopryč (spojit s indexem) -->
+<!-- - PDF s budovou G pryč -->
+- Ke stažení
+
+### Index
+<!-- - Úvod (fakulta mechatroniky Vás zve...) -->
+<!-- - Kde, kdy, v kolik -->
+<!-- - 16:30 -->
+<!-- - 2025 psát všude!! -->
+- Design plakátu (hlavně **obrázek Stallmana, word cloud**)
+<!-- - Hodiny pod text (před fotku) -->
+<!-- - Nad hodinama "Vstup zdarma" -->
+- Pro koho je přednáška (FAQ) - každý si tam najde to svoje
+<!-- - Obsah přednášky (co po přednášce - fotky, suvenýry) -->
+
+Sekce indexu:
+1. Header, menu
+2. Obecné
+    1. Header
+    2. Menu
+    3. Pozdrav/Úvod
+    4. Důležité info (kdy, kde, vstup zdarma)
+    5. Odpočet
+2. O Stallmanovi
+    1. Fotka Stallmana s word cloudem
+    2. Bio Stallmana (v hor layoutu vedle sebe ideálně)
+3. O přednášce
+    1. Obsah přednášky
+    2. Trvání přednášky
+    3. FAQ
+    4. Kde je aula
+4. Footer
+
+<!-- ### Kontakt -->
+<!-- - E-Mail na Janu Vitvarovou -->

doc/02_notes.md

@@ -0,0 +1,2 @@
+# Pro Ondru (hlavně neříkat nahlas)
+- Ztučnit O přednášce

en_index.html

@@ -1,48 +0,0 @@
-<!DOCTYPE html>
-<html lang="cs">
-	<head>
-		<!--#include virtual="components/head.html" -->
-		<title>Svobodný software Liberec</title>
-		<meta name="description" content="Richard Stallman at Technical University of Liberec.">
-	</head>
-	<body>
-		<!--#include virtual="components/header.html" -->
-		<!--#include virtual="components/nav.html" -->
-		<main>
-			<h1>Richard Stallman on free software</h1>
-
-			<div class="img-text-container">
-				<div class="img-text">
-					<div class="countdown">--:--:--:--</div>
-				</div>
-				<a href="https://commons.wikimedia.org/wiki/File:Richard_Stallman_Bologna_2024_abc23.jpg">
-					<figure>
-						<img class="countdown-bg" src="stallman_2024.webp" alt="Pan Stallman v Itálii">
-						<figcaption>Photograph from Mr Stallman's lecture in 2024</figcaption>
-					</figure>
-				</a>
-			</div>
-
-			<p>
-				The event will happen on the <b>7th of may from 16:30 to 19:30</b> in the auditorium of building G at Technical University of Liberec.
-			</p>
-
-			<p>
-				The main part of the event will be a lecture by Mr. Richard Stallman on free software &ndash;
-				a movement that Mr. Stallman himself founded in 1983.
-				It will focus on the dangers of the constant proliferation of non-free software in our digital society,
-				how such software limits us as users, and how we can fight against it with free software.
-			</p>
-
-			<p>
-				This event is organized by the Faculty of Mechatronics, Informatics and Interdisciplinary Studies
-				of the Technical University of Liberec. Like most of Mr. Stallman's lectures, this event
-				is intended for the general public. There will be a voluntary admission fee only,
-				after the lecture it will also be possible to purchase items with the theme of the GNU operating system
-				and the Free Software Foundation.
-			</p>
-		</main>
-		<script src="countdown.js"></script>
-		<!--#include virtual="components/footer.html" -->
-	</body>
-</html>

en_info.html

@@ -1,51 +0,0 @@
-<!DOCTYPE html>
-<html lang="cs">
-	<head>
-		<!--#include virtual="components/head.html" -->
-		<title>Richard Stallman - Software Libre Liberec</title>
-		<meta name="description" content="Short bio of mister Stallman.">
-		<script src="lang.js"></script>
-	</head>
-	<body>
-		<!--#include virtual="components/header.html" -->
-		<!--#include virtual="components/nav.html" -->
-		<main>
-			<h1>Who is Richard Stallman?</h1>
-
-			<a href="https://commons.wikimedia.org/wiki/File:Richard_Stallman_Bologna_2024_abc1.jpg">
-				<figure class="aside">
-					<img src="stallman.webp" alt="Richard Stallman">
-					<figcaption>Richard Stallman, 2024</figcaption>
-				</figure>
-			</a>
-
-			<div id="stallman_bio_en">
-				<p>
-					Dr. Richard Stallman launched the free software movement in 1983 and
-					started the development of the GNU operating system
-					(see <a href="https://www.gnu.org">www.gnu.org</a>) in 1984.
-					GNU is free software: everyone has the freedom to copy it
-					and redistribute it, with or without changes.  The GNU/Linux system,
-					basically the GNU operating system with <a href="https://kernel.org/">Linux</a>
-					as the kernel, is used on tens of millions of computers today.
-				</p>
-
-				<p>
-					Stallman has received the ACM Grace
-					Hopper Award and the ACM Software and Systems Award, a MacArthur
-					Foundation fellowship, the Electronic Frontier Foundation's Pioneer
-					Award, and the the Takeda Award for Social/Economic Betterment, as
-					well as many doctorates honoris causa, and has been inducted into the
-					<a href="https://www.internethalloffame.org/">Internet Hall of Fame</a>.
-				</p>
-
-				<p>
-					Dr Richard Stallman<br>
-					Founder of the <a href="https://www.fsf.org/">Free Software Foundation</a><br>
-					Founder and development leader of the <a href="https://www.gnu.org/">GNU operating system</a>
-				</p>
-			</div>
-		</main>
-		<!--#include virtual="components/footer.html" -->
-	</body>
-</html>

free.html

@@ -1,131 +0,0 @@
-<!DOCTYPE html>
-<html lang="cs">
-	<head>
-		<!--#include virtual="components/head.html" -->
-		<title>Svobodný software - Svobodný software Liberec</title>
-		<meta name="description" content="Vysvětlení pojmu svobodný software.">
-	</head>
-	<body>
-		<!--#include virtual="components/header.html" -->
-		<!--#include virtual="components/nav.html" -->
-		<main>
-			<a id="contents"></a>
-			<h1>Obsah</h1>
-
-			<ul>
-				<li><a href="#contents">Obsah</a></li>
-				<li>
-					<a href="#freesoftware">Svobodný software</a>
-					<ul>
-						<li><a href="#definition">Co je to?</a></li>
-						<li><a href="#inception">Jak vznikl?</a></li>
-						<li>
-							<a href="#othermovements">Jak se liší od ostatních hnutí?</a>
-							<ul>
-								<li><a href="#freeware">Freeware</a></li>
-								<li><a href="#opensource">Open Source</a></li>
-							</ul>
-						</li>
-					</ul>
-				</li>
-			</ul>
-
-			<a id="freesoftware"></a>
-			<h1>Svobodný software</h1>
-
-			<p>
-				Tato stránka slouží pro jedince, kteří buď o svobodném softwaru
-				(anglicky "free software") slyší poprvé, nebo o něm již někdy slyšeli,
-				ale nejsou si úplně jisti, co tento pojem opravdu znamená.
-			</p>
-
-			<p>
-				Většina informací na této stránce pochází webových stránek
-				<a href="https://www.gnu.org/">operačního systému GNU</a>.
-			</p>
-
-			<a id="definition"></a>
-			<h2>Co je to?</h2>
-
-			<p>
-				Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam in laoreet lectus.
-				Vestibulum hendrerit, arcu vel ullamcorper lacinia, nisi nibh mollis lacus,
-				a dapibus neque odio id risus. Quisque ultricies congue mi.
-				Proin eget nisl nec nisi aliquet interdum vitae quis metus.
-				Nunc id eros volutpat, hendrerit magna ut, vulputate dolor.
-				Duis ut ex et justo interdum aliquam. Phasellus ultrices, orci et facilisis sagittis,
-				ligula nulla gravida augue, nec maximus tortor tortor sit amet purus.
-				Quisque rhoncus commodo arcu, in condimentum lectus mollis ut.
-				Aenean pellentesque orci ac ex ullamcorper, at pharetra eros vestibulum.
-			</p>
-
-			<p>
-				Nullam eget ligula ac ante dapibus rhoncus. Aenean interdum, erat vel auctor congue,
-				metus elit gravida metus, et gravida dolor metus at nunc.
-				Aliquam auctor dolor at erat mollis, sit amet placerat massa commodo.
-				Fusce ultricies odio sed tortor interdum hendrerit.
-				Ut posuere lobortis dui, commodo placerat lacus pharetra eu.
-				Curabitur eu dolor eget nibh sagittis semper eu eget dolor.
-				Sed laoreet mi in viverra vulputate. Etiam posuere sem est, at malesuada enim auctor quis.
-			</p>
-
-			<a id="inception"></a>
-			<h2>Jak vznikl?</h2>
-
-			<p>
-				In tempor lacus nec odio ornare, vitae pretium ante faucibus.
-				Donec mattis justo quis condimentum accumsan. Phasellus lacinia elementum ultricies.
-				Morbi facilisis suscipit quam, eu porta sem consectetur in.
-				Vestibulum pretium pretium eros non blandit.
-				Nunc varius metus in felis facilisis pellentesque.
-				Cras placerat dolor nulla, sit amet venenatis lectus sagittis eu.
-				Duis tellus sem, porta eget faucibus at, efficitur eleifend libero.
-				Nunc eu felis urna. In dignissim lectus eget dui consequat fringilla.
-				Etiam sodales tincidunt finibus. Sed facilisis ex sed tellus posuere, a consequat magna malesuada.
-			</p>
-
-			<a id="othermovements"></a>
-			<h2>Jak se liší od ostatních hnutí?</h2>
-
-			<p>
-				Maecenas ut congue massa. Nullam finibus lorem ligula, ut faucibus diam hendrerit a.
-				Proin quis massa in ligula vulputate ultrices et ac neque. Donec mollis massa turpis.
-				Suspendisse potenti. In vel venenatis mi. Sed egestas nulla tortor, eu ornare nibh accumsan nec.
-				Donec egestas a justo eu ullamcorper. Vivamus feugiat lectus non justo vehicula viverra.
-				Phasellus eleifend ante sed felis sollicitudin scelerisque.
-				Proin sit amet leo in enim varius auctor. Mauris blandit rhoncus mauris.
-			</p>
-
-			<a id="freeware"></a>
-			<h3>Freeware</h3>
-
-			<p>
-				Sed ac lorem viverra, tempor libero id, ullamcorper turpis.
-				Donec dapibus diam risus, non rutrum mauris pharetra ut.
-				Vivamus lobortis in massa faucibus congue.
-				Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
-				Aenean sed tempor justo. Phasellus volutpat massa quis eleifend interdum.
-				Donec non lobortis leo. Maecenas vel lacus ut risus pretium fringilla.
-				Aliquam fermentum ex elit, non sagittis dui vestibulum ut.
-				Sed ipsum tellus, dictum eu molestie quis, tempor vitae ipsum.
-				Pellentesque laoreet porttitor felis, sit amet fermentum ante aliquet sed.
-			</p>
-
-			<a id="opensource"></a>
-			<h3>Open Source</h3>
-			
-			<p>
-				Nunc sodales dolor ut auctor porta. Proin rhoncus ultricies felis vel posuere.
-				In posuere velit vulputate, lobortis turpis pretium, porta nisi.
-				Vivamus elementum lobortis lacus nec lobortis.
-				Praesent lobortis dictum tortor, eget egestas nunc tempus at.
-				Curabitur rhoncus in dolor ut consectetur. Suspendisse aliquam aliquet magna ut ultrices.
-				Sed non magna sodales, rhoncus sapien vel, aliquam urna.
-				Quisque gravida est non diam mollis, et posuere sapien congue.
-				Quisque id nunc sed tortor hendrerit laoreet.
-				Sed tortor neque, porta ut laoreet in, mollis quis velit.
-			</p>
-		</main>
-		<!--#include virtual="components/footer.html" -->
-	</body>
-</html>

icons.css

@@ -1,13 +0,0 @@
-:root {
-	--light-theme-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <path id='path1' style='fill:%23ffff00;fill-opacity:1;stroke:%23808000;stroke-width:1.93183;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13.23697,0.96583465 A 9.3801207,9.39062 0 0 1 13.913872,4.465394 9.3801207,9.39062 0 0 1 4.5342249,13.855541 9.3801207,9.39062 0 0 1 0.96583659,13.131355 9.3801207,9.39062 0 0 0 9.652417,19.034079 9.3801207,9.39062 0 0 0 19.034085,9.6439329 9.3801207,9.39062 0 0 0 13.23697,0.96583465 Z' /> </g> </svg>");
-	--dark-theme-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <circle style='fill:%23ffff00;fill-opacity:1;stroke:%23808000;stroke-width:1.86627;stroke-dasharray:none;stroke-opacity:1' id='path1' cx='9.9999981' cy='9.9999981' r='9.0668631' /> </g> </svg>");
-
-	--light-narrow-layout-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 H 7' id='path8' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,1 h 6' id='path8-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,19 h 6' id='path8-3-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 H 7' id='path8-3-2-7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 V 7' id='path9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 19,1 V 7' id='path9-9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 19,13 v 6' id='path9-9-4' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 1,13 v 6' id='path9-9-4-6' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 7,13' id='path6-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,7 19,1' id='path6-2-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 7,7' id='path7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path10' /> </g> </svg>");
-
-	--light-wide-layout-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 7,13' id='path6-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,7 19,1' id='path6-2-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 7,7' id='path7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path7-1' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,7 H 7' id='path8' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,7 h 6' id='path8-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 h 6' id='path8-3-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,13 H 7' id='path8-3-2-7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 7,1 V 7' id='path9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,1 V 7' id='path9-9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 v 6' id='path9-9-4' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 7,13 v 6' id='path9-9-4-6' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23000000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path10' /> </g> </svg>");
-
-	--dark-narrow-layout-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 H 7' id='path8' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,1 h 6' id='path8-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,19 h 6' id='path8-3-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 H 7' id='path8-3-2-7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 V 7' id='path9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 19,1 V 7' id='path9-9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 19,13 v 6' id='path9-9-4' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 1,13 v 6' id='path9-9-4-6' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 7,13' id='path6-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,7 19,1' id='path6-2-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 7,7' id='path7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path10' /> </g> </svg>");
-
-	--dark-wide-layout-switch-icon: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'> <defs id='defs1' /> <g id='layer1'> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,19 7,13' id='path6-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,7 19,1' id='path6-2-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,1 7,7' id='path7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path7-1' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,7 H 7' id='path8' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,7 h 6' id='path8-3' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 h 6' id='path8-3-2' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 1,13 H 7' id='path8-3-2-7' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 7,1 V 7' id='path9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='M 13,1 V 7' id='path9-9' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 v 6' id='path9-9-4' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 7,13 v 6' id='path9-9-4-6' /> <path style='fill:%23ffff00;fill-opacity:1;stroke:%23ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1' d='m 13,13 6,6' id='path10' /> </g> </svg>");
-}
-

icons/lang_cz.svg

@@ -0,0 +1,10 @@
+<svg id="emoji" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg">
+  <g id="color">
+    <rect x="5" y="17" width="62" height="38" fill="#fff"/>
+    <rect x="5" y="36" width="62" height="19" fill="#d22f27"/>
+    <path fill="#1e50a0" d="m36 36-31 18.6v-37.2z"/>
+  </g>
+  <g id="line">
+    <rect x="5" y="17" width="62" height="38" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+  </g>
+</svg>

icons/lang_en.svg

@@ -0,0 +1,22 @@
+<svg id="emoji" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg">
+  <g id="color">
+    <rect x="5" y="17" width="62" height="38" fill="#1e50a0"/>
+    <g>
+      <polygon fill="#fff" points="40 28.856 40 32 50.181 32 67 21.691 67 17 59.346 17 40 28.856"/>
+      <polygon fill="#d22f27" points="67 17 67 17 63.173 17 40 31.203 40 32 43.482 32 67 17.586 67 17"/>
+      <polygon fill="#fff" points="59.347 55 67 55 67 55 67 50.308 50.182 40 40 40 40 43.143 59.347 55"/>
+      <polygon fill="#d22f27" points="67 55 67 52.653 46.355 40 41.568 40 66.042 55 67 55 67 55"/>
+      <polygon fill="#fff" points="32 43.144 32 40 21.819 40 5 50.309 5 55 12.654 55 32 43.144"/>
+      <polygon fill="#d22f27" points="5 55 5 55 8.827 55 32 40.797 32 40 28.518 40 5 54.414 5 55"/>
+      <polygon fill="#fff" points="12.653 17 5 17 5 17 5 21.692 21.818 32 32 32 32 28.857 12.653 17"/>
+      <polygon fill="#d22f27" points="5 17 5 19.347 25.646 32 30.432 32 5.958 17 5 17 5 17"/>
+      <rect x="5" y="31" width="62" height="10" fill="#fff"/>
+      <rect x="31" y="17" width="10" height="38" fill="#fff"/>
+      <rect x="5" y="33" width="62" height="6" fill="#d22f27"/>
+      <rect x="33" y="17" width="6" height="38" fill="#d22f27"/>
+    </g>
+  </g>
+  <g id="line">
+    <rect x="5" y="17" width="62" height="38" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+  </g>
+</svg>

icons/moon.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><path d="m13.23697.96583465a9.3801207 9.39062 0 0 1 .676902 3.49955935 9.3801207 9.39062 0 0 1 -9.3796471 9.390147 9.3801207 9.39062 0 0 1 -3.56838831-.724186 9.3801207 9.39062 0 0 0 8.68658041 5.902724 9.3801207 9.39062 0 0 0 9.381668-9.3901461 9.3801207 9.39062 0 0 0 -5.797115-8.67809825z" fill="#7f6500" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.93183"/></svg>

icons/narrow_dark.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><g stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="m1 19 6-6"/><path d="m13 7 6-6"/><path d="m1 1 6 6"/><path d="m13 13 6 6"/><path d="m1 7h6"/><path d="m13 7h6"/><path d="m13 13h6"/><path d="m1 13h6"/><path d="m7 1v6"/><path d="m13 1v6"/><path d="m13 13v6"/><path d="m7 13v6"/><path d="m13 13 6 6"/></g></svg>

icons/narrow_light.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><g stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="m1 19 6-6"/><path d="m13 7 6-6"/><path d="m1 1 6 6"/><path d="m13 13 6 6"/><path d="m1 7h6"/><path d="m13 7h6"/><path d="m13 13h6"/><path d="m1 13h6"/><path d="m7 1v6"/><path d="m13 1v6"/><path d="m13 13v6"/><path d="m7 13v6"/><path d="m13 13 6 6"/></g></svg>

icons/sun.svg

@@ -0,0 +1 @@
+<svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><circle cx="9.999998" cy="9.999998" fill="#ffcb00" r="9.066863"/></svg>

icons/wide_dark.svg

@@ -0,0 +1 @@
+<svg height="18" viewBox="0 0 18 18" width="18" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" transform="scale(.9)"><path d="m1 1h6"/><path d="m13 1h6"/><path d="m13 19h6"/><path d="m1 19h6"/><path d="m1 1v6"/><path d="m19 1v6"/><path d="m19 13v6"/><path d="m1 13v6"/><path d="m1 19 6-6"/><path d="m13 7 6-6"/><path d="m1 1 6 6"/><path d="m13 13 6 6"/></g></svg>

icons/wide_light.svg

@@ -0,0 +1 @@
+<svg height="18" viewBox="0 0 18 18" width="18" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" transform="scale(.9)"><path d="m1 1h6"/><path d="m13 1h6"/><path d="m13 19h6"/><path d="m1 19h6"/><path d="m1 1v6"/><path d="m19 1v6"/><path d="m19 13v6"/><path d="m1 13v6"/><path d="m1 19 6-6"/><path d="m13 7 6-6"/><path d="m1 1 6 6"/><path d="m13 13 6 6"/></g></svg>

js/lang.js

@@ -1,17 +0,0 @@
-// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later
-
-function change_lang(base) {
-	let cz = document.querySelector(base + "_cz");
-	let en = document.querySelector(base + "_en");
-
-	if(cz.style.display == "none") {
-		cz.style.display = "";
-		en.style.display = "none";
-	} else {
-		cz.style.display = "none";
-		en.style.display = "";
-	}
-}
-
-// @license-end
-

pages/cz/contact.html

@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="cs">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Kontakt - Svobodný software Liberec</title>
+		<meta name="description" content="Kontakt ohledně přednášky.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<h1>Kontakt</h1>
+
+			<p>
+				Pokud máte jakékoliv další dotazy, neváhejte a napište nám na následující emailovou adresu:
+			</p>
+
+			<p style="text-align: center;">
+				<b>jana.vitvarova</b> [zavináč] <b>tul</b> [tečka] <b>cz</b>
+			</p>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>
+
+

pages/cz/downloads.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="cs">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Ke stažení - Svobodný software Liberec</title>
+		<meta name="description" content="Materiály ke stažení ohledně této stránky.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<h1>Ke stažení</h1>
+
+			<p>
+				Všechny obrázky ke stažení podléhají licenci <a href="https://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International</a>.
+			</p>
+
+			<h2>Video z akce</h2>
+
+			<p>
+				Videozáznam podléhá licenci <a href="https://creativecommons.org/licenses/by-nd/4.0/">Creative Commons Attribution-NoDerivatives 4.0 International</a>.
+			</p>
+
+			<video width="100%" controls preload="none">
+				<source src="/tul_stallman_talk.mkv" type="video/webm">
+			</video>
+
+			<p><a href="/tul_stallman_talk.mkv" download>
+				Záznam z akce (.mkv - 2 GB)
+			</a></p>
+
+			<h2>Fotografie z akce</h2>
+
+			<p><a href="/photos_talk.tar.gz" download>
+				Archiv fotografií z akce (.tar.gz - 33 MB)
+			</a></p>
+
+			<p><a href="/photos_people.tar.gz" download>
+				Archiv fotografií lidí s Richardem Stallmanem (.tar.gz - 19.7 MB)
+			</a></p>
+
+			<p><a href="/photos_talk.zip" download>
+				Archiv fotografií z akce (.zip - 33 MB)
+			</a></p>
+
+			<p><a href="/photos_people.zip" download>
+				Archiv fotografií lidí s Richardem Stallmanem (.zip - 19.7 MB)
+			</a></p>
+
+			<h2>Plakát v češtině</h2>
+
+			<p><a href="/poster_cz.png" download>
+				Plakát v češtině (4960x7016 PNG - určeno pro tisk)
+			</a></p>
+
+			<p><a href="/poster_cz.jpg" download>
+				Plakát v češtině (1414x2000 JPG - určeno pro webovou distribuci)
+			</a></p>
+
+			<h2>Plakát v angličtině</h2>
+
+			<p><a href="/poster_en.png" download>
+				Plakát v angličtině (4960x7016 PNG - určeno pro tisk)
+			</a></p>
+
+			<p><a href="/poster_en.jpg" download>
+				Plakát v angličtině (1414x2000 JPG - určeno pro webovou distribuci)
+			</a></p>
+
+			<h2>Zdrojové soubory webu</h2>
+			<p><a href="/libre_liberec.tar.gz">Kód a soubory (.tar.gz)</a></p>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>
+

pages/cz/index.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="cs">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Svobodný software Liberec</title>
+		<meta name="description" content="Richard Stallman na Technické univerzitě v Liberci.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<p>
+				<b><a href="https://www.fm.tul.cz">Fakulta mechatroniky</a></b> dne 7. května 2025
+				pořádala přednášku o <b>svobodném softwaru</b> a <b>svobodě</b> v digitální společnosti s <b>Richardem Stallmanem</b>.
+			</p>
+
+			<p>
+				Nahrávku přednášky si můžete zobrazit <b><a href="/tul_stallman_talk.mkv">zde</a></b>.
+			</p>
+
+			<h1>Kdo je Richard Stallman?</h1>
+
+			<p>
+				Dr Richard Stallman v roce 1983 založil <b>hnutí svobodného softwaru</b>
+				a následující rok započal vývoj <b>operačního systému GNU</b>
+				(vizte <a href="https://www.gnu.org">www.gnu.org</a>).
+				GNU je svobodný software, každý má možnost ho množit
+				a šířit dál, bez změn nebo i se změnami.
+				<b>GNU/Linux</b> (operační systém GNU s jádrem <a href="https://kernel.org/">Linux</a>)
+				se dnes využívá na <b>desítkách milionů osobních počítačů</b>.
+			</p>
+
+			<p>
+				Stallmanovi byla udělena <b>Cena Grace Hopperové</b> a <b>Cena Softwarových Systémů</b>
+				neziskovou organizací Association for Computing Machinery,
+				<b>Cena za sociální/ekonomické zlepšení</b> organizací Takeda Foundation a
+				<b>Cena Electronic Frontier Foundation</b> a mnoho čestných doktorátů.
+				Stallman je členem programu <b>MacArthur Fellowship</b>
+				a je členem <a href="https://www.internethalloffame.org/">Síně slávy Internetu</a>.
+				Pokud vás zajímají i další jeho projekty nebo myšlenky, můžete navštívit jeho
+				<a href="https://stallman.org">osobní stránky</a>, kam pravidelně přidává nový obsah.
+			</p>
+
+			<p>
+				Dr <b>Richard Stallman</b><br>
+				Zakladatel <a href="https://www.fsf.org/">Free Software Foundation</a><br>
+				Zakladatel a vedoucí vývoje <a href="https://www.gnu.org/">operačního systému GNU</a>
+			</p>
+			
+			<figure class="poster">
+				<img src="../word_cloud_cz.png" alt="Plakát na přednášku s Richardem Stallmanem">
+			</figure>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>

pages/cz/javascript.html

@@ -12,11 +12,11 @@
 			<h1>Použitý JavaScript na tomto webu</h1>
 
 			<p>
-				Pro tvorbu tohoto webu jsme použili stopové množství JavaScriptu.
+				Pro tvorbu tohoto webu jsme použili stopové množství <b>JavaScriptu</b>.
 			</p>
 			<p>
-				Tato stránka Vám zajišťuje, že návštěva tohoto webu nenačítá žádný nesvobodný software
+			Tato stránka Vám zajišťuje, že návštěva tohoto webu načítá <b>pouze svobodný software</b>
-				(tzn. tento web načtete i s rozšířením LibreJS).
+			(tzn. tento web načtete i s rozšířením <b>LibreJS</b>).
 			</p>
 			<p>Zkontrolujte si prosím níže uvedené skripty a jejich licence.</p>
 			
@@ -34,17 +34,17 @@
 				</thead>
 				<tbody>
 					<tr>
-						<td><a href="js/countdown.js">countdown.js</a></td>
+						<td><a href="../countdown.js">countdown.js</a></td>
-						<td>Odpočet do začátku akce.</td>
+						<td>Odpočet do začátku přednášky.</td>
 						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
 					</tr>
 					<tr>
-						<td><a href="js/lang.js">lang.js</a></td>
+						<td><a href="../lang.js">lang.js</a></td>
-						<td>Přepínání jazyka vybraných prvků stránky.</td>
+						<td>Přepínání jazyka stránky.</td>
 						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
 					</tr>
 					<tr>
-						<td><a href="js/theme.js">theme.js</a></td>
+						<td><a href="../theme.js">theme.js</a></td>
 						<td>Přepínání mezi světlým a tmavým režimem.</td>
 						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
 					</tr>
@@ -54,3 +54,4 @@
 		<!--#include virtual="components/footer.html" -->
 	</body>
 </html>
+

pages/en/404.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="cs">
+<html lang="en">
 	<head>
 		<!--#include virtual="components/head.html" -->
 		<title>Page not found - Software Libre Liberec</title>

pages/en/contact.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Contact - Software Libre Liberec</title>
+		<meta name="description" content="Contacts regarding the lecture.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<h1>Contact</h1>
+
+			<p>
+				If you have any further questions, please do not hesitate and contact us on the following email: 
+			</p>
+
+			<p style="text-align: center;">
+				<b>jana.vitvarova</b> [at] <b>tul</b> [dot] <b>cz</b>
+			</p>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>
+

pages/en/downloads.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Downloads - Software Libre Liberec</title>
+		<meta name="description" content="Downloads for content on this site.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<h1>Downloads</h1>
+
+			<p>
+				All images for download are licensed under the <a href="https://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International</a> license.
+			</p>
+
+			<h2>Video of the event</h2>
+
+			<p>
+				The video recording is licensed under the <a href="https://creativecommons.org/licenses/by-nd/4.0/">Creative Commons Attribution-NoDerivatives 4.0 International</a> license.
+			</p>
+
+			<video width="100%" controls preload="none">
+				<source src="/tul_stallman_talk.mkv" type="video/webm">
+			</video>
+
+			<p><a href="/tul_stallman_talk.mkv" download>
+				Recording of the talk (.mkv - 2 GB)
+			</a></p>
+
+			<h2>Photos from the event</h2>
+
+			<p><a href="/photos_talk.tar.gz" download>
+				Archive with photos from the talk (.tar.gz - 33 MB)
+			</a></p>
+
+			<p><a href="/photos_people.tar.gz" download>
+				Archive with photos of people with Richard Stallman (.tar.gz - 19.7 MB)
+			</a></p>
+
+			<p><a href="/photos_talk.zip" download>
+				Archive with photos from the talk (.zip - 33 MB)
+			</a></p>
+
+			<p><a href="/photos_people.zip" download>
+				Archive with photos of people with Richard Stallman (.zip - 19.7 MB)
+			</a></p>
+
+			<h2>Poster in English</h2>
+
+			<p><a href="/poster_en.png" download>
+				Poster in English (4960x7016 PNG - for printing)
+			</a></p>
+
+			<p><a href="/poster_en.jpg" download>
+				Poster in English (1414x2000 JPG - for web distribution)
+			</a></p>
+
+			<h2>Poster in Czech</h2>
+
+			<p><a href="/poster_cz.png" download>
+				Poster in Czech (4960x7016 PNG - for printing)
+			</a></p>
+
+			<p><a href="/poster_cz.jpg" download>
+				Poster in Czech (1414x2000 JPG - for web distribution)
+			</a></p>
+
+			<h2>Web source files</h2>
+			<p><a href="/libre_liberec.tar.gz">Source code and files (.tar.gz)</a></p>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>
+

pages/en/index.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>Software Libre Liberec</title>
+		<meta name="description" content="Richard Stallman at Technical University of Liberec.">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<p>
+				The <b><a href="https://www.fm.tul.cz">Faculty of Mechatronics</a></b>
+				held a lecture about <b>free software</b> and <b>freedom</b> in the digital society with <b>Richard Stallman</b>.
+			</p>
+
+			<p>
+				You may watch a recording of the lecture <b><a href="/tul_stallman_talk.mkv">here</a></b>.
+			</p>
+
+			<h1>Who is Richard Stallman?</h1>
+
+			<p>
+				Dr Richard Stallman launched the <b>free software movement</b> in 1983 and
+				started the development of the <b>GNU operating system</b>
+				(see <a href="https://www.gnu.org">www.gnu.org</a>) in 1984.
+				GNU is free software: everyone has the freedom to copy it
+				and redistribute it, with or without changes. The <b>GNU/Linux</b> system,
+				basically the GNU operating system with <a href="https://kernel.org/">Linux</a>
+				as the kernel, is used on <b>tens of millions of computers today</b>.
+			</p>
+
+			<p>
+				Stallman has received the <b>ACM Grace
+				Hopper Award</b> and the <b>ACM Software and Systems Award</b>, a <b>MacArthur
+				Foundation fellowship</b>, the <b>Electronic Frontier Foundation's Pioneer
+				Award</b>, and the the <b>Takeda Award for Social/Economic Betterment</b>, as
+				well as many doctorates honoris causa, and has been inducted into the
+				<a href="https://www.internethalloffame.org/">Internet Hall of Fame</a>.
+				If you are also interested in his other projects or ideas, you can visit his
+				<a href="https://stallman.org">personal website</a>, where he regularly adds new content.
+			</p>
+
+			<p>
+				Dr Richard Stallman<br>
+				Founder of the <a href="https://www.fsf.org/">Free Software Foundation</a><br>
+				Founder and development leader of the <a href="https://www.gnu.org/">GNU operating system</a>
+			</p>
+
+			<figure class="poster">
+				<img src="../word_cloud_en.png" alt="Poster for Richard Stallman's lecture">
+			</figure>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>

pages/en/javascript.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<!--#include virtual="components/head.html" -->
+		<title>JavaScript - Software Libre Liberec</title>
+		<meta name="description" content="Explanation of JavaScript usage on this website">
+	</head>
+	<body>
+		<!--#include virtual="components/header.html" -->
+		<!--#include virtual="components/nav.html" -->
+		<main>
+			<h1>JavaScript used on this website</h1>
+
+			<p>
+				This website is enhanced with few short snippets of <b>JavaScript</b>.
+			</p>
+
+			<p>
+				This page insures that visiting any page of this website <b>only loads free software</b>
+				(which means that it will properly function on browsers with <b>LibreJS</b>).
+			</p>
+
+			<p>Please verify the following scripts and their licences.</p>
+
+			<table>
+				<caption>List of client scripts</caption>
+				<thead>
+					<tr>
+						<th rowspan=2>Script</th>
+						<th colspan=2>Description</th>
+					</tr>
+					<tr>
+						<th>Function</th>
+						<th>Licence</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td><a href="../countdown.js">countdown.js</a></td>
+						<td>Countdown until the start of the lecture.</td>
+						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
+					</tr>
+					<tr>
+						<td><a href="../lang.js">lang.js</a></td>
+						<td>Language switch.</td>
+						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
+					</tr>
+					<tr>
+						<td><a href="../theme.js">theme.js</a></td>
+						<td>Light/dark mode switch.</td>
+						<td><a href="https://www.gnu.org/licenses/gpl-3.0.en.html">GNU GPL v3</a></td>
+					</tr>
+				</tbody>
+			</table>
+		</main>
+		<!--#include virtual="components/footer.html" -->
+	</body>
+</html>
+

photos/people/.gitignore

@@ -0,0 +1,2 @@
+/*
+!/.gitignore

photos/talk/.gitignore

@@ -0,0 +1,2 @@
+/*
+!/.gitignore

scripts/countdown.js

@@ -1,6 +1,6 @@
 // @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later
 
-const target = new Date("May 7, 2025 16:30:00 GMT+0100");
+const target = new Date("May 7, 2025 16:30:00 GMT+0200");
 
 function update_time() {
 	let countdown = document.querySelector(".countdown");
@@ -8,13 +8,13 @@ function update_time() {
 	const now = new Date();
 
 	if(now >= target) {
-		countdown.innerHTML = "Akce již proběhla.<br>Děkujeme všem za návštěvu.";
+		countdown.innerHTML = "";
 		return;
 	}
 
 	const dur = Math.floor((target - now) / 1000);
 
-	const day = Math.floor(dur / 86400).toFixed(0).padStart(2, "0");
+	const day = Math.floor(dur / 86400).toFixed(0);
 	const hour = Math.floor((dur / 3600) % 24).toFixed(0).padStart(2, "0");
 	const min = Math.floor((dur / 60) % 60).toFixed(0).padStart(2, "0");
 	const sec = Math.floor(dur % 60).toFixed(0).padStart(2, "0");
@@ -23,7 +23,11 @@ function update_time() {
 	//const targettime = `${target.getHours()}:${target.getMinutes()}`
 
 	//countdown.innerHTML = `${targetdate} v ${targettime}<br><br>${day}:${hour}:${min}:${sec}`;
-	countdown.innerHTML = `${day}:${hour}:${min}:${sec}`;
+	if (day == "0") {
+		countdown.innerHTML = `${hour}:${min}:${sec}`;
+	} else {
+		countdown.innerHTML = `${day}d ${hour}:${min}:${sec}`;
+	}
 }
 
 update_time();

scripts/lang.js

@@ -0,0 +1,12 @@
+// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later
+
+function switch_lang() {
+	if(document.documentElement.lang == "en") {
+		window.location.href = window.location.href.replace("/en", "/cz");
+	} else {
+		window.location.href = window.location.href.replace("/cz", "/en");
+	}
+}
+
+// @license-end
+

styles.css

@@ -1,387 +0,0 @@
-:root {
-	--light-fg-color: black;
-	--light-bg-color: white;
-	--light-alt-bg-color: #FFFFD0;
-	--light-field-hover-bg-color: #F0F0F0;
-	--light-field-active-bg-color: #E0E0E0;
-	--light-link-idle-color: darkred;
-	--light-sep-color: gainsboro;
-	
-	--dark-fg-color: white;
-	--dark-bg-color: #202020;
-	--dark-alt-bg-color: #101010;
-	--dark-field-hover-bg-color: #000000;
-	--dark-field-active-bg-color: #404040;
-	--dark-link-idle-color: #ff8e8e;
-	--dark-sep-color: #2e2e2e;
-}
-
-:root {
-	color-scheme: light dark;
-
-	--nav-fg-color: white;
-	--nav-bg-color: darkred;
-	--nav-bg-color-selected: #C00000;
-	--text-subtle-color: gray;
-}
-
-@media (prefers-color-scheme: light) {
-	:root {
-		--fg-color: var(--light-fg-color);
-		--bg-color: var(--light-bg-color);
-		--alt-bg-color: var(--light-alt-bg-color);
-		--field-hover-bg-color: var(--light-field-hover-bg-color);
-		--field-active-bg-color: var(--light-field-active-bg-color);
-		--link-idle-color: var(--light-link-idle-color);
-
-		--theme-switch-icon: var(--light-theme-switch-icon);
-		--narrow-layout-switch-icon: var(--light-narrow-layout-switch-icon);
-		--wide-layout-switch-icon: var(--light-wide-layout-switch-icon);
-		--fg-gnu-head: var(--dark-gnu-head);
-		--bg-gnu-head: var(--light-gnu-head);
-
-		--sep-color: var(--light-sep-color);
-	}
-
-	[data-color-scheme="invert"] {
-		--fg-color: var(--dark-fg-color);
-		--bg-color: var(--dark-bg-color);
-		--alt-bg-color: var(--dark-alt-bg-color);
-		--field-hover-bg-color: var(--dark-field-hover-bg-color);
-		--field-active-bg-color: var(--dark-field-active-bg-color);
-		--link-idle-color: var(--dark-link-idle-color);
-
-		--theme-switch-icon: var(--dark-theme-switch-icon);
-		--narrow-layout-switch-icon: var(--dark-narrow-layout-switch-icon);
-		--wide-layout-switch-icon: var(--dark-wide-layout-switch-icon);
-		--fg-gnu-head: var(--light-gnu-head);
-		--bg-gnu-head: var(--dark-gnu-head);
-
-		--sep-color: var(--dark-sep-color);
-	}
-}
-
-@media (prefers-color-scheme: dark) {
-	:root {
-		--fg-color: var(--dark-fg-color);
-		--bg-color: var(--dark-bg-color);
-		--alt-bg-color: var(--dark-alt-bg-color);
-		--field-hover-bg-color: var(--dark-field-hover-bg-color);
-		--field-active-bg-color: var(--dark-field-active-bg-color);
-		--link-idle-color: var(--dark-link-idle-color);
-
-		--theme-switch-icon: var(--dark-theme-switch-icon);
-		--narrow-layout-switch-icon: var(--dark-narrow-layout-switch-icon);
-		--wide-layout-switch-icon: var(--dark-wide-layout-switch-icon);
-		--fg-gnu-head: var(--light-gnu-head);
-		--bg-gnu-head: var(--dark-gnu-head);
-
-		--sep-color: var(--dark-sep-color);
-	}
-	
-	[data-color-scheme="invert"] {
-		--fg-color: var(--light-fg-color);
-		--bg-color: var(--light-bg-color);
-		--alt-bg-color: var(--light-alt-bg-color);
-		--field-hover-bg-color: var(--light-field-hover-bg-color);
-		--field-active-bg-color: var(--light-field-active-bg-color);
-		--link-idle-color: var(--light-link-idle-color);
-
-		--theme-switch-icon: var(--light-theme-switch-icon);
-		--narrow-layout-switch-icon: var(--light-narrow-layout-switch-icon);
-		--wide-layout-switch-icon: var(--light-wide-layout-switch-icon);
-		--fg-gnu-head: var(--dark-gnu-head);
-		--bg-gnu-head: var(--light-gnu-head);
-
-		--sep-color: var(--light-sep-color);
-	}
-}
-
-:root {
-	--layout-switch-icon: var(--narrow-layout-switch-icon);
-}
-
-[data-layout="wide"] {
-	--layout-switch-icon: var(--wide-layout-switch-icon)
-}
-
-html {
-	background-color: var(--bg-color);
-	min-height: calc(100% - 32px);
-	margin: 0;
-}
-
-body {
-	font-family: "Noto Sans", sans-serif;
-	font-size: 16px;
-	display: flex;
-	flex-direction: column;
-	color: var(--fg-color);
-	background-color: var(--bg-color);
-	margin: 0;
-}
-
-header {
-	display: flex;
-	padding: 1.5em 0;
-	position: relative;
-	background-color: var(--bg-color);
-	align-items: center;
-	justify-content: space-between;
-	width: min(90%, 50em);
-	margin: auto;
-}
-
-[data-layout="wide"] header {
-	width: 90%;
-}
-
-header .buttons {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-}
-
-.light-dark-switch {
-	cursor: pointer;
-	content: var(--theme-switch-icon);
-	width: 20px;
-}
-
-.layout-switch {
-	cursor: pointer;
-	content: var(--layout-switch-icon);
-	width: 20px;
-}
-
-a {
-	color: var(--link-idle-color);
-}
-
-header * {
-	margin: 8px 0;
-}
-
-.header-title {
-	font-size: 2em;
-	font-weight: bold;
-}
-
-.header-subtitle {
-	color: var(--text-subtle-color);
-	font-size: 1.3em;
-}
-
-.full-width {
-	width: 100%;
-}
-
-.img-text-container {
-	position: relative;
-}
-
-.img-text {
-	position: absolute;
-	top: 0;
-	left: 0;
-	width: 100%;
-	height: 100%;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	opacity: 100%;
-	color: var(--fg-color);
-	z-index: 1;
-	pointer-events: none;
-}
-
-.countdown {
-	font-family: monospace;
-	font-weight: bold;
-	font-size: 48px;
-	text-align: center;
-}
-
-.countdown-bg {
-	opacity: 40%;
-	z-index: 0;
-}
-
-nav {
-	background-color: var(--nav-bg-color);
-	color: var(--nav-fg-color);
-	user-select: none;
-}
-
-nav div {
-	width: min(90%, 50em);
-	margin: auto;
-}
-
-[data-layout="wide"] nav div {
-	width: 90%;
-}
-
-main {
-	flex-grow: 1;
-	padding: 16px;
-	width: min(90%, 50em);
-	margin: auto;
-}
-
-[data-layout="wide"] main {
-	width: 90%;
-}
-
-.gnu-head {
-	content: var(--fg-gnu-head);
-}
-
-footer {
-	border-top: 1px solid var(--sep-color);
-	color: gray;
-	padding: 1em;
-	text-align: center;
-}
-
-footer>* {
-	margin: 8px 0;
-}
-
-h1 {
-	font-size: 1.5em;
-}
-
-h2 {
-	font-size: 1.25em;
-}
-
-h3 {
-	font-size: 1em;
-}
-
-table {
-	border-spacing: 0;
-	border: 1px solid var(--sep-color);
-}
-
-th, td {
-	background-color: var(--alt-bg-color);
-	border: 1px solid var(--sep-color);
-	padding: 4px;
-}
-
-ul li {
-	margin: 8px 0;
-}
-
-ol li {
-	margin: 8px 0;
-}
-
-@media (width >= 500px) {
-	figure.aside {
-		width: 200px;
-		margin: 0 0 16px 16px;
-		float: right;
-	}
-}
-
-figure img,svg,inserted-svg {
-	width: 100%;
-	height: auto;
-}
-
-figcaption {
-	font-style: italic;
-}
-
-nav ul {
-	width: 100%;
-	height: 100%;
-	display: flex;
-	flex-direction: row;
-	justify-content: center;
-	align-items: center;
-	margin: 0;
-	padding: 0;
-	list-style-type: none;
-}
-
-[data-layout="wide"] nav ul {
-	justify-content: left;
-	margin-left: -1em;
-}
-
-@media (width < 50rem) {
-	nav ul {
-		flex-direction: column;
-	}
-}
-
-nav ul li {
-	margin: 0;
-}
-
-nav ul li a {
-	display: block;
-	
-	padding: .5em 1em;
-
-	text-align: center;
-	text-decoration: none;
-	color: var(--nav-fg-color);
-	
-	font-weight: bold;
-
-	transition: background-color .3s;
-}
-
-nav ul li a:hover {
-	background-color: var(--nav-bg-color-selected);
-	color: var(--nav-fg-color);
-}
-
-nav ul li a:active {
-	color: var(--nav-fg-color);
-}
-
-nav ul li a:visited {
-	color: var(--nav-fg-color);
-}
-
-@media (width >= 50rem) {
-	:not([data-layout="wide"]) body {
-		margin: 0 auto;
-	}
-	
-	[data-layout="wide"] body {
-		margin: 0;
-	}
-}
-
-@media (width < 50rem) {
-	body {
-		margin: 0;
-	}
-	.img-text {
-		position: relative;
-		margin-bottom: 32px;
-	}
-	.layout-switch {
-		display: none;
-	}
-}
-
-@media print {
-	.light-dark-switch {
-		display: none;
-	}
-	.layout-switch {
-		display: none;
-	}
-	nav {
-		display: none;
-	}
-}
-

styles/icons.css

@@ -0,0 +1,10 @@
+:root {
+	--light-theme-switch-icon: url("./moon.svg");
+	--dark-theme-switch-icon: url("./sun.svg");
+	--light-narrow-layout-switch-icon: url("./wide_dark.svg");
+	--light-wide-layout-switch-icon: url("./narrow_dark.svg");
+	--dark-narrow-layout-switch-icon: url("./wide_light.svg");
+	--dark-wide-layout-switch-icon: url("./narrow_light.svg");
+	--cz-lang-switch-icon: url("./lang_cz.svg");
+	--en-lang-switch-icon: url("./lang_en.svg");
+}

styles/styles.css

@@ -0,0 +1,496 @@
+:root {
+	--dark-fg-color: white;
+	--dark-bg-color: black;
+	--dark-alt-bg-color: #101010;
+	--dark-field-hover-bg-color: #000000;
+	--dark-field-active-bg-color: #404040;
+	--dark-link-idle-color: #ff8e8e;
+	--dark-sep-color: #2e2e2e;
+}
+
+:root {
+	color-scheme: light dark;
+
+	--nav-fg-color: white;
+	--nav-bg-color: darkred;
+	--nav-bg-color-selected: #C00000;
+	--text-subtle-color: gray;
+}
+
+:root {
+	--fg-color: var(--dark-fg-color);
+	--bg-color: var(--dark-bg-color);
+	--alt-bg-color: var(--dark-alt-bg-color);
+	--field-hover-bg-color: var(--dark-field-hover-bg-color);
+	--field-active-bg-color: var(--dark-field-active-bg-color);
+	--link-idle-color: var(--dark-link-idle-color);
+
+	--theme-switch-icon: var(--dark-theme-switch-icon);
+	--narrow-layout-switch-icon: var(--dark-narrow-layout-switch-icon);
+	--wide-layout-switch-icon: var(--dark-wide-layout-switch-icon);
+	--fg-gnu-head: var(--light-gnu-head);
+	--bg-gnu-head: var(--dark-gnu-head);
+
+	--sep-color: var(--dark-sep-color);
+}
+
+[data-color-scheme="invert"] {
+	--fg-color: var(--light-fg-color);
+	--bg-color: var(--light-bg-color);
+	--alt-bg-color: var(--light-alt-bg-color);
+	--field-hover-bg-color: var(--light-field-hover-bg-color);
+	--field-active-bg-color: var(--light-field-active-bg-color);
+	--link-idle-color: var(--light-link-idle-color);
+
+	--theme-switch-icon: var(--light-theme-switch-icon);
+	--narrow-layout-switch-icon: var(--light-narrow-layout-switch-icon);
+	--wide-layout-switch-icon: var(--light-wide-layout-switch-icon);
+	--fg-gnu-head: var(--dark-gnu-head);
+	--bg-gnu-head: var(--light-gnu-head);
+
+	--sep-color: var(--light-sep-color);
+}
+
+:root {
+	--layout-switch-icon: var(--narrow-layout-switch-icon);
+	--lang-switch-icon: var(--en-lang-switch-icon);
+}
+
+[lang="en"] {
+	--lang-switch-icon: var(--cz-lang-switch-icon);
+}
+
+[data-layout="wide"] {
+	--layout-switch-icon: var(--wide-layout-switch-icon)
+}
+
+@font-face {
+	font-family: JetBrains Mono;
+	src: url("jetbrains_mono.woff2") format("woff2");
+}
+
+html {
+	background-color: var(--bg-color);
+	min-height: calc(100% - 32px);
+	margin: 0;
+}
+
+body {
+	background-image: url("background.jpg");
+	background-attachment: fixed;
+	background-size: cover;
+	background-position: center;
+	font-family: JetBrains Mono, "Noto Sans", sans-serif;
+	line-height: 1.8em;
+	word-spacing: .1em;
+	font-weight: 150;
+	letter-spacing: -.05ch;
+	display: flex;
+	flex-direction: column;
+	color: var(--fg-color);
+	background-color: var(--bg-color);
+	margin: 0;
+	min-height: 100vh;
+}
+
+header {
+	display: flex;
+	padding: 1.5em 0;
+	position: relative;
+	align-items: center;
+	justify-content: space-between;
+	width: min(90%, 50em);
+	margin: auto;
+}
+
+b {
+	font-weight: 600;
+}
+
+[data-layout="wide"] header {
+	width: 90%;
+}
+
+header .buttons {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	padding-left: 1em;
+}
+
+.light-dark-switch {
+	cursor: pointer;
+	content: var(--theme-switch-icon);
+	width: 20px;
+}
+
+.layout-switch {
+	cursor: pointer;
+	content: var(--layout-switch-icon);
+	width: 20px;
+}
+
+.lang-switch {
+	cursor: pointer;
+	content: var(--lang-switch-icon);
+	width: 20px;
+}
+
+a {
+	color: var(--link-idle-color);
+	text-decoration: none;
+}
+
+header * {
+	margin: 8px 0;
+}
+
+.header-title {
+	font-size: 2em;
+	font-weight: bold;
+}
+
+.header-subtitle {
+	color: var(--text-subtle-color);
+	font-size: 1.3em;
+}
+
+.full-width {
+	width: 100%;
+}
+
+.img-text-container {
+	position: relative;
+}
+
+.img-text {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	opacity: 100%;
+	color: var(--fg-color);
+	z-index: 1;
+	pointer-events: none;
+}
+
+.countdown {
+	font-family: monospace;
+	font-weight: bold;
+	font-size: 2em;
+	text-align: center;
+	margin: 2em auto;
+	padding: 0 .5em;
+	font-family: JetBrains Mono, monospace;
+	width: fit-content;
+	font-weight: bold;
+}
+
+@media only screen and (min-width: 50rem) {
+	.countdown {
+		font-size: 3em;
+	}
+}
+
+nav {
+	color: var(--nav-fg-color);
+	background-color: var(--nav-bg-color);
+	user-select: none;
+	text-transform: uppercase;
+	width: min(90%, 50em);
+	margin: auto;
+	margin-bottom: 2em;
+	border-radius: .5em;
+	box-shadow: .5em .5em 1em rgba(0, 0, 0, 0.2);
+	overflow: hidden;
+}
+
+nav div {
+	width: 100%;
+}
+
+[data-layout="wide"] nav {
+	width: 90%;
+}
+
+[data-layout="wide"] nav div {
+	width: 90%;
+}
+
+.menu-button {
+	display: none;
+	width: 100%;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	cursor: pointer;
+	margin: 1em 0;
+}
+
+.menu-button .inner {
+	display: flex;
+	flex-direction: column;
+}
+
+.menu-button .inner div {
+	display: block;
+	transition: .2s ease opacity, .2s ease transform, .2s ease width;
+	height: 3px;
+	width: 30px;
+	background-color: white;
+	border-radius: .1em;
+	margin: 3px 0;
+}
+
+#menu-trigger:checked + .menu-button .center {
+	width: 0;
+	transform: translateX(4px);
+}
+
+#menu-trigger:checked + .menu-button .upper {
+	transform: translateY(100%) translateY(6px) rotate(45deg);
+}
+
+#menu-trigger:checked + .menu-button .lower {
+	transform: translateY(-100%) translateY(-6px) rotate(-45deg);
+}
+
+#menu-trigger {
+	display: none;
+}
+
+@media only screen and (max-width: 50rem) {
+	.menu-button {
+		display: flex;
+	}
+
+	#menu-trigger ~ nav {
+		opacity: 0;
+	}
+
+	#menu-trigger:checked ~ nav {
+		opacity: 1;
+		height: 11.25em;
+	}
+
+	nav {
+		transition: .25s ease height, .25s ease opacity;
+		border-radius: 0;
+		width: 100%;
+		height: 0;
+		overflow: hidden;
+		margin-bottom: 0;
+	}
+
+	nav div {
+		width: 100% !important;
+	}
+}
+
+main {
+	flex-grow: 1;
+	padding: 16px;
+	width: min(90%, 50em);
+	margin: auto;
+}
+
+[data-layout="wide"] main {
+	width: 90%;
+}
+
+.gnu-head {
+	content: var(--fg-gnu-head);
+}
+
+footer {
+	border-top: 1px solid var(--sep-color);
+	color: gray;
+	padding: 1em;
+	width: fit-content;
+	margin: 2em auto;
+	margin-top: 4em;
+	font-size: .9em;
+	word-spacing: 0em;
+	line-height: 1em;
+}
+
+footer>* {
+	margin: 8px 0;
+}
+
+h1 {
+	margin: 2em 0;
+	margin-top: 4em;
+	font-size: 1.5em;
+	font-weight: bold;
+}
+
+h2 {
+	font-size: 1.25em;
+	font-weight: bolder;
+	margin-top: 3em;
+}
+
+h3 {
+	font-size: 1em;
+}
+
+table {
+	margin: 2em auto;
+	margin-top: 4em;
+	border-spacing: 0;
+	border: 1px solid var(--sep-color);
+}
+
+th, td {
+	background-color: var(--alt-bg-color);
+	border: 1px solid var(--sep-color);
+	padding: 4px;
+}
+
+ul li {
+	margin: 8px 0;
+}
+
+ol li {
+	margin: 8px 0;
+}
+
+@media (width >= 500px) {
+	figure.aside {
+		width: 200px;
+		margin: 0 0 16px 16px;
+		float: right;
+	}
+}
+
+figure img,svg,inserted-svg {
+	display: block;
+	margin: 0 auto;
+	max-width: 100%;
+	max-height: 100vh;
+}
+
+figcaption {
+	font-style: italic;
+}
+
+.poster {
+	margin: 5em auto !important;
+	max-width: 40rem;
+	filter: drop-shadow(0 0 5em black);
+}
+
+nav ul {
+	width: 100%;
+	height: 100%;
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	margin: 0;
+	padding: 0;
+	list-style-type: none;
+}
+
+[data-layout="wide"] nav ul {
+	justify-content: left;
+}
+
+@media (width < 50rem) {
+	nav ul {
+		flex-direction: column;
+	}
+
+	nav ul {
+		margin-left: 0 !important;
+	}
+
+	nav ul li {
+		width: 100%;
+	}
+}
+
+nav ul li {
+	margin: 0;
+}
+
+nav ul li a {
+	display: block;
+	
+	padding: .5em 1em;
+
+	text-align: center;
+	text-decoration: none;
+	color: var(--nav-fg-color);
+	
+	font-weight: bold;
+
+	transition: background-color .3s;
+}
+
+nav ul li a:hover {
+	background-color: var(--nav-bg-color-selected);
+	color: var(--nav-fg-color);
+}
+
+nav ul li a:active {
+	color: var(--nav-fg-color);
+}
+
+nav ul li a:visited {
+	color: var(--nav-fg-color);
+}
+
+@media (width >= 50rem) {
+	:not([data-layout="wide"]) body {
+		margin: 0 auto;
+	}
+	
+	[data-layout="wide"] body {
+		margin: 0;
+	}
+}
+
+@media (width < 50rem) {
+	body {
+		margin: 0;
+	}
+	.img-text {
+		position: relative;
+		margin-bottom: 32px;
+	}
+	.layout-switch {
+		display: none;
+	}
+}
+
+@media print {
+	.light-dark-switch {
+		display: none;
+	}
+	.layout-switch {
+		display: none;
+	}
+	nav {
+		display: none;
+	}
+}
+
+.map {
+	display: block;
+	width: 90%;
+	margin: 0 auto;
+	margin-top: 4em;
+}
+
+.map-open {
+	display: block;
+	width: fit-content;
+	margin: 0 auto;
+}