Added : homeSubtitlePrinter

assets/scss/_predefined.scss

@@ -6,6 +6,7 @@ $light-grey: #494f5c;
 $dark-grey: #3B3E48;
 $highlight-grey: #7d828a;
 $midnightblue: #2c3e50;
+$typewriter: hsl(172, 100%, 36%);
 
 // Fonts
 //

assets/scss/style.scss

@@ -903,4 +903,35 @@ a.footnote-ref {
   #mobile-menu {
     right: 1.2em;
   }
+  #home-subtitle {
+    font-size: 0.5em;
+  }
 }
+
+// If homeSubtitlePrinter is true
+{{ if .Site.Params.homeSubtitlePrinter }}
+  #home-subtitle{
+    overflow: hidden; /* Ensures the content is not revealed until the animation */
+    border-right: .5em solid $typewriter; /* The typwriter cursor */
+    white-space: nowrap; /* Keeps the content on a single line */
+    margin: 0 auto; /* Gives that scrolling effect as the typing happens */
+    // letter-spacing: .100em; /* Adjust as needed */
+
+      animation: 
+        typing 5s steps({{ strings.RuneCount .Site.Params.homeSubtitle }}, end),
+        blink-caret .6s step-end infinite;
+
+  }
+
+  /* The typing effect */
+  @keyframes typing {
+    from { width: 0 }
+    to { width: 100% }
+  }
+
+  /* The typewriter cursor effect */
+  @keyframes blink-caret {
+    from, to { border-color: transparent }
+    50% { border-color: $typewriter}
+  }
+{{ end }}