Show current path in navbar

themes/maik-blog/assets/js/nav.js

@@ -1,38 +1,80 @@
 window.addEventListener("load", () => {
-  const terminal = document.getElementById('nav-terminal')
+  const terminalCommand = document.getElementById("terminal-command")
+  const terminalInput = document.getElementById("terminal-input")
 
-  const keyDown = (e) => {
-    if (e.keyCode === 13) {
-      if (document.activeElement !== document.body) return
-      if (terminal.textContent.length === 0) return
+  const onSubmit = () => {
+    if (document.activeElement !== document.body) return
+    if (terminalInput.textContent.length === 0) return
 
-      if (terminal.textContent.includes("~")) terminal.textContent = ""
+    terminalCommand.click()
+  }
 
-      window.location.href = window.location.origin + "/" + terminal.textContent
-      return
-    }
+  const handleKey = (e) => {
+    if (e.keyCode === 13) return onSubmit()
 
     if (e.keyCode === 8) {
-      terminal.textContent = terminal.textContent.slice(0, -1)
+      terminalInput.textContent = terminalInput.textContent.slice(0, -1)
       return
     }
 
     if (e.keyCode === 192) {
-      if (terminal.textContent.length !== 0) return
+      if (terminalInput.textContent.length !== 0) return
 
-      terminal.textContent += "~"
+      terminalInput.textContent += "~"
+      return
+    }
+
+    if (e.keyCode === 189) {
+      terminalInput.textContent += "-"
       return
     }
 
     if (e.keyCode === 191) {
-      terminal.textContent += "/"
+      let lastChar = terminalInput.textContent.slice(-1)
+      if (lastChar === "/") return
+
+      terminalInput.textContent += "/"
       return
     }
 
-    if (e.keyCode < 65 || e.keyCode > 90) return
+    if (e.keyCode === 190) {
+      let lastChar = terminalInput.textContent.slice(-1)
+      if (terminalInput.textContent.length > 0 && lastChar !== "/" && lastChar !== ".") return
 
-    terminal.textContent += e.key.toLowerCase()
+      if (terminalInput.textContent.length >= 2 && lastChar === "." && terminalInput.textContent.slice(-2)[0] === ".") return
+
+      terminalInput.textContent += "."
+      return
+    }
+
+    if (e.keyCode >= 65 && e.keyCode <= 90) {
+      let lastChar = terminalInput.textContent.slice(-1)
+      if (lastChar === "." || lastChar === "~") return
+
+      terminalInput.textContent += e.key.toLowerCase()
+    }
   }
 
-  document.addEventListener('keydown', keyDown)
+  const updateCommandHref = () => {
+    let href = terminalInput.textContent
+
+    if (href.includes("~")) href = "/" + href.substring(1)
+
+    if (href.length === 0)
+      href = window.location.origin
+    else if (href[0] === "/")
+      href = window.location.origin + href
+    else
+      href = window.location.href + href
+
+    terminalCommand.href = href
+  }
+
+  const keyDown = (e) => {
+    handleKey(e)
+    updateCommandHref()
+  }
+
+  // terminalCommand.addEventListener("click", onSubmit)
+  document.addEventListener("keydown", keyDown)
 })

themes/maik-blog/assets/scss/_logo.scss

@@ -5,6 +5,7 @@
   font-weight: bold;
   font-display: auto;
   font-family: monospace, monospace;
+  white-space: pre;
 
   img {
     height: 44px;
@@ -12,6 +13,7 @@
 
   &__mark {
     margin-right: 5px;
+    white-space: nowrap;
   }
 
   &__text {