Merge pull request 'css' (#5 ) from hugo/decentrala-website-static-new:css into master

Reviewed-on: #5
Removed boilerplate blogs
2023-08-04 14:19:43 +00:00 · 2023-08-04 16:18:11 +02:00 · 2023-08-04 02:17:14 +02:00 · 2023-08-03 20:38:04 +02:00 · 2023-08-03 19:39:10 +02:00 · 2023-08-03 19:34:30 +02:00
60 changed files with 1134 additions and 547 deletions
--- a/README.md
+++ b/README.md
@@ -6,11 +6,22 @@ Redisign of dmz.rs .

 ### TODO:

- create themes switcher
+- [x] create themes switcher
+  - [x] "demo"
+  - [x] propagate to all pages
+  - [x] store theme to localStorage
+  - [x] read "user agent" for default theme
+  - [x] invert images and icons
 - update projects section
 - create blogging system
 - create xmpp bot that connects to events section.
- make responsive
+- [ ] make responsive
+  - create menus for smaller screens
+    - [x] created one menu
+      - this might be enough
+  - [x] adjust the mesh depending on the screen size
+    - no mesh on small screens
+  - tweak other random issues with layout
 - make webring system
 - make english version (localisation)

--- a/atom_gen.py
+++ b/atom_gen.py
@@ -0,0 +1,45 @@
+#! /usr/bin/python3
+
+# needs lowdown and feegden installed
+# feedgen can be installed with pip
+# also expects that *.md files are in blog/ directory
+
+from feedgen.feed import FeedGenerator
+import subprocess
+import os
+
+blogs_dir = os.fsencode("blog")
+
+def blogposts_list_gen():
+    output_list = []
+    for file in os.listdir(blogs_dir):
+        filename = os.fsdecode(file)
+        if filename.endswith(".md"):
+            full_path = "blog/" + filename
+
+            author = subprocess.run("lowdown -X author " + full_path, capture_output=True, shell=True, text=True).stdout.strip()
+            title = subprocess.run("lowdown -X title " + full_path, capture_output=True, shell=True, text=True).stdout.strip()
+            time = subprocess.run("lowdown -X time " + full_path, capture_output=True, shell=True, text=True).stdout.strip()
+            content_html = subprocess.run("lowdown " + full_path, capture_output=True, shell=True, text=True).stdout.strip()
+
+            output_list.append([author, title, time, content_html, full_path])
+    return output_list
+
+def feedgen(blogs):
+    fg = FeedGenerator()
+    fg.id('http://dmz.rs/')
+    fg.title('Decentrala Blog')
+    fg.author( {'name':'Decentrala','email':'dmz@dmz.rs'} )
+    fg.link( href='https://dmz.rs/atom.xml', rel='self' )
+
+    for post in blogs:
+        fe = fg.add_entry()
+        fe.id("https://dmz.rs/" + post[4][:-3] + ".html")
+        fe.author({'name': post[0]})
+        fe.title(post[1])
+        fe.updated(post[2])
+        fe.content(content=post[3], type='html')
+
+    fg.atom_file('atom.xml')
+
+feedgen(blogposts_list_gen())
--- a/blogs/Lorem
+++ b/blogs/Lorem
@@ -1,43 +0,0 @@
-<h1>Nulla possent lacrimas huius</h1>
-<h2>Fratres quoque</h2>
-<p>Lorem markdownum pariter: lata per tuae quo salus rorant septemfluus mecum
-  summisque feres potes Ulixes. Aeacus Tritonida reicere non convocat pariter
-  neque arma refovet quoque stabunt in. Velamina inrita, silvestribus, ut sarcina
-  memori, bellaque dummodo.</p>
-<p>Factis dixit macies coissent! Nactasque molliter quam in memorant velamine;
-  praemia mundi <em>illo</em> Achille <strong>de</strong>.</p>
-<h2>Velut Procrin</h2>
-<p>Vobis <a href="http://www.palmae.net/aquis-inmota.html">grave</a> fessos ita Belides; poena
-  hora oculis celebrandaque audita guttur ad custodia exprobravit. Pacis monuere
-  et crimen loquor <em>contigit quae</em>! Nondum iudex, auro moratur rogaberis manet.
-  Faciem in dolor adusque, sum soror pectoris in reppulit superest caesis, Hebrum
-  e natura sonabunt. Incensaque An monitae, in animoque vulnerat terra cavo
-  torquet qui humili perque, cristis alii fruitur adacto.</p>
-<ul>
-  <li>Est velavit idem</li>
-  <li>Naupliades tenebant instanti ense iactura ut nutantem</li>
-  <li>Miserarum corpore habet</li>
-</ul>
-<h2>Ad utque sic Charybdis iamque sequenti genitore</h2>
-<p>Hesperien arida. Tibi caelo clavigeram saxoque capillos doleamne faveas testes
-  senex <strong>rudente lacrimis</strong> insula Cnosiacaeque? Dant ablato adulterium gemino,
-  pluvialibus una, dependent iactura illum redit atque dixi pondera. Eumque
-  sanguis errare, formasque parabat volubilibus satis creaverat dextera Iuppiter
-  te sero, est. Opem duceret quam tum pollentibus ramumque tauri; at Saturnia
-  erigitur imitamine ferens adunca delapsaque viminis, terras.</p>
-<h2>Denique ostendit femina tamen</h2>
-<p>Telum in ab utque ut et mihi <strong>auras Midan</strong> meo genus membra comites ne. Orbis
-  via necis. Romana deus, sub frangunt furor crepuscula equorum Teleboasque templa
-  virgineumque belua obsita est. Fragorem Somnus; ducebas placido oscula.</p>
-<blockquote>
-  <p>Inmota manifesta producit, inquit verbisque fluctus iamque, quo fuerat ipse
-    nostra, iussit <strong>nec tenebat</strong>. Pars procul, pietate crinales meus <em>totiens</em>
-    haustus frondes, per sedebat. Domum vincite.</p>
-</blockquote>
-<h2>De curaque quoque reddat numina quae veniam</h2>
-<p>Fessus iacit tantum elimat a medios vinoque finita adspergine liquerat munere
-  vultibus Atridae pecus positoque reluxit. Veniebat videtur laesae quod vacca,
-  lolium neu Perseus fraude nominibus contraria.</p>
-<p>Parat <strong>ferus</strong> in actis terebrata animaeque <strong>quoque</strong>, deos et morte agitantem
-  ore. Proelia casus Gryneus. Quis mihi <em>ille cur</em> Assyrius per siquis, ille
-  Hecabe Arethusa, erigite perfectis.</p>
--- a/blogs/Lorem
+++ b/blogs/Lorem
@@ -1,53 +0,0 @@
-# Nulla possent lacrimas huius
-
-## Fratres quoque
-
-Lorem markdownum pariter: lata per tuae quo salus rorant septemfluus mecum
-summisque feres potes Ulixes. Aeacus Tritonida reicere non convocat pariter
-neque arma refovet quoque stabunt in. Velamina inrita, silvestribus, ut sarcina
-memori, bellaque dummodo.
-
-Factis dixit macies coissent! Nactasque molliter quam in memorant velamine;
-praemia mundi *illo* Achille **de**.
-
-## Velut Procrin
-
-Vobis [grave](http://www.palmae.net/aquis-inmota.html) fessos ita Belides; poena
-hora oculis celebrandaque audita guttur ad custodia exprobravit. Pacis monuere
-et crimen loquor *contigit quae*! Nondum iudex, auro moratur rogaberis manet.
-Faciem in dolor adusque, sum soror pectoris in reppulit superest caesis, Hebrum
-e natura sonabunt. Incensaque An monitae, in animoque vulnerat terra cavo
-torquet qui humili perque, cristis alii fruitur adacto.
-
- Est velavit idem
- Naupliades tenebant instanti ense iactura ut nutantem
- Miserarum corpore habet
-
-## Ad utque sic Charybdis iamque sequenti genitore
-
-Hesperien arida. Tibi caelo clavigeram saxoque capillos doleamne faveas testes
-senex **rudente lacrimis** insula Cnosiacaeque? Dant ablato adulterium gemino,
-pluvialibus una, dependent iactura illum redit atque dixi pondera. Eumque
-sanguis errare, formasque parabat volubilibus satis creaverat dextera Iuppiter
-te sero, est. Opem duceret quam tum pollentibus ramumque tauri; at Saturnia
-erigitur imitamine ferens adunca delapsaque viminis, terras.
-
-## Denique ostendit femina tamen
-
-Telum in ab utque ut et mihi **auras Midan** meo genus membra comites ne. Orbis
-via necis. Romana deus, sub frangunt furor crepuscula equorum Teleboasque templa
-virgineumque belua obsita est. Fragorem Somnus; ducebas placido oscula.
-
-> Inmota manifesta producit, inquit verbisque fluctus iamque, quo fuerat ipse
-> nostra, iussit **nec tenebat**. Pars procul, pietate crinales meus *totiens*
-> haustus frondes, per sedebat. Domum vincite.
-
-## De curaque quoque reddat numina quae veniam
-
-Fessus iacit tantum elimat a medios vinoque finita adspergine liquerat munere
-vultibus Atridae pecus positoque reluxit. Veniebat videtur laesae quod vacca,
-lolium neu Perseus fraude nominibus contraria.
-
-Parat **ferus** in actis terebrata animaeque **quoque**, deos et morte agitantem
-ore. Proelia casus Gryneus. Quis mihi *ille cur* Assyrius per siquis, ille
-Hecabe Arethusa, erigite perfectis.
--- a/dogadjaji.csv
+++ b/dogadjaji.csv
@@ -10,3 +10,11 @@ datum, vreme, lokacija, tema
 08-05-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Linux install day
 09-05-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Cryptoparty - Uvod u privatnost
 11-05-2023, 18:00, Polyhedra https://www.openstreetmap.org/node/4856556781, Uvod u racunarske mreze
+01-08-2023, 19:00, DC Krov, Tehno veče
+07-08-2023, 19:00, DC Krov, Linux ricing
+08-08-2023, 19:00, DC Krov, Lambda račun
+14-08-2023, 19:00, DC Krov, Linux distro diskusija
+15-08-2023, 19:00, DC Krov, Pirati 777 mora
+21-08-2023, 19:00, DC Krov, Python vežbe
+22-08-2023, 19:00, DC Krov, Autentifikacija na internetu
+28-08-2023, 19:00, DC Krov, Kviz
--- a/font/Facade-Sud.woff
+++ b/font/Facade-Sud.woff
--- a/font/JetBrainsMono-Regular.ttf
+++ b/font/JetBrainsMono-Regular.ttf
--- a/img/cc-dark.svg
+++ b/img/cc-dark.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg5" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xmlns="http://www.w3.org/2000/svg">
+ <g id="layer1" fill="#fff">
+  <path id="path140" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".3554"/>
+  <g id="text2158" stroke-width=".35534" aria-label="cc">
+   <path id="path290" d="m3.175 7.3025q-0.35983 0-0.64911-0.10583-0.28222-0.10583-0.48683-0.30339-0.19756-0.19756-0.31044-0.47978-0.10583-0.28222-0.10583-0.62794v-0.98778q0-0.34572 0.10583-0.62794 0.11289-0.28222 0.31044-0.47978 0.20461-0.19756 0.48683-0.30339 0.28928-0.10583 0.64911-0.10583 0.64206 0 1.0513 0.35278 0.41628 0.34572 0.50094 0.9525h-0.635q-0.049389-0.33867-0.30339-0.53622-0.24694-0.20461-0.61383-0.20461-0.42333 0-0.67028 0.254-0.24694 0.254-0.24694 0.6985v0.98778q0 0.4445 0.23989 0.6985 0.24694 0.254 0.67733 0.254 0.36689 0 0.61383-0.19756 0.254-0.20461 0.30339-0.54328h0.635q-0.091722 0.61383-0.508 0.95956-0.40922 0.34572-1.0442 0.34572z"/>
+   <path id="path292" d="m7.4083 7.3025q-0.35983 0-0.64911-0.10583-0.28222-0.10583-0.48683-0.30339-0.19756-0.19756-0.31044-0.47978-0.10583-0.28222-0.10583-0.62794v-0.98778q0-0.34572 0.10583-0.62794 0.11289-0.28222 0.31044-0.47978 0.20461-0.19756 0.48683-0.30339 0.28928-0.10583 0.64911-0.10583 0.64206 0 1.0513 0.35278 0.41628 0.34572 0.50094 0.9525h-0.635q-0.049389-0.33867-0.30339-0.53622-0.24694-0.20461-0.61383-0.20461-0.42333 0-0.67028 0.254-0.24694 0.254-0.24694 0.6985v0.98778q0 0.4445 0.23989 0.6985 0.24694 0.254 0.67733 0.254 0.36689 0 0.61383-0.19756 0.254-0.20461 0.30339-0.54328h0.635q-0.091722 0.61383-0.508 0.95956-0.40922 0.34572-1.0442 0.34572z"/>
+  </g>
+ </g>
+</svg>
--- a/img/cc-light.svg
+++ b/img/cc-light.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg5" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xmlns="http://www.w3.org/2000/svg">
+ <g id="layer1" fill="#181715">
+  <path id="path140" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".3554"/>
+  <g id="text2158" stroke-width=".35534" aria-label="cc">
+   <path id="path290" d="m3.175 7.3025q-0.35983 0-0.64911-0.10583-0.28222-0.10583-0.48683-0.30339-0.19756-0.19756-0.31044-0.47978-0.10583-0.28222-0.10583-0.62794v-0.98778q0-0.34572 0.10583-0.62794 0.11289-0.28222 0.31044-0.47978 0.20461-0.19756 0.48683-0.30339 0.28928-0.10583 0.64911-0.10583 0.64206 0 1.0513 0.35278 0.41628 0.34572 0.50094 0.9525h-0.635q-0.049389-0.33867-0.30339-0.53622-0.24694-0.20461-0.61383-0.20461-0.42333 0-0.67028 0.254-0.24694 0.254-0.24694 0.6985v0.98778q0 0.4445 0.23989 0.6985 0.24694 0.254 0.67733 0.254 0.36689 0 0.61383-0.19756 0.254-0.20461 0.30339-0.54328h0.635q-0.091722 0.61383-0.508 0.95956-0.40922 0.34572-1.0442 0.34572z"/>
+   <path id="path292" d="m7.4083 7.3025q-0.35983 0-0.64911-0.10583-0.28222-0.10583-0.48683-0.30339-0.19756-0.19756-0.31044-0.47978-0.10583-0.28222-0.10583-0.62794v-0.98778q0-0.34572 0.10583-0.62794 0.11289-0.28222 0.31044-0.47978 0.20461-0.19756 0.48683-0.30339 0.28928-0.10583 0.64911-0.10583 0.64206 0 1.0513 0.35278 0.41628 0.34572 0.50094 0.9525h-0.635q-0.049389-0.33867-0.30339-0.53622-0.24694-0.20461-0.61383-0.20461-0.42333 0-0.67028 0.254-0.24694 0.254-0.24694 0.6985v0.98778q0 0.4445 0.23989 0.6985 0.24694 0.254 0.67733 0.254 0.36689 0 0.61383-0.19756 0.254-0.20461 0.30339-0.54328h0.635q-0.091722 0.61383-0.508 0.95956-0.40922 0.34572-1.0442 0.34572z"/>
+  </g>
+ </g>
+</svg>
--- a/img/cc.svg
+++ b/img/cc.svg
@@ -1,61 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg5"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   sodipodi:docname="cc.svg"
-   inkscape:export-filename="cc.png"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview7"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="0"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="px"
-     showgrid="false"
-     inkscape:zoom="10.628544"
-     inkscape:cx="12.325301"
-     inkscape:cy="22.627747"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" />
-  <defs
-     id="defs2" />
-  <g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1">
-    <path
-       id="path140"
-       style="fill:#181715;stroke-width:0.355403;fill-opacity:1"
-       d="M 5.2916665 0 A 5.2916665 5.2916665 0 0 0 0 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 0 z M 5.2916665 0.66145831 A 4.630208 4.630208 0 0 1 9.9218747 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 9.9218747 A 4.630208 4.630208 0 0 1 0.66145831 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 0.66145831 z " />
-    <g
-       aria-label="cc"
-       id="text2158"
-       style="font-size:7.05556px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#181715;stroke-width:0.355335">
-      <path
-         d="m 3.1749971,7.3025011 q -0.3598336,0 -0.6491115,-0.1058334 Q 2.2436632,7.0908343 2.0390519,6.8932786 1.8414962,6.6957229 1.7286073,6.4135005 1.6227739,6.1312781 1.6227739,5.7855557 V 4.7977773 q 0,-0.3457225 0.1058334,-0.6279449 Q 1.8414962,3.88761 2.0390519,3.6900543 2.2436632,3.4924987 2.5258856,3.3866653 2.8151635,3.2808319 3.1749971,3.2808319 q 0.642056,0 1.0512785,0.352778 0.416278,0.3457224 0.5009447,0.9525006 H 4.0922199 Q 4.042831,4.2474436 3.7888308,4.0498879 3.5418862,3.8452767 3.1749971,3.8452767 q -0.4233336,0 -0.6702782,0.2540001 Q 2.2577743,4.353277 2.2577743,4.7977773 v 0.9877784 q 0,0.4445003 0.239889,0.6985004 0.2469446,0.2540002 0.6773338,0.2540002 0.3668891,0 0.6138337,-0.1975557 Q 4.042831,6.3358894 4.0922199,5.9972225 H 4.7272203 Q 4.635498,6.6110562 4.21922,6.9567787 3.8099975,7.3025011 3.1749971,7.3025011 Z"
-         id="path290" />
-      <path
-         d="m 7.4083359,7.3025011 q -0.3598335,0 -0.6491115,-0.1058334 Q 6.477002,7.0908343 6.2723907,6.8932786 6.0748351,6.6957229 5.9619461,6.4135005 5.8561127,6.1312781 5.8561127,5.7855557 V 4.7977773 q 0,-0.3457225 0.1058334,-0.6279449 Q 6.0748351,3.88761 6.2723907,3.6900543 6.477002,3.4924987 6.7592244,3.3866653 7.0485024,3.2808319 7.4083359,3.2808319 q 0.642056,0 1.0512785,0.352778 0.416278,0.3457224 0.5009448,0.9525006 H 8.3255587 Q 8.2761698,4.2474436 8.0221697,4.0498879 7.7752251,3.8452767 7.4083359,3.8452767 q -0.4233336,0 -0.6702782,0.2540001 Q 6.4911131,4.353277 6.4911131,4.7977773 v 0.9877784 q 0,0.4445003 0.2398891,0.6985004 0.2469446,0.2540002 0.6773337,0.2540002 0.3668892,0 0.6138338,-0.1975557 0.2540001,-0.2046112 0.303389,-0.5432781 H 8.9605592 Q 8.8688369,6.6110562 8.4525588,6.9567787 8.0433363,7.3025011 7.4083359,7.3025011 Z"
-         id="path292" />
-    </g>
-  </g>
-</svg>
--- a/img/favicon_bg.svg
+++ b/img/favicon_bg.svg
@@ -1,69 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg5"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   sodipodi:docname="favicon_bg.svg"
-   inkscape:export-filename="favicon_transparent_64.png"
-   inkscape:export-xdpi="153.60001"
-   inkscape:export-ydpi="153.60001"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview7"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="0"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="px"
-     showgrid="false"
-     inkscape:zoom="10.628544"
-     inkscape:cx="10.631748"
-     inkscape:cy="18.393865"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer2" />
-  <defs
-     id="defs2" />
-  <g
-     inkscape:groupmode="layer"
-     id="layer2"
-     inkscape:label="Layer 2">
-    <circle
-       style="fill:#ffffff;stroke-width:0.505137"
-       id="path613"
-       cx="5.2916665"
-       cy="5.2916665"
-       r="5.2916665" />
-  </g>
-  <g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1">
-    <path
-       id="path140"
-       style="fill:#181715;stroke-width:0.355403;fill-opacity:1"
-       d="M 5.2916665 0 A 5.2916665 5.2916665 0 0 0 0 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 0 z M 5.2916665 0.66145831 A 4.630208 4.630208 0 0 1 9.9218747 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 9.9218747 A 4.630208 4.630208 0 0 1 0.66145831 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 0.66145831 z " />
-    <g
-       aria-label="D"
-       id="text441"
-       style="font-weight:500;font-size:7.05556px;font-family:'Iosevka Aile';-inkscape-font-specification:'Iosevka Aile, Medium';fill:#181715;stroke-width:0.355335">
-      <path
-         d="M 3.7464988,7.8845849 V 2.6987482 h 1.4322787 q 0.2187224,0 0.4303892,0.035278 0.2187223,0.035278 0.416278,0.1340557 0.1975557,0.091722 0.3598336,0.2469446 0.1622779,0.1481667 0.2610557,0.3457224 0.1058334,0.1905001 0.1481668,0.4092225 0.042333,0.2116668 0.042333,0.4303892 v 1.9826124 q 0,0.2187223 -0.042333,0.4374447 Q 6.7521674,6.9320843 6.646334,7.12964 6.5475562,7.3201401 6.3852783,7.4753624 6.2230004,7.6235292 6.0254447,7.722307 5.827889,7.8140293 5.6091667,7.8493071 5.3974999,7.8845849 5.1787775,7.8845849 Z m 1.4322787,-0.592667 q 0.1340557,0 0.2610557,-0.021167 0.1340557,-0.028222 0.2540002,-0.084667 0.1199445,-0.0635 0.2116668,-0.1622779 0.091722,-0.098778 0.1481668,-0.2187224 0.0635,-0.1199445 0.084667,-0.2540002 0.021167,-0.1340556 0.021167,-0.2681112 V 4.3003604 q 0,-0.1340557 -0.021167,-0.2681113 Q 6.117167,3.8981934 6.053667,3.7782489 5.9972225,3.6583044 5.9055002,3.5595266 5.8137779,3.4607487 5.6938334,3.4043042 5.5738889,3.3408042 5.4398332,3.3196375 5.3128332,3.2914153 5.1787775,3.2914153 H 4.4238326 v 4.0005026 z"
-         id="path535" />
-    </g>
-  </g>
-</svg>
--- a/img/favicon_bg_16.png
+++ b/img/favicon_bg_16.png
--- a/img/favicon_bg_32.png
+++ b/img/favicon_bg_32.png
--- a/img/favicon_bg_48.png
+++ b/img/favicon_bg_48.png
--- a/img/favicon_bg_64.png
+++ b/img/favicon_bg_64.png
--- a/img/favicon_transparent.svg
+++ b/img/favicon_transparent.svg
@@ -1,58 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg5"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   sodipodi:docname="favicon_transparent.svg"
-   inkscape:export-filename="cc.png"
-   inkscape:export-xdpi="96"
-   inkscape:export-ydpi="96"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview7"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="0"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="px"
-     showgrid="false"
-     inkscape:zoom="10.628544"
-     inkscape:cx="12.419387"
-     inkscape:cy="18.393865"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" />
-  <defs
-     id="defs2" />
-  <g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1">
-    <path
-       id="path140"
-       style="fill:#181715;stroke-width:0.355403;fill-opacity:1"
-       d="M 5.2916665 0 A 5.2916665 5.2916665 0 0 0 0 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 0 z M 5.2916665 0.66145831 A 4.630208 4.630208 0 0 1 9.9218747 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 9.9218747 A 4.630208 4.630208 0 0 1 0.66145831 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 0.66145831 z " />
-    <g
-       aria-label="D"
-       id="text441"
-       style="font-weight:500;font-size:7.05556px;font-family:'Iosevka Aile';-inkscape-font-specification:'Iosevka Aile, Medium';fill:#181715;stroke-width:0.355335">
-      <path
-         d="M 3.7464988,7.8845849 V 2.6987482 h 1.4322787 q 0.2187224,0 0.4303892,0.035278 0.2187223,0.035278 0.416278,0.1340557 0.1975557,0.091722 0.3598336,0.2469446 0.1622779,0.1481667 0.2610557,0.3457224 0.1058334,0.1905001 0.1481668,0.4092225 0.042333,0.2116668 0.042333,0.4303892 v 1.9826124 q 0,0.2187223 -0.042333,0.4374447 Q 6.7521674,6.9320843 6.646334,7.12964 6.5475562,7.3201401 6.3852783,7.4753624 6.2230004,7.6235292 6.0254447,7.722307 5.827889,7.8140293 5.6091667,7.8493071 5.3974999,7.8845849 5.1787775,7.8845849 Z m 1.4322787,-0.592667 q 0.1340557,0 0.2610557,-0.021167 0.1340557,-0.028222 0.2540002,-0.084667 0.1199445,-0.0635 0.2116668,-0.1622779 0.091722,-0.098778 0.1481668,-0.2187224 0.0635,-0.1199445 0.084667,-0.2540002 0.021167,-0.1340556 0.021167,-0.2681112 V 4.3003604 q 0,-0.1340557 -0.021167,-0.2681113 Q 6.117167,3.8981934 6.053667,3.7782489 5.9972225,3.6583044 5.9055002,3.5595266 5.8137779,3.4607487 5.6938334,3.4043042 5.5738889,3.3408042 5.4398332,3.3196375 5.3128332,3.2914153 5.1787775,3.2914153 H 4.4238326 v 4.0005026 z"
-         id="path535" />
-    </g>
-  </g>
-</svg>
--- a/img/favicon_transparent_16.png
+++ b/img/favicon_transparent_16.png
--- a/img/favicon_transparent_32.png
+++ b/img/favicon_transparent_32.png
--- a/img/favicon_transparent_48.png
+++ b/img/favicon_transparent_48.png
--- a/img/favicon_transparent_64.png
+++ b/img/favicon_transparent_64.png
--- a/img/git-dark.svg
+++ b/img/git-dark.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg5" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><g id="layer1" fill="#fff"><path id="path234" d="m5.2917 0c-2.9225 0-5.2917 2.3692-5.2917 5.2917s2.3692 5.2917 5.2917 5.2917 5.2917-2.3692 5.2917-5.2917-2.3692-5.2917-5.2917-5.2917zm0 0.66146c2.5572 1e-7 4.6302 2.073 4.6302 4.6302 1e-7 2.5572-2.073 4.6302-4.6302 4.6302-2.5572 1e-7 -4.6302-2.073-4.6302-4.6302-3e-8 -0.62533 0.12396-1.2217 0.34865-1.7659 0.69415-1.6812 2.3497-2.8643 4.2816-2.8643z" stroke-width=".43932"/><path id="rect1196" d="m5.2725 1.2965c-0.19651 0.0047-0.39147 0.082448-0.54208 0.23306l-0.58704 0.58756 0.012403 0.012919 0.13642 0.13591 0.8139 0.81442a0.62532 0.62532 0 0 1 0.20412-0.03514 0.62532 0.62532 0 0 1 0.62528 0.62528 0.62532 0.62532 0 0 1-0.03514 0.20412l0.88315 0.88315a0.62532 0.62532 0 0 1 0.21084-0.037207 0.62532 0.62532 0 0 1 0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528-0.62528 0.62532 0.62532 0 0 1 0.024288-0.17002l-0.82631-0.82631v2.1063a0.62532 0.62532 0 0 1 0.36845 0.56999 0.62532 0.62532 0 0 1-0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528-0.62528 0.62532 0.62532 0 0 1 0.36845-0.56947v-2.2164a0.62532 0.62532 0 0 1-0.36845-0.56947 0.62532 0.62532 0 0 1 0.025838-0.17725l-0.95911-0.95911 0.001033-5.168e-4 -0.013435-0.013436-2.2097 2.2102c-0.31094 0.31094-0.31094 0.81147 0 1.1224l3.2008 3.2008c0.31094 0.31094 0.81147 0.31094 1.1224 0l3.2008-3.2008c0.31094-0.31094 0.31094-0.81147 0-1.1224l-3.2008-3.2008c-0.15547-0.15547-0.35831-0.23306-0.56121-0.23306-0.00634 0-0.012782-1.515e-4 -0.019121 0z" stroke-width=".37293"/></g></svg>
--- a/img/git-light.svg
+++ b/img/git-light.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg5" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><g id="layer1" fill="#181715"><path id="path234" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".43932"/><path id="rect1196" d="m5.2725 1.2965c-0.19651 0.0047-0.39147 0.082448-0.54208 0.23306l-0.58704 0.58756 0.012403 0.012919 0.13642 0.13591 0.8139 0.81442a0.62532 0.62532 0 0 1 0.20412-0.03514 0.62532 0.62532 0 0 1 0.62528 0.62528 0.62532 0.62532 0 0 1-0.03514 0.20412l0.88315 0.88315a0.62532 0.62532 0 0 1 0.21084-0.037207 0.62532 0.62532 0 0 1 0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528-0.62528 0.62532 0.62532 0 0 1 0.024288-0.17002l-0.82631-0.82631v2.1063a0.62532 0.62532 0 0 1 0.36845 0.56999 0.62532 0.62532 0 0 1-0.62528 0.62528 0.62532 0.62532 0 0 1-0.62528-0.62528 0.62532 0.62532 0 0 1 0.36845-0.56947v-2.2164a0.62532 0.62532 0 0 1-0.36845-0.56947 0.62532 0.62532 0 0 1 0.025838-0.17725l-0.95911-0.95911 0.001033-5.168e-4 -0.013435-0.013436-2.2097 2.2102c-0.31094 0.31094-0.31094 0.81147 0 1.1224l3.2008 3.2008c0.31094 0.31094 0.81147 0.31094 1.1224 0l3.2008-3.2008c0.31094-0.31094 0.31094-0.81147 0-1.1224l-3.2008-3.2008c-0.15547-0.15547-0.35831-0.23306-0.56121-0.23306-0.00634 0-0.012782-1.515e-4 -0.019121 0z" stroke-width=".37293"/></g></svg>
--- a/img/git.svg
+++ b/img/git.svg
@@ -1,45 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg5"
-   xml:space="preserve"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   sodipodi:docname="git_ikonica.svg"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
-     id="namedview7"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="false"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="true"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="px"
-     showgrid="false"
-     inkscape:zoom="5.6568543"
-     inkscape:cx="1.7677669"
-     inkscape:cy="25.013902"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" /><defs
-     id="defs2" /><g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1"><path
-       id="path234"
-       style="fill:#181715;stroke-width:0.439323"
-       d="M 5.2916665 0 A 5.2916665 5.2916665 0 0 0 0 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 0 z M 5.2916665 0.66145831 A 4.630208 4.630208 0 0 1 9.9218747 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 9.9218747 A 4.630208 4.630208 0 0 1 0.66145831 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 0.66145831 z " /><path
-       id="rect1196"
-       style="fill:#181715;fill-opacity:1;stroke-width:0.372926"
-       d="m 5.272546,1.2965229 c -0.196509,0.0047 -0.391473,0.082448 -0.542085,0.2330608 l -0.587045,0.587561 0.012403,0.012919 0.136425,0.135909 0.813904,0.8144205 a 0.62532276,0.62532276 0 0 1 0.204122,-0.03514 0.62532276,0.62532276 0 0 1 0.625285,0.6252848 0.62532276,0.62532276 0 0 1 -0.03514,0.2041219 l 0.88315,0.8831502 A 0.62532276,0.62532276 0 0 1 6.994405,4.7206032 0.62532276,0.62532276 0 0 1 7.61969,5.3458881 0.62532276,0.62532276 0 0 1 6.994405,5.9711729 0.62532276,0.62532276 0 0 1 6.36912,5.3458881 0.62532276,0.62532276 0 0 1 6.393408,5.1758726 L 5.567102,4.3495665 V 6.4558978 A 0.62532276,0.62532276 0 0 1 5.935555,7.0258888 0.62532276,0.62532276 0 0 1 5.31027,7.6511736 0.62532276,0.62532276 0 0 1 4.684985,7.0258888 0.62532276,0.62532276 0 0 1 5.053438,6.4564146 V 4.2400124 A 0.62532276,0.62532276 0 0 1 4.684985,3.6705382 0.62532276,0.62532276 0 0 1 4.710823,3.493288 L 3.751709,2.5341735 3.752742,2.5336567 3.739307,2.5202208 1.529622,4.7304218 c -0.31094,0.3109407 -0.31094,0.8114714 0,1.122412 L 4.730461,9.053672 c 0.31094,0.3109406 0.811471,0.3109406 1.122412,0 L 9.053711,5.8528338 c 0.31094,-0.3109406 0.31094,-0.8114713 0,-1.122412 L 5.852873,1.5295837 C 5.697402,1.374113 5.494564,1.2965222 5.291667,1.2965229 c -0.00634,0 -0.012782,-1.515e-4 -0.019121,0 z" /></g></svg>
--- a/img/mastodon-dark.svg
+++ b/img/mastodon-dark.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg1332" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><g id="layer1" fill="#fff"><path id="rect1756" d="m4.3183 1.9766c-1.1726 0-2.1167 0.82603-2.1167 1.8521v1.4382c0 0.13426 0.015785 0.26518 0.046509 0.39119-0.036015 0.37794 0.017995 0.87014 0.23719 1.5084 0.78289 2.2797 4.0194 1.1705 4.0194 1.1705s-0.021792-0.0096-0.045475-0.55449c-2.1752 0.49248-2.4572-0.32707-2.481-0.68678 0.11059 0.01549 0.2243 0.02326 0.34003 0.02326h1.9467c1.1726 0 2.1167-0.82603 2.1167-1.8521v-1.4382c0-1.0261-0.94404-1.8521-2.1167-1.8521zm0.03359 1.0878a1.0208 1.0208 0 0 1 0.96118 0.67644 1.0208 1.0208 0 0 1 0.96015-0.67644 1.0208 1.0208 0 0 1 1.0211 1.0206 1.0208 1.0208 0 0 1-5.168e-4 0.00672h5.168e-4v1.9053h-0.6873v-0.65216h0.00413v-1.0997h-0.00672a0.47585 0.47463 0 0 0-0.47594-0.46664 0.47585 0.47463 0 0 0-0.47594 0.47439 0.47585 0.47463 0 0 0 0.00672 0.076481v1.002h-0.68523v-0.4377a1.0208 1.0208 0 0 1-0.00258 0.00207v-0.678h-0.00672a0.47585 0.47463 0 0 0-0.47594-0.46716 0.47585 0.47463 0 0 0-0.47542 0.47491 0.47585 0.47463 0 0 0 0.0062 0.075964v0.74827a1.0208 1.0208 0 0 1-0.00103-5.168e-4v0.9555h-0.6873v-1.8702h0.00155a1.0208 1.0208 0 0 1-0.00155-0.049609 1.0208 1.0208 0 0 1 1.0206-1.0206z" stroke-width=".35534"/><path id="path2228" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".38059"/></g></svg>
--- a/img/mastodon-light.svg
+++ b/img/mastodon-light.svg
@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg1332" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><g id="layer1" fill="#181715"><path id="rect1756" d="m4.3183 1.9766c-1.1726 0-2.1167 0.82603-2.1167 1.8521v1.4382c0 0.13426 0.015785 0.26518 0.046509 0.39119-0.036015 0.37794 0.017995 0.87014 0.23719 1.5084 0.78289 2.2797 4.0194 1.1705 4.0194 1.1705s-0.021792-0.0096-0.045475-0.55449c-2.1752 0.49248-2.4572-0.32707-2.481-0.68678 0.11059 0.01549 0.2243 0.02326 0.34003 0.02326h1.9467c1.1726 0 2.1167-0.82603 2.1167-1.8521v-1.4382c0-1.0261-0.94404-1.8521-2.1167-1.8521zm0.03359 1.0878a1.0208 1.0208 0 0 1 0.96118 0.67644 1.0208 1.0208 0 0 1 0.96015-0.67644 1.0208 1.0208 0 0 1 1.0211 1.0206 1.0208 1.0208 0 0 1-5.168e-4 0.00672h5.168e-4v1.9053h-0.6873v-0.65216h0.00413v-1.0997h-0.00672a0.47585 0.47463 0 0 0-0.47594-0.46664 0.47585 0.47463 0 0 0-0.47594 0.47439 0.47585 0.47463 0 0 0 0.00672 0.076481v1.002h-0.68523v-0.4377a1.0208 1.0208 0 0 1-0.00258 0.00207v-0.678h-0.00672a0.47585 0.47463 0 0 0-0.47594-0.46716 0.47585 0.47463 0 0 0-0.47542 0.47491 0.47585 0.47463 0 0 0 0.0062 0.075964v0.74827a1.0208 1.0208 0 0 1-0.00103-5.168e-4v0.9555h-0.6873v-1.8702h0.00155a1.0208 1.0208 0 0 1-0.00155-0.049609 1.0208 1.0208 0 0 1 1.0206-1.0206z" stroke-width=".35534"/><path id="path2228" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".38059"/></g></svg>
--- a/img/mastodon.svg
+++ b/img/mastodon.svg
@@ -1,45 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg1332"
-   xml:space="preserve"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   sodipodi:docname="mastodon_ikonica.svg"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
-     id="namedview1334"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="0"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="true"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="px"
-     showgrid="false"
-     inkscape:zoom="8"
-     inkscape:cx="-6"
-     inkscape:cy="29.5625"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" /><defs
-     id="defs1329" /><g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1"><path
-       id="rect1756"
-       style="fill:#181715;fill-opacity:1;stroke-width:0.355335"
-       d="m 4.3183404,1.9765891 c -1.17263,0 -2.116666,0.8260312 -2.116666,1.8520832 v 1.4381551 c 0,0.1342579 0.015785,0.2651846 0.046509,0.3911906 -0.036015,0.377942 0.017995,0.870137 0.237194,1.508435 0.782893,2.2797331 4.0193931,1.170471 4.0193931,1.170471 0,0 -0.021792,-0.0096 -0.045475,-0.554488 -2.1752389,0.492479 -2.4571729,-0.327074 -2.4809859,-0.68678 0.110588,0.01549 0.224303,0.02326 0.340031,0.02326 h 1.9466515 c 1.1726309,0 2.1166666,-0.826032 2.1166666,-1.8520836 V 3.8286723 c 0,-1.026052 -0.9440357,-1.8520832 -2.1166666,-1.8520832 z m 0.03359,1.0877888 a 1.0208462,1.0208462 0 0 1 0.961182,0.6764445 1.0208462,1.0208462 0 0 1 0.9601477,-0.6764445 1.0208462,1.0208462 0 0 1 1.0211263,1.0206095 1.0208462,1.0208462 0 0 1 -5.168e-4,0.00672 h 5.168e-4 V 5.997015 H 6.6070899 V 5.3448588 h 0.00413 V 4.2451844 h -0.00672 A 0.47585312,0.47462767 0 0 0 6.1285599,3.7785462 0.47585312,0.47462767 0 0 0 5.65262,4.2529358 0.47585312,0.47462767 0 0 0 5.65934,4.3294168 V 5.3314229 H 4.9741144 V 4.8937236 a 1.0208462,1.0208462 0 0 1 -0.00258,0.00207 V 4.2177959 h -0.00672 a 0.47585312,0.47462767 0 0 0 -0.47594,-0.467155 0.47585312,0.47462767 0 0 0 -0.475424,0.4749064 0.47585312,0.47462767 0 0 0 0.0062,0.075964 V 5.049786 a 1.0208462,1.0208462 0 0 1 -0.00103,-5.168e-4 V 6.004767 H 3.3313214 V 4.1345968 h 0.00155 a 1.0208462,1.0208462 0 0 1 -0.00155,-0.049609 1.0208462,1.0208462 0 0 1 1.020609,-1.0206099 z" /><path
-       id="path2228"
-       style="fill:#181715;fill-opacity:1;stroke-width:0.380589"
-       d="M 5.2916665 0 A 5.2916665 5.2916665 0 0 0 0 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916665 A 5.2916665 5.2916665 0 0 0 5.2916665 0 z M 5.2916665 0.66145831 A 4.630208 4.630208 0 0 1 9.9218747 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 9.9218747 A 4.630208 4.630208 0 0 1 0.66145831 5.2916665 A 4.630208 4.630208 0 0 1 5.2916665 0.66145831 z " /></g></svg>
--- a/img/mesh-dark.png
+++ b/img/mesh-dark.png
--- a/img/mesh-dark.svg
+++ b/img/mesh-dark.svg
@@ -0,0 +1,23 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="500" height="700"
+  background-color="rgba(0,0,0,0)">
+  <line x1="500" x2="475" y1="0" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="450" y1="35" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="425" y1="70" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="400" y1="105" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="375" y1="140" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="350" y1="175" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="325" y1="210" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="300" y1="245" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="275" y1="280" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="250" y1="315" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="225" y1="350" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="200" y1="385" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="175" y1="420" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="150" y1="455" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="125" y1="490" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="100" y1="525" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="75" y1="560" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="50" y1="595" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="25" y1="630" y2="700" stroke="rgba(255,255,255,1)" />
+  <line x1="500" x2="0" y1="665" y2="700" stroke="rgba(255,255,255,1)" />
+</svg>
--- a/img/mesh-light.png
+++ b/img/mesh-light.png
--- a/img/mesh-light.svg
+++ b/img/mesh-light.svg
@@ -0,0 +1,23 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="500" height="700"
+  background-color="rgba(0,0,0,0)">
+  <line x1="500" x2="475" y1="0" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="450" y1="35" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="425" y1="70" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="400" y1="105" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="375" y1="140" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="350" y1="175" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="325" y1="210" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="300" y1="245" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="275" y1="280" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="250" y1="315" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="225" y1="350" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="200" y1="385" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="175" y1="420" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="150" y1="455" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="125" y1="490" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="100" y1="525" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="75" y1="560" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="50" y1="595" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="25" y1="630" y2="700" stroke="rgba(24, 23, 21, 1)" />
+  <line x1="500" x2="0" y1="665" y2="700" stroke="rgba(24, 23, 21, 1)" />
+</svg>
--- a/img/srce-dark.svg
+++ b/img/srce-dark.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10.583333 10.583333"
+   version="1.1"
+   id="svg2421"
+   sodipodi:docname="srce-dark.svg"
+   inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview2423"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="7.967789"
+     inkscape:cx="4.2044286"
+     inkscape:cy="19.892595"
+     inkscape:window-width="1920"
+     inkscape:window-height="1048"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     inkscape:pageshadow="0" />
+  <defs
+     id="defs2418" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <path
+       id="path2477"
+       style="fill:#ffffff;stroke-width:0.355037"
+       d="M 5.2916667 0 A 5.2916665 5.2916665 0 0 0 0 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 0 z M 5.2916667 0.66145833 A 4.6302085 4.6302085 0 0 1 9.921875 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 9.921875 A 4.6302085 4.6302085 0 0 1 0.66145833 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 0.66145833 z " />
+    <text
+       xml:space="preserve"
+       style="font-size:7.05556px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#181715;fill-opacity:1;stroke-width:0.355335"
+       x="-2.7021213"
+       y="4.7616987"
+       id="text3068"><tspan
+         sodipodi:role="line"
+         id="tspan3066"
+         style="fill:#181715;fill-opacity:1;stroke-width:0.355335"
+         x="-2.7021213"
+         y="4.7616987" /></text>
+    <path
+       id="path3659"
+       style="fill:#ffffff;fill-opacity:1;stroke-width:0.384877"
+       d="m 2.4853365,3.1439096 a 1.984375,1.984375 0 0 0 0,2.80633 l 2.806331,2.8063301 2.8063299,-2.8063301 a 1.984375,1.984375 0 0 0 0,-2.80633 1.984375,1.984375 0 0 0 -2.8063299,0 1.984375,1.984375 0 0 0 -2.806331,0 z" />
+  </g>
+</svg>
--- a/img/srce-light.svg
+++ b/img/srce-light.svg
--- a/img/strelica-closed-dark.svg
+++ b/img/strelica-closed-dark.svg
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="strelica-closed-dark.svg"
+   inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview6"
+     pagecolor="#ffffff"
+     bordercolor="#111111"
+     borderopacity="1"
+     inkscape:pageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="1"
+     showgrid="false"
+     inkscape:zoom="20.975"
+     inkscape:cx="20"
+     inkscape:cy="20"
+     inkscape:window-width="1920"
+     inkscape:window-height="1048"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="rect288"
+       style="fill:#ffffff;stroke-width:0.345614"
+       d="M 0 0 L 0 1.25 L 8.1494141 1.25 L 2.5751953 10 L 4.0571289 10 L 8.75 2.6333008 L 8.75 10 L 10 10 L 10 1.25 L 10 0.67138672 L 10 0 L 8.9458008 0 L 8.75 0 L 0 0 z " />
+  </g>
+</svg>
--- a/img/strelica-closed-light.svg
+++ b/img/strelica-closed-light.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="rect288"
+       style="fill:#181715;stroke-width:0.345614"
+       d="M 0 0 L 0 1.25 L 8.1494141 1.25 L 2.5751953 10 L 4.0571289 10 L 8.75 2.6333008 L 8.75 10 L 10 10 L 10 1.25 L 10 0.67138672 L 10 0 L 8.9458008 0 L 8.75 0 L 0 0 z " />
+  </g>
+</svg>
--- a/img/strelica-closed.svg
+++ b/img/strelica-closed.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="path1336"
+       style="fill:#181715;stroke-width:0.504542;fill-opacity:1"
+       d="M 10 0 L 8.8911133 0.57714844 L 8.8862305 0.58544922 L 0.96435547 4.2792969 A 10 10 0 0 0 1.574707 5.3740234 L 7.6362305 2.5473633 L 4.1142578 8.0756836 A 10 10 0 0 0 5.1674805 8.7485352 L 8.6904297 3.21875 L 8.6904297 9.9086914 A 10 10 0 0 0 9.9404297 9.9975586 L 9.9404297 1.2568359 L 9.9453125 1.2490234 L 10 0 z " />
+  </g>
+</svg>
--- a/img/strelica-opened-dark.svg
+++ b/img/strelica-opened-dark.svg
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   sodipodi:docname="strelica-opened-dark.svg"
+   inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview6"
+     pagecolor="#ffffff"
+     bordercolor="#111111"
+     borderopacity="1"
+     inkscape:pageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="1"
+     showgrid="false"
+     inkscape:zoom="20.975"
+     inkscape:cx="20"
+     inkscape:cy="20"
+     inkscape:window-width="1920"
+     inkscape:window-height="1048"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="rect288"
+       style="fill:#ffffff;stroke-width:0.345614"
+       d="M 0 0 L 0 1.25 L 2.8071289 1.25 L 2.8071289 10 L 4.0571289 10 L 4.0571289 1.25 L 8.75 1.25 L 10 1.25 L 10 0 L 8.75 0 L 0 0 z " />
+  </g>
+</svg>
--- a/img/strelica-opened-light.svg
+++ b/img/strelica-opened-light.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="rect288"
+       style="fill:#181715;stroke-width:0.345614"
+       d="M 0 0 L 0 1.25 L 2.8071289 1.25 L 2.8071289 10 L 4.0571289 10 L 4.0571289 1.25 L 8.75 1.25 L 10 1.25 L 10 0 L 8.75 0 L 0 0 z " />
+  </g>
+</svg>
--- a/img/strelica-opened.svg
+++ b/img/strelica-opened.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10 10"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <path
+       id="path1336"
+       style="fill:#181715;fill-opacity:1;stroke-width:0.504542"
+       d="M 5 0.0029296875 L 4.375 1.0859375 L 4.375 1.0952148 L 0.35400391 7.4072266 A 8.75 8.75 0 0 0 1.4614258 7.9956055 L 4.375 3.4213867 L 4.375 8.7265625 A 8.75 8.75 0 0 0 5 8.75 A 8.75 8.75 0 0 0 5.625 8.7265625 L 5.625 3.4213867 L 8.5390625 7.9956055 A 8.75 8.75 0 0 0 9.6464844 7.4072266 L 5.625 1.0952148 L 5.625 1.0859375 L 5 0.0029296875 z " />
+  </g>
+</svg>
--- a/img/w-dark.svg
+++ b/img/w-dark.svg
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg2421" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xmlns="http://www.w3.org/2000/svg">
+ <g id="layer1">
+  <path id="path2477" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" fill="#fff" stroke-width=".35504"/>
+  <g id="text3068" fill="#181715" stroke-width=".35534" aria-label="w">
+   <path id="path698" d="m2.4342 2.3813h0.84666l0.51858 3.9899q0.021167 0.1905 0.042333 0.42333 0.021167 0.23283 0.042333 0.43392 0.021167 0.23283 0.042333 0.46567h0.11642q0.021167-0.23283 0.052916-0.46567 0.021167-0.20108 0.052917-0.43392t0.0635-0.42333l0.61383-3.9899h0.91016l0.61383 3.9899q0.03175 0.20108 0.0635 0.43392t0.052917 0.43392q0.03175 0.23283 0.052917 0.45508h0.127q0.021167-0.23283 0.042333-0.46567 0.021167-0.20108 0.052916-0.42333 0.03175-0.23283 0.052917-0.43392l0.52916-3.9899h0.8255l-0.8255 5.8208h-1.3017l-0.60325-4.1169q-0.021167-0.17992-0.042333-0.37042-0.010583-0.20108-0.021167-0.37042 0-0.1905 0-0.381h-0.13758q0 0.1905-0.010583 0.381-0.010583 0.16933-0.021167 0.37042-0.010583 0.1905-0.042333 0.37042l-0.62441 4.1169h-1.27z" fill="#fff"/>
+  </g>
+ </g>
+</svg>
--- a/img/w-light.svg
+++ b/img/w-light.svg
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg2421" width="40" height="40" version="1.1" viewBox="0 0 10.583 10.583" xmlns="http://www.w3.org/2000/svg">
+ <g id="layer1" fill="#181715">
+  <path id="path2477" d="m5.2917 0a5.2917 5.2917 0 0 0-5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917 5.2917 5.2917 5.2917 0 0 0 5.2917-5.2917 5.2917 5.2917 0 0 0-5.2917-5.2917zm0 0.66146a4.6302 4.6302 0 0 1 4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302 4.6302 4.6302 4.6302 0 0 1-4.6302-4.6302 4.6302 4.6302 0 0 1 4.6302-4.6302z" stroke-width=".35504"/>
+  <g id="text3068" stroke-width=".35534" aria-label="w">
+   <path id="path698" d="m2.4342 2.3813h0.84666l0.51858 3.9899q0.021167 0.1905 0.042333 0.42333 0.021167 0.23283 0.042333 0.43392 0.021167 0.23283 0.042333 0.46567h0.11642q0.021167-0.23283 0.052916-0.46567 0.021167-0.20108 0.052917-0.43392t0.0635-0.42333l0.61383-3.9899h0.91016l0.61383 3.9899q0.03175 0.20108 0.0635 0.43392t0.052917 0.43392q0.03175 0.23283 0.052917 0.45508h0.127q0.021167-0.23283 0.042333-0.46567 0.021167-0.20108 0.052916-0.42333 0.03175-0.23283 0.052917-0.43392l0.52916-3.9899h0.8255l-0.8255 5.8208h-1.3017l-0.60325-4.1169q-0.021167-0.17992-0.042333-0.37042-0.010583-0.20108-0.021167-0.37042 0-0.1905 0-0.381h-0.13758q0 0.1905-0.010583 0.381-0.010583 0.16933-0.021167 0.37042-0.010583 0.1905-0.042333 0.37042l-0.62441 4.1169h-1.27z"/>
+  </g>
+ </g>
+</svg>
--- a/img/w.svg
+++ b/img/w.svg
@@ -1,55 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="40"
-   height="40"
-   viewBox="0 0 10.583333 10.583333"
-   version="1.1"
-   id="svg2421"
-   sodipodi:docname="w.svg"
-   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <sodipodi:namedview
-     id="namedview2423"
-     pagecolor="#505050"
-     bordercolor="#eeeeee"
-     borderopacity="1"
-     inkscape:showpageshadow="0"
-     inkscape:pageopacity="0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#505050"
-     inkscape:document-units="mm"
-     showgrid="false"
-     inkscape:zoom="11.268155"
-     inkscape:cx="19.612794"
-     inkscape:cy="17.882253"
-     inkscape:window-width="1362"
-     inkscape:window-height="764"
-     inkscape:window-x="0"
-     inkscape:window-y="0"
-     inkscape:window-maximized="1"
-     inkscape:current-layer="layer1" />
-  <defs
-     id="defs2418" />
-  <g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1">
-    <path
-       id="path2477"
-       style="fill:#181715;stroke-width:0.355037"
-       d="M 5.2916667 0 A 5.2916665 5.2916665 0 0 0 0 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 0 z M 5.2916667 0.66145833 A 4.6302085 4.6302085 0 0 1 9.921875 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 9.921875 A 4.6302085 4.6302085 0 0 1 0.66145833 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 0.66145833 z " />
-    <g
-       aria-label="w"
-       id="text3068"
-       style="font-size:10.5833px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#181715;stroke-width:0.355335">
-      <path
-         d="M 2.434176,2.3812593 H 3.28084 l 0.5185817,3.9899039 q 0.021167,0.1904994 0.042333,0.423332 0.021167,0.2328326 0.042333,0.4339153 0.021167,0.2328326 0.042333,0.4656652 h 0.1164163 q 0.021167,-0.2328326 0.052916,-0.4656652 0.021167,-0.2010827 0.052917,-0.4339153 0.03175,-0.2328326 0.0635,-0.423332 L 4.8260018,2.3812593 h 0.9101637 l 0.6138314,3.9899039 q 0.03175,0.2010827 0.0635,0.4339153 0.03175,0.2328326 0.052917,0.4339153 0.03175,0.2328326 0.052917,0.4550819 h 0.1269996 q 0.021167,-0.2328326 0.042333,-0.4656652 0.021167,-0.2010827 0.052916,-0.423332 0.03175,-0.2328326 0.052917,-0.4339153 L 7.3236605,2.3812593 H 8.1491578 L 7.3236605,8.2020741 H 6.0219146 L 5.4186665,4.0851705 Q 5.3974999,3.9052544 5.3763333,3.714755 5.36575,3.5136723 5.3551667,3.3443395 q 0,-0.1904994 0,-0.3809988 H 5.2175838 q 0,0.1904994 -0.010583,0.3809988 -0.010583,0.1693328 -0.021167,0.3704155 -0.010583,0.1904994 -0.042333,0.3704155 L 4.5190861,8.2020741 h -1.269996 z"
-         id="path698" />
-    </g>
-  </g>
-</svg>
--- a/img/www-dark.svg
+++ b/img/www-dark.svg
@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="40"
+   height="40"
+   viewBox="0 0 10.583333 10.583333"
+   version="1.1"
+   id="svg2421"
+   inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
+   sodipodi:docname="www-dark.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview2423"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="11.268155"
+     inkscape:cx="19.39093"
+     inkscape:cy="17.793507"
+     inkscape:window-width="1920"
+     inkscape:window-height="1048"
+     inkscape:window-x="0"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1"
+     inkscape:pageshadow="0" />
+  <defs
+     id="defs2418" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <path
+       id="path2477"
+       style="fill:#ffffff;stroke-width:0.355037"
+       d="M 5.2916667 0 A 5.2916665 5.2916665 0 0 0 0 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 10.583333 A 5.2916665 5.2916665 0 0 0 10.583333 5.2916667 A 5.2916665 5.2916665 0 0 0 5.2916667 0 z M 5.2916667 0.66145833 A 4.6302085 4.6302085 0 0 1 9.921875 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 9.921875 A 4.6302085 4.6302085 0 0 1 0.66145833 5.2916667 A 4.6302085 4.6302085 0 0 1 5.2916667 0.66145833 z " />
+    <path
+       d="M 1.6086655,4.1275011 H 1.9473319 L 2.154765,5.7234664 q 0.00847,0.0762 0.016933,0.1693332 0.00847,0.093133 0.016933,0.1735665 0.00847,0.093133 0.016933,0.1862666 h 0.046567 q 0.00847,-0.093133 0.021167,-0.1862666 0.00847,-0.080433 0.021167,-0.1735665 0.0127,-0.093133 0.0254,-0.1693332 L 2.565398,4.1275011 h 0.3640664 l 0.2455331,1.5959653 q 0.0127,0.080433 0.0254,0.1735666 0.0127,0.093133 0.021167,0.1735665 0.0127,0.093133 0.021167,0.1820332 h 0.0508 q 0.00847,-0.093133 0.016933,-0.1862666 0.00847,-0.080433 0.021167,-0.1693331 0.0127,-0.093133 0.021167,-0.1735666 L 3.5644639,4.1275011 H 3.8946636 L 3.5644639,6.4558325 H 3.0437643 L 2.8024645,4.8090672 q -0.00847,-0.071967 -0.016933,-0.1481665 -0.00423,-0.080433 -0.00847,-0.1481666 0,-0.0762 0,-0.1523999 h -0.055033 q 0,0.0762 -0.00423,0.1523999 -0.00423,0.067733 -0.00847,0.1481666 -0.00423,0.0762 -0.016933,0.1481665 L 2.4426315,6.4558325 H 1.9346319 Z"
+       id="path503"
+       style="font-size:4.23333px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#ffffff;stroke-width:0.355335" />
+    <path
+       d="m 4.148665,4.1275011 h 0.3386664 l 0.2074331,1.5959653 q 0.00847,0.0762 0.016933,0.1693332 0.00847,0.093133 0.016933,0.1735665 0.00847,0.093133 0.016933,0.1862666 h 0.046567 q 0.00847,-0.093133 0.021167,-0.1862666 0.00847,-0.080433 0.021167,-0.1735665 0.0127,-0.093133 0.0254,-0.1693332 L 5.1053975,4.1275011 H 5.4694639 L 5.714997,5.7234664 q 0.0127,0.080433 0.0254,0.1735666 0.0127,0.093133 0.021167,0.1735665 0.0127,0.093133 0.021167,0.1820332 h 0.0508 Q 5.842001,6.1594997 5.850464,6.0663661 5.858934,5.9859331 5.871631,5.897033 5.884331,5.8039 5.892798,5.7234664 L 6.1044633,4.1275011 H 6.4346631 L 6.1044633,6.4558325 H 5.5837638 L 5.342464,4.8090672 Q 5.333994,4.7371002 5.325531,4.6609007 5.321301,4.5804677 5.317061,4.5127341 q 0,-0.0762 0,-0.1523999 H 5.262028 q 0,0.0762 -0.00423,0.1523999 -0.00423,0.067733 -0.00847,0.1481666 -0.00423,0.0762 -0.016933,0.1481665 L 4.982631,6.4558325 H 4.4746314 Z"
+       id="path505"
+       style="font-size:4.23333px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#ffffff;stroke-width:0.355335" />
+    <path
+       d="M 6.6886645,4.1275011 H 7.0273309 L 7.234764,5.7234664 q 0.00847,0.0762 0.016933,0.1693332 0.00847,0.093133 0.016933,0.1735665 0.00847,0.093133 0.016933,0.1862666 H 7.33213 q 0.00847,-0.093133 0.021167,-0.1862666 0.00847,-0.080433 0.021167,-0.1735665 0.0127,-0.093133 0.0254,-0.1693332 L 7.645397,4.1275011 h 0.3640664 l 0.2455331,1.5959653 q 0.0127,0.080433 0.0254,0.1735666 0.0127,0.093133 0.021167,0.1735665 0.0127,0.093133 0.021167,0.1820332 h 0.0508 q 0.00847,-0.093133 0.016933,-0.1862666 0.00847,-0.080433 0.021167,-0.1693331 0.0127,-0.093133 0.021167,-0.1735666 L 8.6444628,4.1275011 H 8.9746626 L 8.6444628,6.4558325 H 8.1237633 L 7.8824635,4.8090672 q -0.00847,-0.071967 -0.016933,-0.1481665 -0.00423,-0.080433 -0.00847,-0.1481666 0,-0.0762 0,-0.1523999 h -0.055033 q 0,0.0762 -0.00423,0.1523999 -0.00423,0.067733 -0.00847,0.1481666 -0.00423,0.0762 -0.016933,0.1481665 L 7.5226304,6.4558325 H 7.0146309 Z"
+       id="path507"
+       style="font-size:4.23333px;font-family:'JetBrains Mono';-inkscape-font-specification:'JetBrains Mono, Normal';fill:#ffffff;stroke-width:0.355335" />
+  </g>
+</svg>
--- a/img/www-light.svg
+++ b/img/www-light.svg
--- a/index.html
+++ b/index.html
@@ -4,57 +4,68 @@
 <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="/styles/reset.css">
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/home.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a id="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
-    <h1>Dobrodosli!</h1>
+  <div id="main">
+    <h1>Dobrodošao!</h1>
    <p>
-      Mi smo <em>Decentrala</em> - grupa entuzijasta okupljena oko ideja decentralizacije i slobodnog sirenja znanja.
-      Zvuci interesantno? Evo jos nekih stvari o nama:
+      Mi smo <em>Decentrala</em> - grupa entuzijasta okupljena oko ideja decentralizacije i slobodnog širenja znanja.
+      Zvuči interesantno? Evo još nekih stvari o nama:
    </p>
    <dl>
      <dt>Znanje:</dt>
-      <dd>Sve nase radionice su besplatne i otvorene za sve zainteresovane, a ako imate nesto sto zelite da
-        podelite, najavite se na nasem <a href="https://forum.dmz.rs">Forumu</a> i odrzite radionicu kod nas!</dd>
+      <dd>Sve naše radionice su besplatne i otvorene za sve zainteresovane.
+        Ako želiš nešto da podeliš najavi se na našem <a href="https://forum.dmz.rs">Forumu</a> i održi radionicu kod nas!</dd>
      <dt>Akcije:</dt>
-      <dd>Povremeno organizujemo razlicite akcije, hakatone, crypto-partije, izlozbe i slicne dogadjaje otvorene za sve
-        zainteresovane. </dd>
+      <dd>Povremeno organizujemo različite akcije, hakatone, crypto-partije, izložbe i slične događaje otvorene za sve zainteresovane. </dd>
      <dt>Servisi:</dt>
-      <dd>Na nasim serverima pokrecemo neke servise (email, git, wiki i druge) koji su otvoreni za sve i koje mozes
-        koristiti sa ili bez naseg naloga.</dd>
-      <dt>Ljudi:</dt>
-      <dd>Lorem ipsum dolor sit amet.</dd>
+      <dd>Na našim serverima pokrećemo razne servise (email, git, wiki i druge) koji su otvoreni za sve i koji se mogu koristiti sa ili bez našeg naloga.</dd>
    </dl>
    <p>
-      Ako si procitao sve i i dalje si zainteresovan, mozes da napravis <a href="/pages/account.html">nalog</a> na nasem
-      serveru koji ce
-      ti omoguciti da koristis sve nase <a href="/pages/services.html">servise</a>, a ako prvo hoces da vidis kako to
-      sve izgleda u realnosti, mozes da dodjes na neki od nasih <a href="/pages/events.html">dogadjaja</a>, i tamo nas
-      upoznas!
+      Ako si i dalje zainteresovan, možeš napraviti <a href="/pages/account.html">nalog</a> na našem serveru koji će ti omogućiti korišćenje svih naših <a href="/pages/services.html">servisa</a>.
+      Ako želiš prvo da vidiš kako to sve izgleda u realnosti, možeš doći na neki od naših <a href="/pages/events.html">događaja</a>, i tu nas upoznati!
    </p>
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <span class="links">
+        <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+            alt="CreativeCommons"></a>
+        <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+        <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+            alt="SourceCode"></a>
+        <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
+      </span>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/mesh.js
+++ b/mesh.js
@@ -1,11 +0,0 @@
-// this is a p5.js script that generates mesh image for the website
-function setup() {
-  createCanvas(500, 700);
-  background("rgba(0,0,0,0)");
-  stroke("rgba(255,255,255,1)");
-  let j = 475;
-  for (let i = 0; i < 700; i += 35) {
-    line(500, i, j, 700);
-    j -= 25;
-  }
-}
--- a/pages/account.html
+++ b/pages/account.html
@@ -7,30 +7,45 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/account.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Nalog</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    Ova stranica je trenutno u izradi...
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/pages/blog.html
+++ b/pages/blog.html
@@ -7,30 +7,45 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/blog.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Blog</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    Ova stranica je trenutno u izradi...
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/pages/contact.html
+++ b/pages/contact.html
@@ -7,33 +7,50 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/contact.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Kontakt</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    <h1>Kontakt</h1>
-    <p>Mozes nam poslati mail na <a href="mailto:dmz@dmz.rs">dmz@dmz.rs</a> ili se mozes pridruziti nasem <a
+    <p>Možeš nam poslati mail na <a href="mailto:dmz@dmz.rs">dmz@dmz.rs</a> ili se mozes pridružiti našem <a
        href="https://forum.dmz.rs">Forumu</a>.</p>
-    <p>Takodje smo i na <a href="https://balkan.fedive.rs/@decentrala">Fediversu!</a></p>
-    <img src="/img/mesh-light.png">
+    <p>Takođe smo i na <a href="https://balkan.fedive.rs/@decentrala">Fediversu!</a></p>
+    <p style="position: relative; top: 5rem;">U slucaju da nadjete <em>bug</em> na sajtu, bili bismo jako zahvalni
+      ako bi mogli da nam ga prijavite (npr. putem emaila).</p>
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/pages/events.html
+++ b/pages/events.html
@@ -7,14 +7,19 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/events.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Dogadjaji</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    <h1>Dogadjaji</h1>
    <!-- dogadjaji start -->
    <table>
@@ -64,9 +69,17 @@

    </table>
    <!-- dogadjaji end -->
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
      <a href="/pages/events.html">Dogadjaji</a>
      <a href="/pages/projects.html">Projekti</a>
@@ -75,10 +88,12 @@
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/pages/projects.html
+++ b/pages/projects.html
@@ -7,30 +7,45 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/projects.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Projekti</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    Ova stranica je trenutno u izradi...
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/pages/services.html
+++ b/pages/services.html
@@ -7,14 +7,19 @@
  <link rel="stylesheet" href="/styles/style.css">
  <link rel="stylesheet" href="/styles/services.css">
  <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
+  <script src="/scripts/main.js" defer></script>
  <title>Decentrala - Servisi</title>
 </head>

 <body>
  <header>
-    <a class="logo" href="/index.html">Decentrala</a> <a class="account" href="/pages/account.html">Nalog</a>
+    <a class="logo" href="/index.html">Decentrala</a>
+    <span>
+      <button id="theme-switcher">turn the lights off</button>
+      <a class="account" href="/pages/account.html">Nalog</a>
+    </span>
  </header>
-  <div class="main">
+  <div id="main">
    <h1>Servisi</h1>
    <table>
      <tr>
@@ -57,21 +62,31 @@
    <p>Ovo su neki od servisa koje trenutno odrzavamo na nasim serverima. Da bi koristio ove servise, <em>mozes</em> se
      registrujes za svaki servis posebno, ali mozes i da da napravis <a href="/pages/account.html">nalog</a> na nasem
      serveru i koristis sve servis sa istim nalogom.</p>
-    <img src="/img/mesh-light.png">
+    <img id="mesh" src="/img/mesh-light.svg">
  </div>
  <footer>
+    <div id="sections-menu">
+      <a href="/pages/events.html">Događaji</a>
+      <a href="/pages/projects.html">Projekti</a>
+      <a href="/pages/blog.html">Blog</a>
+      <a href="/pages/services.html">Servisi</a>
+      <a href="/pages/contact.html">Kontakt</a>
+    </div>
+    <button id="sections-button" opened="false"><img src="/img/strelica-closed-light.svg" alt="OpenMenu"></button>
    <span class="sections">
-      <a href="/pages/events.html">Dogadjaji</a>
+      <a href="/pages/events.html">Događaji</a>
      <a href="/pages/projects.html">Projekti</a>
      <a href="/pages/blog.html">Blog</a>
      <a href="/pages/services.html">Servisi</a>
      <a href="/pages/contact.html">Kontakt</a>
    </span>
    <span class="copyleft">
-      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc.svg" alt="CreativeCommons"></a>
-      <a href=""><img src="/img/w.svg" alt="Webring"></a>
-      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git.svg" alt="SourceCode"></a>
-      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon.svg" alt="Mastodon"></a>
+      <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/"><img src="/img/cc-light.svg"
+          alt="CreativeCommons"></a>
+      <a href=""><img src="/img/w-light.svg" alt="Webring"></a>
+      <a href="https://gitea.dmz.rs/eline/decentrala-website-static-new"><img src="/img/git-light.svg"
+          alt="SourceCode"></a>
+      <a href="https://balkan.fedive.rs/@decentrala"><img src="/img/mastodon-light.svg" alt="Mastodon"></a>
      <span>Decentrala &copy; 2023</span>
    </span>
  </footer>
--- a/poster.html
+++ b/poster.html
@@ -0,0 +1,9 @@
+<html><head><link rel="stylesheet" href="styles/poster.css"><head><body><main><h1>DECENTRALA</h1><h2>Plan za Avgust</h2><table><tr><td>UTO</td><td>1.</td><td> Tehno veče</td></tr>
+<tr><td>PON</td><td>7.</td><td> Linux ricing</td></tr>
+<tr><td>UTO</td><td>8.</td><td> Lambda račun</td></tr>
+<tr><td>PON</td><td>14.</td><td> Linux distro diskusija</td></tr>
+<tr><td>UTO</td><td>15.</td><td> Pirati 777 mora</td></tr>
+<tr><td>PON</td><td>21.</td><td> Python vežbe</td></tr>
+<tr><td>UTO</td><td>22.</td><td> Autentifikacija na internetu</td></tr>
+<tr><td>PON</td><td>28.</td><td> Kviz</td></tr>
+</table><p>Radionice počinju u <strong>19h</strong> u Društvenom centru Krov u <strong>Kraljice Marije 47</strong>.</p><p>Ulaz u zgradu je u prolazu pored Štark prodavnice slatkiša, odmah pored menjačnice. DC Krov je na poslednjem spratu.</p><div id=link>dmz.rs</div></main></body></html>
--- a/poster.py
+++ b/poster.py
@@ -0,0 +1,61 @@
+import csv
+import datetime as dt
+from dateutil import relativedelta
+
+EVENTS_CSV_PATH = "dogadjaji.csv"
+CURRENT_TIME = dt.date.today()
+NEXT_MONTH = CURRENT_TIME + relativedelta.relativedelta(months=1, day=1)
+DAYS_OF_WEEK_SR = ("PON", "UTO", "SRE", "ČET", "PET", "SUB", "NED")
+MONTHS_SR = ("Januar", "Februar", "Mart", "April", "Maj", "Jun", "Jul", "Avgust",\
+            "Septembar", "Oktobar", "Novembar", "Decembar")
+
+def load_events(csv_path:str) -> list[dict]:
+    events = []
+    with open(csv_path) as csv_file:
+        csv_reader = csv.reader(csv_file)
+        next(csv_reader, None)
+        for event in csv_reader:
+            event_date = event[0]
+            event_date_parsed = dt.datetime.strptime(event_date, "%d-%m-%Y").date()
+            event_time = event[1]
+            event_title = event[3]
+            current_event = {"date":event_date_parsed,
+                             "time":event_time,
+                             "title":event_title.strip()}
+            if event_date_parsed >= NEXT_MONTH:
+                events.append(current_event)
+        return events
+
+def render_table(events:list[dict])-> str:
+    html = ""
+    for event in events:
+        date = DAYS_OF_WEEK_SR[event["date"].weekday()]
+        day = event["date"].day
+        title = event["title"]
+        html += f"\t\t\t<tr> <td>{date}</td> <td>{day}.</td> <td>{title}</td> </tr>\n"
+    return html
+
+def render_page(table: str) -> str:
+    head = "<head>\n\t<meta charset=\"UTF-8\">\n\t<link rel=\"stylesheet\"\
+href=\"styles/poster.css\">\n<head>"
+    header = "<h1>DECENTRALA</h1>"
+    subheader = f"<h2>Plan za {MONTHS_SR[NEXT_MONTH.month - 1]}</h2>"
+    link = "<div id=link>dmz.rs</div>"
+    p1 = "<p>Radionice počinju u <strong>19h</strong> u Društvenom centru Krov\
+u <strong>Kraljice Marije 47</strong>.</p>"
+    p2 = "<p>Ulaz u zgradu je u prolazu pored Štark prodavnice slatkiša, odmah\
+pored menjačnice. DC Krov je na poslednjem spratu.</p>"
+    return f"<html>\n{head}\n<body>\n\t<main>\n\t\t{header}\n\t\t{subheader}\
+\n\t\t<table>\n{table}\t\t</table>\n\t\t{p1}\n\t\t{p2}\n\t\t{link}\n\t</main>\
+\n</body>\n</html>"
+    
+def main():
+    events = load_events(EVENTS_CSV_PATH)
+    table = render_table(events)
+    page = render_page(table)
+    f = open("poster.html", "w")
+    f.write(page)
+    f.close()
+
+if __name__ == "__main__":
+    main()
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -0,0 +1,93 @@
+const theme_switcher = document.getElementById("theme-switcher");
+const imgs = document.getElementsByTagName("img");
+const sections_button = document.getElementById("sections-button");
+const sections_menu = document.getElementById("sections-menu");
+const main = document.getElementById("main");
+
+let theme = window.localStorage.getItem("theme");
+
+if (theme !== null) {
+  if (theme === "light") {
+    changeToLightTheme();
+  } else {
+    changeToDarkTheme();
+  }
+} else {
+  if (
+    window.matchMedia &&
+    window.matchMedia("(prefers-color-scheme: dark)").matches
+  ) {
+    changeToDarkTheme();
+  }
+}
+
+theme_switcher.addEventListener("click", () => {
+  if (theme_switcher.getAttribute("title").indexOf("off") !== -1) {
+    changeToDarkTheme();
+  } else {
+    changeToLightTheme();
+  }
+});
+
+function changeToDarkTheme() {
+  theme_switcher.setAttribute("title", "turn the light on");
+  document.documentElement.style.setProperty("--border", "var(--dark-border)");
+  document.documentElement.style.setProperty("--text", "var(--dark-text)");
+  document.documentElement.style.setProperty("--bg", "var(--dark-bg)");
+  window.localStorage.setItem("theme", "dark");
+  for (let i = 0; i < imgs.length; i += 1) {
+    imgs[i].src = imgs[i].src.replace("-light", "-dark");
+  }
+}
+
+function changeToLightTheme() {
+  theme_switcher.setAttribute("title", "turn the light off");
+  document.documentElement.style.setProperty("--border", "var(--light-border)");
+  document.documentElement.style.setProperty("--text", "var(--light-text)");
+  document.documentElement.style.setProperty("--bg", "var(--light-bg)");
+  window.localStorage.setItem("theme", "light");
+  for (let i = 0; i < imgs.length; i += 1) {
+    imgs[i].src = imgs[i].src.replace("-dark", "-light");
+  }
+}
+
+function closeMenu() {
+  sections_button.setAttribute("opened", "false");
+  sections_button.children[0].src = sections_button.children[0].src.replace(
+    "opened",
+    "closed",
+  );
+  sections_menu.style.display = "none";
+}
+
+function openMenu() {
+  sections_button.setAttribute("opened", "true");
+  sections_button.children[0].src = sections_button.children[0].src.replace(
+    "closed",
+    "opened",
+  );
+  sections_menu.style.display = "flex";
+  sections_menu.style.flexDirection = "column";
+}
+
+sections_button.addEventListener("click", () => {
+  if (sections_button.getAttribute("opened") === "false") {
+    openMenu();
+  } else {
+    closeMenu();
+  }
+});
+
+window.addEventListener("resize", () => {
+  if (sections_button.getAttribute("opened") === "true") {
+    closeMenu();
+  }
+});
+
+main.addEventListener("click", () => {
+  if (sections_button.getAttribute("opened") === "true") {
+    closeMenu();
+  }
+});
+
+
--- a/styles/blog.css
+++ b/styles/blog.css
@@ -1,3 +1,3 @@
-.main img {
+#mesh {
  display: none;
 }
--- a/styles/events.css
+++ b/styles/events.css
@@ -7,12 +7,12 @@ th,
 td {
  padding: 0 1rem 0 1rem;
  text-align: left;
-  border-left: 2px solid var(--light-border);
+  border-left: 2px solid var(--border);
 }

 th {
  padding: 1rem 1rem 0 1rem;
-  border-bottom: 2px solid var(--light-border);
+  border-bottom: 2px solid var(--border);
 }

 td:nth-child(odd) {
--- a/styles/poster.css
+++ b/styles/poster.css
@@ -0,0 +1,68 @@
+
+html {
+    
+}
+
+@font-face {
+    font-family: Facade;
+    src: url(../font/Facade-Sud.woff);
+}
+  
+  
+@font-face {
+    font-family: jetbrains-mono;
+    src: url(../font/JetBrainsMono-Regular.ttf);
+}
+
+html, body {
+    margin: 0;
+    padding: 0;
+}
+
+main {
+    max-width: 1200px;
+    margin: auto;
+    font-family: 'jetbrains-mono';
+    padding: 2.3rem;
+}
+
+h1 {
+    font-family: 'Facade';
+    text-align: center;
+    font-size: 5rem;
+    margin: 0rem;
+}
+
+h2 {
+    text-align: center;
+    margin-top: 0.0rem;
+    margin-bottom: 2rem;
+    font-size: 2rem;
+}
+
+p {
+    font-size: 1.5rem;
+}
+
+table {
+    margin: 4rem 0;
+}
+
+td {
+    font-size: 1.8rem;
+    padding-top: 0.5rem;
+}
+
+td:first-child {
+    width: 3.5rem;
+}
+
+td:nth-child(2) {
+    padding-right: 1rem;
+}
+
+#link {
+    margin-top: 8rem;
+    text-align: right;
+    font-size: 3rem;
+}
--- a/styles/reset.css
+++ b/styles/reset.css
@@ -0,0 +1,149 @@
+/* Copyright (c) 2023 Luka Ivanovic */
+/* https://github.com/luka-hash/css-reset */
+/* This code is licensed under MIT licence */
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+}
+
+a,
+article,
+audio,
+blockquote,
+body,
+canvas,
+caption,
+code,
+dd,
+del,
+details,
+div,
+dl,
+dt,
+em,
+fieldset,
+figcaption,
+figure,
+footer,
+form,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+header,
+hgroup,
+html,
+iframe,
+img,
+ins,
+kbd,
+label,
+legend,
+li,
+mark,
+menu,
+nav,
+ol,
+output,
+p,
+pre,
+s,
+section,
+small,
+span,
+strong,
+sub,
+summary,
+sup,
+table,
+tbody,
+td,
+tfoot,
+th,
+thead,
+time,
+tr,
+ul,
+video {
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+article,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+
+body {
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+}
+
+ol,
+ul {
+  list-style: none;
+}
+
+blockquote {
+  quotes: none;
+}
+
+blockquote::before,
+blockquote::after {
+  content: '';
+  content: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+img,
+picture,
+video,
+canvas,
+svg {
+  display: block;
+  max-width: 100%;
+}
+
+input,
+button,
+textarea,
+select {
+  font: inherit;
+}
+
+p,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  overflow-wrap: break-word;
+  hyphens: auto;
+}
--- a/styles/services.css
+++ b/styles/services.css
@@ -8,12 +8,12 @@ th,
 td {
  padding: 0 1rem 0 1rem;
  text-align: left;
-  border-left: 2px solid var(--light-border);
+  border-left: 2px solid var(--border);
 }

 th {
  padding: 1rem 1rem 0 1rem;
-  border-bottom: 2px solid var(--light-border);
+  border-bottom: 2px solid var(--border);
 }

 td {
--- a/styles/style.css
+++ b/styles/style.css
@@ -2,10 +2,13 @@
  --light-text: #181715;
  --light-bg: #ffffff;
  --light-border: #181715;
-  /* --dark-text: #ffffff;
+  --dark-text: #ffffff;
  --dark-bg: #181715;
-  --dark-border: #ffffff; */
-  --light-hightlight: #72dec2;
+  --dark-border: #ffffff;
+  --hightlight: #72dec2;
+  --border: var(--light-border);
+  --text: var(--light-text);
+  --bg: var(--light-bg);
 }

@font-face {
@@ -23,16 +26,18 @@ html,
 body {
  width: 100%;
  height: 100%;
-  color: var(--light-text);
-  background: var(--light-bg);
+  color: var(--text);
+  background: var(--bg);
 }

 body {
  display: grid;
-  grid-template-columns: 1fr;
-  grid-template-rows: 5rem 1fr 5rem;
-  grid-column-gap: 0px;
-  grid-row-gap: 0px;
+  grid-template:
+    "header" 10vh
+    "main" 1fr
+    "footer" 10vh
+    / 1fr;
+  gap: 0;
  font-family: 'Iosevka';
 }

@@ -45,55 +50,95 @@ footer {
 }

 header {
-  grid-area: 1 / 1 / 2 / 2;
-  border-bottom: 2px solid var(--light-border);
+  grid-area: "header";
+  border-bottom: 2px solid var(--border);
 }

 footer {
-  grid-area: 3 / 1 / 4 / 2;
-  border-top: 2px solid var(--light-border);
+  grid-area: "footer";
+  border-top: 2px solid var(--border);
 }

-.main {
-  grid-area: 2 / 1 / 3 / 2;
+#main {
+  grid-area: "main";
  padding: 3rem 3rem 3rem 3rem;
  font-size: 1.3rem;
  line-height: 2rem;
  max-width: 120ch;
+  overflow: auto;
 }

 a,
 a:visited {
  text-decoration: none;
-  color: var(--light-text);
+  color: var(--text);
 }

-.main a {
-  /* link offset */
+#main a {
  position: relative;
  top: 0.2rem;
 }

 a:hover,
 a:focus {
-  background-color: var(--light-hightlight);
-  text-decoration: line-through var(--light-text);
+  background-color: var(--hightlight);
+  text-decoration: line-through var(--text);
 }

-.logo {
-  font-size: 3rem;
+#logo {
+  font-size: 2.5rem;
  font-weight: bold;
+  font-variant: small-caps;
 }

+#theme-switcher {
+  border: 3px solid var(--border);
+  width: 1.5rem;
+  height: 1.5rem;
+  border-radius: 3rem;
+  margin-left: auto;
+  background: linear-gradient(90deg, var(--border) 0%, var(--border) 50%, var(--bg) 51%, var(--bg) 100%);
+}
+
+#theme-switcher:hover {
+  border-color: var(--hightlight);
+  background: linear-gradient(90deg, var(--hightlight) 0%, var(--hightlight) 50%, var(--bg) 51%, var(--bg) 100%);
+}
 .account,
-.sections {
-  font-size: 2rem
+.sections,
+#sections-menu {
+  font-size: 2rem;
 }

-.main img {
+#mesh {
  position: absolute;
-  bottom: 5rem;
+  bottom: 10vh;
  right: 0;
+  user-select: none;
+  pointer-events: none;
+}
+
+.links {
+  display: flex;
+}
+
+#sections-button {
+  display: none;
+}
+
+#sections-menu a {
+  margin-bottom: 1rem;
+}
+
+#sections-menu {
+  border: 2px solid var(--border);
+  background-color: var(--bg);
+  position: absolute;
+  bottom: calc(10vh - 2px);
+  left: calc(0px - 2px);
+  align-items: center;
+  padding: 2rem 3rem;
+  display: none;
 }

 .copyleft a,
@@ -103,11 +148,53 @@ a:focus {

 .copyleft a:hover,
 .copyleft a:focus {
-  background-color: var(--light-bg);
+  background-color: var(--bg);
 }

 .copyleft {
  display: flex;
  flex-direction: row;
  align-items: center;
+}
+
+button {
+  font-style: italic;
+  font-weight: lighter;
+  border: none;
+  background: var(--bg);
+  color: var(--text);
+  margin: 0 2rem 0 0;
+  cursor: pointer;
+}
+
+@media screen and (max-height: 860px),
+screen and (max-width: 1500px) {
+  #mesh {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 1160px) {
+  .sections {
+    display: none;
+  }
+
+  #sections-button {
+    display: block !important;
+  }
+}
+
+@media screen and (max-width: 540px) {
+  #logo {
+    font-size: 2.2rem;
+  }
+
+  .links {
+    display: none;
+  }
+
+  header,
+  footer {
+    padding: 0 1rem;
+  }
 }
Author	SHA1	Message	Date
eline	f089d62e63	Merge pull request 'css' (#5 ) from hugo/decentrala-website-static-new:css into master Reviewed-on: #5	2023-08-04 14:19:43 +00:00
Eline	c62983d977	Removed boilerplate blogs	2023-08-04 16:18:11 +02:00
il	150223ae58	atom feed generator	2023-08-04 02:17:14 +02:00
Hugo	814a384295	feat: theme button	2023-08-03 20:38:04 +02:00
Hugo	d4026fd5b3	small fixes	2023-08-03 19:39:10 +02:00
Eline	775245c3b4	Fixed poster encoding.	2023-08-03 19:34:30 +02:00
eline	8b55a17040	Merge pull request 'fix: use proper letters' (#2 ) from hugo/decentrala-website-static-new:letters into master	2023-08-03 17:26:21 +00:00
Hugo	0a8f3167a6	fix: use proper letters	2023-08-03 19:13:33 +02:00
eline	c53438e2cc	Merge pull request 'Implemented poster script' (#1 ) from hugo/decentrala-website-static-new:poster into master Reviewed-on: #1	2023-08-03 16:54:19 +00:00
Luka Ivanovic	c890e98279	So it begins..	2023-08-03 18:41:30 +02:00
Hugo	f05390f16c	Implemented poster script	2023-07-22 22:10:38 +02:00
eline	9fb8eac7c7	Some new icons for tests	2023-05-07 02:52:46 +02:00
eline	cfcdf34129	New arrows :)	2023-05-07 02:40:55 +02:00
eline	c6574fb93d	Added a menu for smaller screens (still not finished tho). Also, more fixes.	2023-05-06 23:04:59 +02:00
eline	eaac7bdd73	Prep for responsive version	2023-05-06 19:31:43 +02:00
eline	e1ba576b8b	Minor fix with style	2023-05-06 18:42:04 +02:00
eline	dfc99cc981	Minified svg's and made mesh untargetable	2023-05-06 18:39:48 +02:00
eline	bdddddb342	Implemented theme switcher (light/dark)	2023-05-06 18:13:12 +02:00
eline	1e0dbade3b	setting things up for themes switcher	2023-05-05 22:16:03 +02:00