diff --git a/new-site/config.toml b/new-site/config.toml
index 9dff5b56..ab0f70ec 100644
--- a/new-site/config.toml
+++ b/new-site/config.toml
@@ -19,4 +19,4 @@ pluralizelisttitles = false
     endLevel = 4
     startLevel = 2
   [markup.highlight]
-    style = 'vulcan'
\ No newline at end of file
+    style = 'doom-one'
\ No newline at end of file
diff --git a/new-site/public/blog/index.xml b/new-site/public/blog/index.xml
index ac6e2d7e..6581dd67 100644
--- a/new-site/public/blog/index.xml
+++ b/new-site/public/blog/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/blog/meta-description-in-hugo/index.html b/new-site/public/blog/meta-description-in-hugo/index.html
index d5a923d7..668ab417 100644
--- a/new-site/public/blog/meta-description-in-hugo/index.html
+++ b/new-site/public/blog/meta-description-in-hugo/index.html
@@ -27,30 +27,30 @@
 <li>Add the following line inside it</li>
 </ol>
 <p>For config.toml</p>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-toml" data-lang="toml"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#56b6c2">[</span><span style="color:#c9c9c9">params</span><span style="color:#56b6c2">]</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">  </span><span style="color:#c9c9c9">description</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">=</span><span style="color:#c9c9c9"> </span><span style="color:#82cc6a">&#34;The global meta description of your website&#34;</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>For config.yaml</p>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#bc74c4">params</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">  </span><span style="color:#bc74c4">description</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#c9c9c9">The global meta description of your website</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>It won&rsquo;t work just yet because you have to update the <code>baseof.html</code> file.</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-toml" data-lang="toml"><span style="display:flex;"><span>[<span style="color:#c1abea">params</span>]
+</span></span><span style="display:flex;"><span>  <span style="color:#c1abea">description</span> = <span style="color:#63c381">&#34;The global meta description of your website&#34;</span>
+</span></span></code></pre></div><p>For config.yaml</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;"><span><span style="color:#e06c75">params</span>:
+</span></span><span style="display:flex;"><span>  <span style="color:#e06c75">description</span>: <span style="color:#98c379">The global meta description of your website</span>
+</span></span></code></pre></div><p>It won&rsquo;t work just yet because you have to update the <code>baseof.html</code> file.</p>
 <h3 id="updating-the-baseofhtml-file">Updating the baseof.html file <a class="anchor" href="#updating-the-baseofhtml-file">
     <span class="spanForHeader">#</span>
 </a></h3><ol>
 <li>Locate baseof.html</li>
 <li>Add or change the meta description line with the following</li>
 </ol>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#56b6c2">&lt;</span><span style="color:#bc74c4">meta</span><span style="color:#c9c9c9"> </span><span style="color:#bc74c4">name</span><span style="color:#bc74c4">=</span><span style="color:#82cc6a">&#34;description&#34;</span><span style="color:#c9c9c9"> </span><span style="color:#bc74c4">content</span><span style="color:#bc74c4">=</span><span style="color:#82cc6a">&#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&#34;</span><span style="color:#56b6c2">/&gt;</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>And now if you start your Hugo server locally with <code>hugo serve --noHTTPCache</code> and you right click on your page -&gt; View Page Source -&gt; Search for the meta description tag. It should match what you left in the config file.</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span>&lt;<span style="color:#e06c75">meta</span> <span style="color:#b3d23c">name</span><span style="color:#c7bf54">=</span><span style="color:#98c379">&#34;description&#34;</span> <span style="color:#b3d23c">content</span><span style="color:#c7bf54">=</span><span style="color:#98c379">&#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&#34;</span>/&gt;
+</span></span></code></pre></div><p>And now if you start your Hugo server locally with <code>hugo serve --noHTTPCache</code> and you right click on your page -&gt; View Page Source -&gt; Search for the meta description tag. It should match what you left in the config file.</p>
 <h3 id="replacing-the-global-description-with-a-custom-one">Replacing the global description with a custom one <a class="anchor" href="#replacing-the-global-description-with-a-custom-one">
     <span class="spanForHeader">#</span>
 </a></h3><ol>
 <li>Have a markdown file ready</li>
 <li>In the preamble, add</li>
 </ol>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">---</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9"></span><span style="color:#bc74c4">description</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#82cc6a">&#34;Your custom description for this page&#34;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9"></span><span style="color:#c9c9c9">---</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;"><span><span style="color:#76a9f9">---</span>
+</span></span><span style="display:flex;"><span><span style="color:#e06c75">description</span>: <span style="color:#63c381">&#34;Your custom description for this page&#34;</span>
+</span></span><span style="display:flex;"><span><span style="color:#76a9f9">---</span>
+</span></span></code></pre></div><p>Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!</p>
 
 
 <div id="nextprev">
diff --git a/new-site/public/blog/pluralization-issues/index.html b/new-site/public/blog/pluralization-issues/index.html
index cdb4674b..ece5f617 100644
--- a/new-site/public/blog/pluralization-issues/index.html
+++ b/new-site/public/blog/pluralization-issues/index.html
@@ -24,8 +24,8 @@ pluralizelisttitles = false "/>
 </a></h3><p>So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs</p>
 <p>You can fix this in config.toml with the following line</p>
 <blockquote>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-toml" data-lang="toml"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">pluralizelisttitles</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">=</span><span style="color:#c9c9c9"> </span><span style="color:#cf5967;background-color:#43454f">false</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div></blockquote>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-toml" data-lang="toml"><span style="display:flex;"><span><span style="color:#c1abea">pluralizelisttitles</span> = <span style="color:#b756ff;font-weight:bold">false</span>
+</span></span></code></pre></div></blockquote>
 
 
 <div id="nextprev">
diff --git a/new-site/public/categories/index.xml b/new-site/public/categories/index.xml
index 7c8388c2..841516b1 100644
--- a/new-site/public/categories/index.xml
+++ b/new-site/public/categories/index.xml
@@ -18,28 +18,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2490,30 +2490,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4730,8 +4730,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/index.xml b/new-site/public/index.xml
index 0d1a3e1d..8c2660c0 100644
--- a/new-site/public/index.xml
+++ b/new-site/public/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/library/hackbook/index.xml b/new-site/public/library/hackbook/index.xml
index ad86733e..5237ee74 100644
--- a/new-site/public/library/hackbook/index.xml
+++ b/new-site/public/library/hackbook/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/library/index.xml b/new-site/public/library/index.xml
index f48d8994..5698a11c 100644
--- a/new-site/public/library/index.xml
+++ b/new-site/public/library/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/library/ted-kaczynski/index.xml b/new-site/public/library/ted-kaczynski/index.xml
index c670e9af..ec2ca72a 100644
--- a/new-site/public/library/ted-kaczynski/index.xml
+++ b/new-site/public/library/ted-kaczynski/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/style.css b/new-site/public/style.css
index 51fc0b98..ae356eee 100644
--- a/new-site/public/style.css
+++ b/new-site/public/style.css
@@ -142,7 +142,7 @@ h6 {
 }
 
 pre {
-	background: #111222;
+	background: #282c34;
 	color: white;
 	border: 1px solid var(--strong);
 	border-radius: 20px;
diff --git a/new-site/public/tags/blog/index.xml b/new-site/public/tags/blog/index.xml
index 0ff81f93..9b72aa5d 100644
--- a/new-site/public/tags/blog/index.xml
+++ b/new-site/public/tags/blog/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/tags/hackbook/index.xml b/new-site/public/tags/hackbook/index.xml
index 1406af72..723835cf 100644
--- a/new-site/public/tags/hackbook/index.xml
+++ b/new-site/public/tags/hackbook/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/tags/index.xml b/new-site/public/tags/index.xml
index ef2a0660..eb7e66d7 100644
--- a/new-site/public/tags/index.xml
+++ b/new-site/public/tags/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/tags/library/index.xml b/new-site/public/tags/library/index.xml
index 65c4d3e7..d977c25e 100644
--- a/new-site/public/tags/library/index.xml
+++ b/new-site/public/tags/library/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/tags/ted-kaczynski/index.xml b/new-site/public/tags/ted-kaczynski/index.xml
index 921356f3..ab5e75f9 100644
--- a/new-site/public/tags/ted-kaczynski/index.xml
+++ b/new-site/public/tags/ted-kaczynski/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/tags/updates/index.xml b/new-site/public/tags/updates/index.xml
index 4ee8174e..efe126fb 100644
--- a/new-site/public/tags/updates/index.xml
+++ b/new-site/public/tags/updates/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/updates/index.xml b/new-site/public/updates/index.xml
index bdfbb8b1..a5ee4b21 100644
--- a/new-site/public/updates/index.xml
+++ b/new-site/public/updates/index.xml
@@ -19,28 +19,28 @@
 		<description>&lt;p&gt;I actually updated the css once more.&lt;/p&gt;
 &lt;p&gt;If you&amp;rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.&lt;/p&gt;
 &lt;p&gt;I did this by setting the light theme to be by default for more readability:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#fafafa&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#2f343f&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#4084d6&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;93&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;99&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;@&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;media&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;)&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#ecbe7b&#34;&gt;root&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#141414&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;232&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;228&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--links&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;#5da0f2&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;		&lt;/span&gt;&lt;span style=&#34;color:#bc74c4;font-style:italic&#34;&gt;--muted_text&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;rgb&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;179&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;182&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;,&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;186&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;body&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;{&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;font-family&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;sans-serif&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;background&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;bg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;	&lt;/span&gt;&lt;span style=&#34;color:#7fbaf5&#34;&gt;color&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#57c7ff&#34;&gt;var&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;fg&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;);&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;}&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#fafafa&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#2f343f&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#4084d6&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;93&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;99&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&amp;rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&amp;rsquo;m wrong.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;@&lt;span style=&#34;color:#c678dd&#34;&gt;media&lt;/span&gt; &lt;span style=&#34;color:#c7bf54&#34;&gt;(&lt;/span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;prefers-color-scheme&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;:&lt;/span&gt; &lt;span style=&#34;color:#e06c75&#34;&gt;dark&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;)&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	:&lt;span style=&#34;color:#e5c07b&#34;&gt;root&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--bg&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#141414&lt;/span&gt;;	
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--fg&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;232&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;228&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--links&lt;/span&gt;: &lt;span style=&#34;color:#d19a66&#34;&gt;#5da0f2&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;		&lt;span style=&#34;color:#dcaeea&#34;&gt;--muted_text&lt;/span&gt;: &lt;span style=&#34;color:#ef8383&#34;&gt;rgb&lt;/span&gt;(&lt;span style=&#34;color:#d19a66&#34;&gt;179&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;182&lt;/span&gt;, &lt;span style=&#34;color:#d19a66&#34;&gt;186&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	}
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And this is how CSS variables are used:&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-css&#34; data-lang=&#34;css&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;body&lt;/span&gt; {
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;font-family&lt;/span&gt;: &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;sans-serif&lt;/span&gt;;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;background&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;bg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;	&lt;span style=&#34;color:#c678dd&#34;&gt;color&lt;/span&gt;: &lt;span style=&#34;color:#00b1f7&#34;&gt;var&lt;/span&gt;(&lt;span style=&#34;color:#c7bf54&#34;&gt;--&lt;/span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;fg&lt;/span&gt;);
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;}
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;</description>
 	</item>
 	
 	<item>
@@ -2491,30 +2491,30 @@ List of Works Cited&lt;/p&gt;
 &lt;li&gt;Add the following line inside it&lt;/li&gt;
 &lt;/ol&gt;
 &lt;p&gt;For config.toml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;[&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;]&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;params&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;  &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;The global meta description of your website&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;[&lt;span style=&#34;color:#c1abea&#34;&gt;params&lt;/span&gt;]
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#c1abea&#34;&gt;description&lt;/span&gt; = &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;The global meta description of your website&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;For config.yaml&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;params&lt;/span&gt;:
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;  &lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#98c379&#34;&gt;The global meta description of your website&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;It won&amp;rsquo;t work just yet because you have to update the &lt;code&gt;baseof.html&lt;/code&gt; file.&lt;/p&gt;
 &lt;h3 id=&#34;updating-the-baseofhtml-file&#34;&gt;Updating the baseof.html file &lt;a class=&#34;anchor&#34; href=&#34;#updating-the-baseofhtml-file&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Locate baseof.html&lt;/li&gt;
 &lt;li&gt;Add or change the meta description line with the following&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;meta&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&amp;lt;&lt;span style=&#34;color:#e06c75&#34;&gt;meta&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;name&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;description&amp;#34;&lt;/span&gt; &lt;span style=&#34;color:#b3d23c&#34;&gt;content&lt;/span&gt;&lt;span style=&#34;color:#c7bf54&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#98c379&#34;&gt;&amp;#34;{{ if .Page.Params.description }}{{ .Page.Params.description }}{{ else if .Summary}}{{ .Summary }}{{else}}{{ .Site.Params.description}}{{ end }}&amp;#34;&lt;/span&gt;/&amp;gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;And now if you start your Hugo server locally with &lt;code&gt;hugo serve --noHTTPCache&lt;/code&gt; and you right click on your page -&amp;gt; View Page Source -&amp;gt; Search for the meta description tag. It should match what you left in the config file.&lt;/p&gt;
 &lt;h3 id=&#34;replacing-the-global-description-with-a-custom-one&#34;&gt;Replacing the global description with a custom one &lt;a class=&#34;anchor&#34; href=&#34;#replacing-the-global-description-with-a-custom-one&#34;&gt;
     &lt;span class=&#34;spanForHeader&#34;&gt;#&lt;/span&gt;
 &lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
 &lt;li&gt;Have a markdown file ready&lt;/li&gt;
 &lt;li&gt;In the preamble, add&lt;/li&gt;
 &lt;/ol&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#bc74c4&#34;&gt;description&lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;:&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#82cc6a&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;---&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-yaml&#34; data-lang=&#34;yaml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#e06c75&#34;&gt;description&lt;/span&gt;: &lt;span style=&#34;color:#63c381&#34;&gt;&amp;#34;Your custom description for this page&amp;#34;&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#76a9f9&#34;&gt;---&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;Following these steps would guarantee that you have a meta description for everypage with the ability for creating a custom one whenever you need it!&lt;/p&gt;
 </description>
 	</item>
 	
@@ -4731,8 +4731,8 @@ formed does not list Internet pornography as one of the addictions that it provi
 &lt;/a&gt;&lt;/h3&gt;&lt;p&gt;So I wanted to make a quick entry, see how it looks like and I stumbled upon this issue of hugo pluralzing Blog into Blogs&lt;/p&gt;
 &lt;p&gt;You can fix this in config.toml with the following line&lt;/p&gt;
 &lt;blockquote&gt;
-&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;pluralizelisttitles&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#56b6c2&#34;&gt;=&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt; &lt;/span&gt;&lt;span style=&#34;color:#cf5967;background-color:#43454f&#34;&gt;false&lt;/span&gt;&lt;span style=&#34;color:#c9c9c9&#34;&gt;
-&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
+&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; style=&#34;color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;&#34;&gt;&lt;code class=&#34;language-toml&#34; data-lang=&#34;toml&#34;&gt;&lt;span style=&#34;display:flex;&#34;&gt;&lt;span&gt;&lt;span style=&#34;color:#c1abea&#34;&gt;pluralizelisttitles&lt;/span&gt; = &lt;span style=&#34;color:#b756ff;font-weight:bold&#34;&gt;false&lt;/span&gt;
+&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/blockquote&gt;
 </description>
 	</item>
 	
diff --git a/new-site/public/updates/updated-the-css-again/index.html b/new-site/public/updates/updated-the-css-again/index.html
index f55fdf99..676ec885 100644
--- a/new-site/public/updates/updated-the-css-again/index.html
+++ b/new-site/public/updates/updated-the-css-again/index.html
@@ -23,28 +23,28 @@ I did this by setting the light theme to be by default for more readability:
 <p>I actually updated the css once more.</p>
 <p>If you&rsquo;re using a dark theme in your browser, the website will follow suit and change to darker colors.</p>
 <p>I did this by setting the light theme to be by default for more readability:</p>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#56b6c2">:</span><span style="color:#ecbe7b">root</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">{</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#bc74c4;font-style:italic">--bg</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">#fafafa</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#bc74c4;font-style:italic">--fg</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">#2f343f</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#bc74c4;font-style:italic">--links</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">#4084d6</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#bc74c4;font-style:italic">--muted_text</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#7fbaf5">rgb</span><span style="color:#56b6c2">(</span><span style="color:#56b6c2">93</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">93</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">99</span><span style="color:#56b6c2">);</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9"></span><span style="color:#56b6c2">}</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#56b6c2">@</span><span style="color:#7fbaf5">media</span><span style="color:#c9c9c9"> </span><span style="color:#bc74c4">(</span><span style="color:#bc74c4">prefers-color-scheme</span><span style="color:#bc74c4">:</span><span style="color:#c9c9c9"> </span><span style="color:#bc74c4">dark</span><span style="color:#bc74c4">)</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">{</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#56b6c2">:</span><span style="color:#ecbe7b">root</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">{</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">		</span><span style="color:#bc74c4;font-style:italic">--bg</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">#141414</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">	
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">		</span><span style="color:#bc74c4;font-style:italic">--fg</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#7fbaf5">rgb</span><span style="color:#56b6c2">(</span><span style="color:#56b6c2">232</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">228</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">228</span><span style="color:#56b6c2">);</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">		</span><span style="color:#bc74c4;font-style:italic">--links</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">#5da0f2</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">		</span><span style="color:#bc74c4;font-style:italic">--muted_text</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#7fbaf5">rgb</span><span style="color:#56b6c2">(</span><span style="color:#56b6c2">179</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">182</span><span style="color:#56b6c2">,</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">186</span><span style="color:#56b6c2">);</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#56b6c2">}</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9"></span><span style="color:#56b6c2">}</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div><p>And this is how CSS variables are used:</p>
-<div class="highlight"><pre tabindex="0" style="color:#c9c9c9color: #282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#bc74c4">body</span><span style="color:#c9c9c9"> </span><span style="color:#56b6c2">{</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#7fbaf5">font-family</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#cf5967;background-color:#43454f">sans-serif</span><span style="color:#56b6c2">;</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#7fbaf5">background</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">var</span><span style="color:#56b6c2">(</span><span style="color:#bc74c4">--</span><span style="color:#c9c9c9">bg</span><span style="color:#56b6c2">);</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9">	</span><span style="color:#7fbaf5">color</span><span style="color:#56b6c2">:</span><span style="color:#c9c9c9"> </span><span style="color:#57c7ff">var</span><span style="color:#56b6c2">(</span><span style="color:#bc74c4">--</span><span style="color:#c9c9c9">fg</span><span style="color:#56b6c2">);</span><span style="color:#c9c9c9">
-</span></span></span><span style="display:flex;color:#c9c9c9"><span style="color:#c9c9c9"><span style="color:#c9c9c9"></span><span style="color:#56b6c2">}</span><span style="color:#c9c9c9">
-</span></span></span></code></pre></div>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>:<span style="color:#e5c07b">root</span> {
+</span></span><span style="display:flex;"><span>	<span style="color:#dcaeea">--bg</span>: <span style="color:#d19a66">#fafafa</span>;
+</span></span><span style="display:flex;"><span>	<span style="color:#dcaeea">--fg</span>: <span style="color:#d19a66">#2f343f</span>;
+</span></span><span style="display:flex;"><span>	<span style="color:#dcaeea">--links</span>: <span style="color:#d19a66">#4084d6</span>;
+</span></span><span style="display:flex;"><span>	<span style="color:#dcaeea">--muted_text</span>: <span style="color:#ef8383">rgb</span>(<span style="color:#d19a66">93</span>, <span style="color:#d19a66">93</span>, <span style="color:#d19a66">99</span>);
+</span></span><span style="display:flex;"><span>}
+</span></span></code></pre></div><p>and then this checks that if the user prefers a darker theme, they shall get a dark theme. Simple as that really, I didn&rsquo;t know this stuff existed, thought webshits just use java script for everything, but I guess I&rsquo;m wrong.</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span>@<span style="color:#c678dd">media</span> <span style="color:#c7bf54">(</span><span style="color:#e06c75">prefers-color-scheme</span><span style="color:#c7bf54">:</span> <span style="color:#e06c75">dark</span><span style="color:#c7bf54">)</span> {
+</span></span><span style="display:flex;"><span>	:<span style="color:#e5c07b">root</span> {
+</span></span><span style="display:flex;"><span>		<span style="color:#dcaeea">--bg</span>: <span style="color:#d19a66">#141414</span>;	
+</span></span><span style="display:flex;"><span>		<span style="color:#dcaeea">--fg</span>: <span style="color:#ef8383">rgb</span>(<span style="color:#d19a66">232</span>, <span style="color:#d19a66">228</span>, <span style="color:#d19a66">228</span>);
+</span></span><span style="display:flex;"><span>		<span style="color:#dcaeea">--links</span>: <span style="color:#d19a66">#5da0f2</span>;
+</span></span><span style="display:flex;"><span>		<span style="color:#dcaeea">--muted_text</span>: <span style="color:#ef8383">rgb</span>(<span style="color:#d19a66">179</span>, <span style="color:#d19a66">182</span>, <span style="color:#d19a66">186</span>);
+</span></span><span style="display:flex;"><span>	}
+</span></span><span style="display:flex;"><span>}
+</span></span></code></pre></div><p>And this is how CSS variables are used:</p>
+<div class="highlight"><pre tabindex="0" style="color:#b0c4de;background-color:#282c34;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-css" data-lang="css"><span style="display:flex;"><span><span style="color:#e06c75">body</span> {
+</span></span><span style="display:flex;"><span>	<span style="color:#c678dd">font-family</span>: <span style="color:#b756ff;font-weight:bold">sans-serif</span>;
+</span></span><span style="display:flex;"><span>	<span style="color:#c678dd">background</span>: <span style="color:#00b1f7">var</span>(<span style="color:#c7bf54">--</span><span style="color:#c1abea">bg</span>);
+</span></span><span style="display:flex;"><span>	<span style="color:#c678dd">color</span>: <span style="color:#00b1f7">var</span>(<span style="color:#c7bf54">--</span><span style="color:#c1abea">fg</span>);
+</span></span><span style="display:flex;"><span>}
+</span></span></code></pre></div>
 
 <div id="nextprev">
 <a href="/library/ted-kaczynski/ship-of-fools/"><div id="prevart">Previous:<br>Ship of Fools</div></a>
diff --git a/new-site/static/style.css b/new-site/static/style.css
index 51fc0b98..ae356eee 100644
--- a/new-site/static/style.css
+++ b/new-site/static/style.css
@@ -142,7 +142,7 @@ h6 {
 }
 
 pre {
-	background: #111222;
+	background: #282c34;
 	color: white;
 	border: 1px solid var(--strong);
 	border-radius: 20px;