fix: use client-side language detection for 404 navigation links

Added window.currentLang detection based on request URL path to correctly
route 404 page navigation links for Italian and English versions. Created
notFoundNav() Alpine component to dynamically compute language-aware links
based on detected language.

Co-Authored-By: Claude Haiku 4.5 <redacted>

diff --git a/themes/danix-xyz-hacker/assets/css/main.min.css b/themes/danix-xyz-hacker/assets/css/main.min.css
index 677ea1e56c0c1441755c79790e5c4958d8075f45..e92eb90343de6bde47e70dfa5261bbe531993479 100644 (file)
--- a/themes/danix-xyz-hacker/assets/css/main.min.css
+++ b/themes/danix-xyz-hacker/assets/css/main.min.css
@@ -2278,10 +2278,6 @@ article.border.border-border\/30.rounded-lg.card.group.bg-bg {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
-.filter {
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
 .backdrop-blur {
   --tw-backdrop-blur: blur(8px);
   -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);

diff --git a/themes/danix-xyz-hacker/assets/js/not-found-page.js b/themes/danix-xyz-hacker/assets/js/not-found-page.js
index 6ec8895ed0ea3f023e9fb48814d578bb23d2185a..78e35911352e3aa55601c41b58b9061f6ce54e2d 100644 (file)
--- a/themes/danix-xyz-hacker/assets/js/not-found-page.js
+++ b/themes/danix-xyz-hacker/assets/js/not-found-page.js
@@ -31,5 +31,17 @@ document.addEventListener('alpine:init', () => {
     }
   }));
 
+  Alpine.data('notFoundNav', () => ({
+    get homeLink() {
+      return window.currentLang === 'it' ? '/it/' : '/';
+    },
+    get articlesLink() {
+      return window.currentLang === 'it' ? '/it/articles/' : '/articles/';
+    },
+    get contactLink() {
+      return window.currentLang === 'it' ? '/it/is/here/' : '/is/here/';
+    }
+  }));
+
   console.log('notFoundPage Alpine component registered');
 });

diff --git a/themes/danix-xyz-hacker/layouts/404.html b/themes/danix-xyz-hacker/layouts/404.html
index efae232a9187bfdbfb7d3ec6014a94f75106a9fa..0fb6c9a6ed213a17c2bb736da615b3eb4180b708 100644 (file)
--- a/themes/danix-xyz-hacker/layouts/404.html
+++ b/themes/danix-xyz-hacker/layouts/404.html
@@ -1,5 +1,10 @@
 {{ define "main" }}
 
+<!-- Detect language from current URL -->
+<script>
+window.currentLang = window.location.pathname.startsWith('/it/') ? 'it' : 'en';
+</script>
+
 <!-- Pass articles data to JavaScript for Alpine.js -->
 <script>
 window.articlesData = [
@@ -76,22 +81,14 @@ window.articlesData = [
     </div>
 
     <!-- Navigation Links -->
-    <div class="space-y-4 flex flex-col items-center mb-12">
-      {{ $lang := "en" }}
-      {{ if in .Permalink "/it/" }}
-        {{ $lang = "it" }}
-      {{ end }}
-      {{ $prefix := "" }}
-      {{ if eq $lang "it" }}
-        {{ $prefix = "/it" }}
-      {{ end }}
-      <a href="{{ $prefix }}/" class="btn btn-primary">
+    <div class="space-y-4 flex flex-col items-center mb-12" x-data="notFoundNav()">
+      <a :href="homeLink" class="btn btn-primary">
         {{ i18n "goHome" }}
       </a>
-      <a href="{{ $prefix }}/articles/" class="btn btn-secondary">
+      <a :href="articlesLink" class="btn btn-secondary">
         {{ i18n "browseArticles" }}
       </a>
-      <a href="{{ $prefix }}/is/here/" class="btn btn-outline">
+      <a :href="contactLink" class="btn btn-outline">
         {{ i18n "contactSupport" }}
       </a>
     </div>