commit 66df99954e9d2c343a26353c157222b6b37d24e3 Author: Michal Procházka Date: Tue Apr 8 12:06:32 2025 +0200 Initial commit diff --git a/.htaccess b/.htaccess new file mode 100644 index 0000000..7dd35ec --- /dev/null +++ b/.htaccess @@ -0,0 +1,15 @@ +RewriteEngine On +RewriteCond %{REQUEST_FILENAME} !-f +RewriteRule ^([^\.]+)$ $1.html [NC,L] + +AddDefaultCharset utf-8 +AddCharset utf-8 .html .css .js +DefaultLanguage cs-CZ + +ErrorDocument 404 /~michal.prochazka/sp/404.html + +Options +Includes + +AddType text/html .html +AddOutputFilter INCLUDES .html + diff --git a/404.html b/404.html new file mode 100644 index 0000000..b859994 --- /dev/null +++ b/404.html @@ -0,0 +1,18 @@ + + + + + Stránka nenalezena - Svobodný software Liberec + + + + +
+

Stránka nenalezena.

+

Pokusili jste se načíst stránku, která na tomto serveru neexistuje.

+

Klikněte prosím na jeden z odkazů uvedených výše.

+
+ + + + diff --git a/components/footer.html b/components/footer.html new file mode 100644 index 0000000..f4450f9 --- /dev/null +++ b/components/footer.html @@ -0,0 +1,5 @@ + + diff --git a/components/head.html b/components/head.html new file mode 100644 index 0000000..4d5b9ce --- /dev/null +++ b/components/head.html @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/components/header.html b/components/header.html new file mode 100644 index 0000000..34d201a --- /dev/null +++ b/components/header.html @@ -0,0 +1,7 @@ +
+
Svobodný software Liberec
+
Richard Stallman na Technické univerzitě v Liberci
+ Přepínač světlého a tmavého režimu + Přepínač širokého a úzkého rozvržení +
+ diff --git a/components/nav.html b/components/nav.html new file mode 100644 index 0000000..2031e81 --- /dev/null +++ b/components/nav.html @@ -0,0 +1,9 @@ + + diff --git a/favicon.png b/favicon.png new file mode 100644 index 0000000..b445347 Binary files /dev/null and b/favicon.png differ diff --git a/free.html b/free.html new file mode 100644 index 0000000..af9df83 --- /dev/null +++ b/free.html @@ -0,0 +1,132 @@ + + + + + Svobodný software - Svobodný software Liberec + + + + + +
+ +

Obsah

+ + + + +

Svobodný software

+ +

+ 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á. +

+ +

+ Většina informací na této stránce pochází webových stránek + operačního systému GNU. +

+ + +

Co je to?

+ +

+ 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. +

+ +

+ 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. +

+ + +

Jak vznikl?

+ +

+ 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. +

+ + +

Jak se liší od ostatních hnutí?

+ +

+ 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. +

+ + +

Freeware

+ +

+ 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. +

+ + +

Open Source

+ +

+ 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. +

+
+ + + + diff --git a/icons.css b/icons.css new file mode 100644 index 0000000..a671370 --- /dev/null +++ b/icons.css @@ -0,0 +1,13 @@ +:root { + --light-theme-switch-icon: url("data:image/svg+xml;utf8, "); + --dark-theme-switch-icon: url("data:image/svg+xml;utf8, "); + + --light-narrow-layout-switch-icon: url("data:image/svg+xml;utf8, "); + + --light-wide-layout-switch-icon: url("data:image/svg+xml;utf8, "); + + --dark-narrow-layout-switch-icon: url("data:image/svg+xml;utf8, "); + + --dark-wide-layout-switch-icon: url("data:image/svg+xml;utf8, "); +} + diff --git a/images/stallman.jpg b/images/stallman.jpg new file mode 100644 index 0000000..4a4336a Binary files /dev/null and b/images/stallman.jpg differ diff --git a/images/stallman_2024.jpg b/images/stallman_2024.jpg new file mode 100644 index 0000000..ff90767 Binary files /dev/null and b/images/stallman_2024.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..4d3c31b --- /dev/null +++ b/index.html @@ -0,0 +1,49 @@ + + + + + Svobodný software Liberec + + + + + +
+

Richard Stallman o svobodném softwaru

+ +
+
+
--:--:--:--
+
+ +
+ Pan Stallman v Itálii +
Snímek z přednášky pana Stallmana z roku 2024
+
+ +
+ +

+ Akce se bude konat 7. května od 16:30 do 19:30 v aule budovy G na Technické univerzitě v Liberci. +

+ +

+ Hlavní částí akce bude přednáška pana Richarda Stallmana týkající se svobodného softwaru – + 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. +

+ +

+ 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. +

+
+ + + + + diff --git a/javascript.html b/javascript.html new file mode 100644 index 0000000..7ca5c15 --- /dev/null +++ b/javascript.html @@ -0,0 +1,57 @@ + + + + + JavaScript - Svobodný software Liberec + + + + + +
+

Použitý JavaScript na tomto webu

+ +

+ Pro tvorbu tohoto webu jsme použili stopové množství JavaScriptu. +

+

+ Tato stránka Vám zajišťuje, že návštěva tohoto webu nenačítá žádný nesvobodný software + (tzn. tento web načtete i s rozšířením LibreJS). +

+

Zkontrolujte si prosím níže uvedené skripty a jejich licence.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Seznam klientských skriptů
SkriptPopis skriptu
FunkceLicence
countdown.jsOdpočet do začátku akce.GNU GPL v3
lang.jsPřepínání jazyka vybraných prvků stránky.GNU GPL v3
theme.jsPřepínání mezi světlým a tmavým režimem.GNU GPL v3
+
+ + + + diff --git a/js/countdown.js b/js/countdown.js new file mode 100644 index 0000000..a31bf4a --- /dev/null +++ b/js/countdown.js @@ -0,0 +1,33 @@ +// @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"); + +function update_time() { + let countdown = document.querySelector(".countdown"); + + const now = new Date(); + + if(now >= target) { + countdown.innerHTML = "Akce již proběhla.
Děkujeme všem za návštěvu."; + return; + } + + const dur = Math.floor((target - now) / 1000); + + const day = Math.floor(dur / 86400).toFixed(0).padStart(2, "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"); + + //const targetdate = `${target.getDate()}. ${target.getMonth()+1}. ${target.getFullYear()}` + //const targettime = `${target.getHours()}:${target.getMinutes()}` + + //countdown.innerHTML = `${targetdate} v ${targettime}

${day}:${hour}:${min}:${sec}`; + countdown.innerHTML = `${day}:${hour}:${min}:${sec}`; +} + +update_time(); +setInterval(update_time, 1000); + +// @license-end + diff --git a/js/lang.js b/js/lang.js new file mode 100644 index 0000000..9d616a2 --- /dev/null +++ b/js/lang.js @@ -0,0 +1,17 @@ +// @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 + diff --git a/js/theme.js b/js/theme.js new file mode 100644 index 0000000..3cbf87e --- /dev/null +++ b/js/theme.js @@ -0,0 +1,34 @@ +// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later + +function switch_theme() { + let el = document.documentElement; + if(el.getAttribute("data-color-scheme") === "invert") { + el.setAttribute("data-color-scheme", "normal"); + localStorage.setItem("color-scheme", "normal"); + } else { + el.setAttribute("data-color-scheme", "invert"); + localStorage.setItem("color-scheme", "invert"); + } +} + +function switch_layout() { + let el = document.documentElement; + if(el.getAttribute("data-layout") === "wide") { + el.setAttribute("data-layout", "normal"); + localStorage.setItem("layout", "normal"); + } else { + el.setAttribute("data-layout", "wide"); + localStorage.setItem("layout", "wide"); + } +} + +if(localStorage.getItem("color-scheme") === "invert") { + switch_theme(); +} + +if(localStorage.getItem("layout") === "wide") { + switch_layout(); +} + +// @license-end + diff --git a/stallman.html b/stallman.html new file mode 100644 index 0000000..0b43abf --- /dev/null +++ b/stallman.html @@ -0,0 +1,89 @@ + + + + + Richard Stallman - Svobodný software Liberec + + + + + + +
+

+ Tato stránka obsahuje překlad textu v angličtině, + který nám poskytl sám pan Stallman. +

+ +

+ Kliknutím zde + si zobrazíte původní znění textu (či znovu překlad po opakovaném kliknutí). +

+ +

Kdo je Richard Stallman?

+ + +
+ Richard Stallman +
Richard Stallman, 2024
+
+ + +
+

+ 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 www.gnu.org). + 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 Linux) + se dnes využívá na desítkách milionů osobních počítačů. +

+ +

+ Stallmanovi byla udělena Cena Grace Hopperové a Cena Softwarových Systémů + neziskovou organizací Association for Computing Machinery, + Cena za sociální/ekonomické zlepšení organizací Takeda Foundation a + Cena Electronic Frontier Foundation a mnoho čestných doktorátů. + Stallman je členem programu MacArthur Fellowship + a je členem Síně slávy Internetu. +

+ +

+ Dr. Richard Stallman
+ Zakladatel Free Software Foundation
+ Zakladatel a vedoucí vývoje operačního systému GNU +

+
+ + +
+ + + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..7bcfa14 --- /dev/null +++ b/styles.css @@ -0,0 +1,367 @@ +:root { + --light-fg-color: black; + --light-bg-color: white; + --light-outer-shadow-color: #BBBBBB; + --light-outer-bg-color: #E4E4E4; + --light-alt-bg-color: #FFFFD0; + --light-field-hover-bg-color: #F0F0F0; + --light-field-active-bg-color: #E0E0E0; + --light-link-idle-color: blue; + + --dark-fg-color: white; + --dark-bg-color: #202020; + --dark-outer-shadow-color: #000000; + --dark-outer-bg-color: black; + --dark-alt-bg-color: #101010; + --dark-field-hover-bg-color: #000000; + --dark-field-active-bg-color: #404040; + --dark-link-idle-color: lightblue; +} + +:root { + color-scheme: light dark; + + --nav-fg-color: white; + --nav-bg-color: darkred; + --nav-bg-color-selected: #C00000; + --sep-color: gray; +} + +/* Vím, že by se dalo použít light-dark(...). Ale to funguje jen v nejnovějších prohlížečích. */ +@media (prefers-color-scheme: light) { + :root { + --fg-color: var(--light-fg-color); + --bg-color: var(--light-bg-color); + --outer-shadow-color: var(--light-outer-shadow-color); + --outer-bg-color: var(--light-outer-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); + } + + [data-color-scheme="invert"] { + --fg-color: var(--dark-fg-color); + --bg-color: var(--dark-bg-color); + --outer-shadow-color: var(--dark-outer-shadow-color); + --outer-bg-color: var(--dark-outer-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); + } +} + +@media (prefers-color-scheme: dark) { + :root { + --fg-color: var(--dark-fg-color); + --bg-color: var(--dark-bg-color); + --outer-shadow-color: var(--dark-outer-shadow-color); + --outer-bg-color: var(--dark-outer-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); + } + + [data-color-scheme="invert"] { + --fg-color: var(--light-fg-color); + --bg-color: var(--light-bg-color); + --outer-shadow-color: var(--light-outer-shadow-color); + --outer-bg-color: var(--light-outer-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); + } +} + +:root { + --layout-switch-icon: var(--narrow-layout-switch-icon); +} + +[data-layout="wide"] { + --layout-switch-icon: var(--wide-layout-switch-icon) +} + +html { + margin: 0; + background-color: var(--outer-bg-color); + min-height: calc(100% - 32px); +} + +body { + font-family: "Noto Sans", sans-serif; /* Svobodný font. */ + font-size: 16px; + display: flex; + flex-direction: column; + color: var(--fg-color); + background-color: var(--bg-color); +} + +header { + padding: calc(16px - 8px) 16px; + position: relative; + background-color: var(--bg-color); +} + +.light-dark-switch { + position: absolute; + top: 16px; + right: 16px; + cursor: pointer; + content: var(--theme-switch-icon); + width: 20px; +} + +.layout-switch { + position: absolute; + top: 48px; + right: 16px; + cursor: pointer; + content: var(--layout-switch-icon); + width: 20px; +} + +a { + color: var(--link-idle-color); +} + +header * { + margin: 8px 0; +} + +.header-title { + font-size: 32px; +} + +.header-subtitle { + font-size: 24px; +} + +.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; +} + +main { + flex-grow: 1; + padding: 16px; +} + +.gnu-head { + content: var(--fg-gnu-head); +} + +footer { + border-top: 2px solid var(--sep-color); + padding: calc(16px - 8px) 16px; + text-align: center; +} + +footer>* { + margin: 8px 0; +} + +h1 { + font-size: 32px; +} + +h2 { + font-size: 26px; +} + +h3 { + font-size: 20px; +} + +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; + } + + /* Jinak to neudělá nic. */ +} + +figure img,svg,inserted-svg { + width: 100%; + height: auto; +} + +figcaption { + font-style: italic; +} + +nav ul { + width: 100%; + height: 100%; + display: flex; + flex-direction: row; + margin: 0; + padding: 0; + list-style-type: none; +} + +@media (width < 750px) { + nav ul { + flex-direction: column; + } +} + +nav ul li { + flex-grow: 1; + flex-basis: 0; + display: flex; + margin: 0; +} + +nav ul li a { + display: flex; + flex-direction: column; + justify-content: center; + + flex-grow: 1; + padding: 8px 16px; + + text-align: center; + text-decoration: none; + color: var(--nav-fg-color); + + 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 >= 900px) { + html:not([data-layout="wide"]) { + padding: 16px 0; + } + + :not([data-layout="wide"]) body { + margin: 0 auto; + max-width: 800px; + box-shadow: 0 0 5px 5px var(--outer-shadow-color); + } + + [data-layout="wide"] body { + margin: 0; + } +} + +@media (width < 900px) { + 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; + } +} +