feat: Update Duckquill

content/blog/chatgpt-and-file-renaming/index.md

@@ -10,7 +10,7 @@ toc = true
 
 ## Backstory
 
-While writing and the [previous post](/posts/migration-from-github-to-codeberg) I ran into an "issue" that post file names had spaces in them and special characters like `:`, I could rename them manually but why not use script to do this automatically?
+While writing and the [previous post](@/blog/migration-from-github-to-codeberg/index.md) I ran into an "issue" that post file names had spaces in them and special characters like `:`, I could rename them manually but why not use script to do this automatically?
 
 ## The ~~programming~~ asking
 

content/blog/website-rewrite-in-zola/index.md

@@ -15,7 +15,13 @@ It's been around 3 months since the last post, all this time I was procrastinati
 
 ## The Rewrite
 
-The main change is that I moved away from Jekyll to Zola, there were a few reasons for this, like speed, ruby-dependency hell and the need of third-party plugins.
+The first rewrite attempt happend pretty much immediately after publishing the [previous devlog](@/blog/site-and-blog-devlog/index.md), I thought using Hugo was a good idea, but I was horribly wrong. I lost my sanity on the day 3, while having no progress made. I asked some people about using Hugo and their reaction were something like "Oh God, use anything but Hugo, you will regret using it", and it was true.
+
+I then tried Zola which at first seemed like a worse Jekyll, but actually it were Jekyll 2.0.
+
+B-but why move from Jekyll in the first place?
+
+Well... there were a few reasons for this, like speed, ruby-dependency hell, broken internal linking and the need of third-party plugins for basic functionality, but the last straw was...
 
 ### Jekyll Issues
 
@@ -50,7 +56,7 @@ Almost every single style and template were redone, resulting in a much nicer lo
 - CRT style is now used for ASCII, replacing the old "gradient from opaque to transparent"
 - Header 1 style is now different from other headers; it's big, **bold**, and has purple dot at the end
 - Code blocks now use Solarized syntax highlighting theme instead of GitHub one, it changes from light to dark variant depending on current color scheme
-- JetBrains Mono font is now used for code blocks instead of system one
+- Source Code Pro font is now used for code blocks instead of system one
 - New, animated 404 image
 - Tags are now displayed alongside the date, both in the post list and in the post itself
 - Posts now can be filtered by a tag, so e.g you can only filter posts containing the `Devlog` tag
@@ -62,4 +68,10 @@ About Duckquill, it transformed from a Jekyll template to a proper Zola theme, w
 
 Duckquill powers this website and can be used by anyone, although I use some additional styles specific to this website.
 
-Duckquill is listed on [Zola themes page](https://www.getzola.org/themes/duckquill/), of which I'm quite proud of ^^
+Duckquill is listed on [Zola themes page](https://www.getzola.org/themes/duckquill/), of which I'm quite proud of ^^
+
+## Conclusion
+
+It's been an interesting journey for sure; trying using Hugo, losing sanity, regretting life choices, learning new SSG, burning out, coming back, learning Sass, HTML and Tera (a bit like Liquid), Procrastinating, coming back, rewriting half of the styles, and finally submitting the theme to Zola themes website (not exactly in this order). All this, in my opinion, were worth it.
+
+My plan now is to write a few shorter posts and not focus on the website much anymore, since it's a wormhole I can't leave.

sass/custom.scss

@@ -3,14 +3,17 @@
 $primary-color: #c061cb;
 $primary-color-alpha: color.scale($primary-color, $alpha: -80%);
 
-$bg-color-l: color.mix($primary-color, rgb(250, 250, 250), 10%);
-$bg-color-d: color.mix($primary-color, rgb(11, 11, 11), 5%);
+$bg-color-l: color.scale($primary-color, $lightness: 80%);
+$bg-color-d: color.scale($primary-color, $lightness: -90%, $saturation: -50%);
 
 $crt-bg: radial-gradient(
   color.scale($primary-color, $lightness: -80%),
   color.scale($primary-color, $lightness: -90%)
 );
 
+$nav-bg-l: color.scale($bg-color-l, $alpha: -20%, $lightness: 50%);
+$nav-bg-d: color.scale($bg-color-d, $alpha: -20%, $lightness: 5%, $saturation: -50%);
+
 $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
   0 2px 6px 2px color.scale($primary-color, $alpha: -95%),
   0 4px 24px 4px color.scale($primary-color, $alpha: -90%);
@@ -18,6 +21,7 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
 :root {
   --bg-color: #{$bg-color-l};
   --crt-bg: #{$crt-bg};
+  --nav-bg: #{$nav-bg-l};
   --primary-color-alpha: #{$primary-color-alpha};
   --primary-color: #{$primary-color};
   --glow: #{$glow};
@@ -26,6 +30,7 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
 @media (prefers-color-scheme: dark) {
   :root {
     --bg-color: #{$bg-color-d};
+    --nav-bg: #{$nav-bg-d};
   }
 }
 
@@ -66,10 +71,11 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
   }
 
   a {
-    padding: 0.75rem;
-    border-radius: var(--rounded-corner);
     background-color: transparent;
-    transition: all 0.35s cubic-bezier(0.17, 0.89, 0.32, 1.28);
+    border-radius: var(--rounded-corner);
+    padding: 0.75rem;
+    text-decoration: none;
+    transition: var(--transition-bezier);
   }
 
   a:hover {
@@ -81,14 +87,20 @@ $glow: 0 0 0 1px color.scale($primary-color, $alpha: -95%),
 
 section#original-icons {
   background-color: rgba(98, 160, 234, 0.5);
+  background-image: radial-gradient(circle, var(--fg05) 1px, rgba(0,0,0,0) 1px);
+  background-size: 1rem 1rem;
 }
 
 section#redrawn-icons {
   background-color: rgba(87, 227, 137, 0.5);
+  background-image: radial-gradient(circle, var(--fg05) 1px, rgba(0,0,0,0) 1px);
+  background-size: 1rem 1rem;
 }
 
 section#wallpapers {
   background-color: rgba(255, 163, 72, 0.5);
+  background-image: radial-gradient(circle, var(--fg05) 1px, rgba(0,0,0,0) 1px);
+  background-size: 1rem 1rem;
 
   img {
     border-radius: var(--rounded-corner);

templates/design.html

@@ -11,7 +11,7 @@
     </div>
     <section id="original-icons">
       <div class="container">
-        <h1>Original Icons</h1>
+        <h2>Original Icons</h2>
         <p>
           Custom icons with original idea made for projects without prior ones
           or with different ones.
@@ -81,7 +81,7 @@
     </section>
     <section id="redrawn-icons">
       <div class="container">
-        <h1>Redrawn Icons</h1>
+        <h2>Redrawn Icons</h2>
         <p>
           Tweaked icons made for projects with icon and idea already present.
         </p>
@@ -135,7 +135,7 @@
     </section>
     <section id="wallpapers">
       <div class="container">
-        <h1>Wallpapers</h1>
+        <h2>Wallpapers</h2>
         <p>Wallpapers that I have made for myself, that you can use too.</p>
         <br />
         <div class="media-grid">

themes/duckquill

@@ -1 +1 @@
-Subproject commit 0ce950d0b31038020cbd2bad8ea923ebdcbe3037
+Subproject commit 9202b7fe920fbe32a0ee3afd7c220d2f5af34d2a