diff options
Diffstat (limited to 'themes/danix-xyz-hacker/layouts')
| -rw-r--r-- | themes/danix-xyz-hacker/layouts/404.en.html (renamed from themes/danix-xyz-hacker/layouts/404.html) | 26 | ||||
| -rw-r--r-- | themes/danix-xyz-hacker/layouts/404.it.html | 151 |
2 files changed, 164 insertions, 13 deletions
diff --git a/themes/danix-xyz-hacker/layouts/404.html b/themes/danix-xyz-hacker/layouts/404.en.html index 6ed4892..e1fd8c5 100644 --- a/themes/danix-xyz-hacker/layouts/404.html +++ b/themes/danix-xyz-hacker/layouts/404.en.html @@ -24,21 +24,21 @@ window.articlesData = [ <!-- Error Message --> <h2 class="text-3xl md:text-4xl font-bold mb-6"> - {{ i18n "notFound" }} + Page Not Found </h2> <p class="text-lg text-text-dim mb-8"> - {{ i18n "notFoundMessage" }} + Sorry, the page you're looking for doesn't exist. Try searching or browse the articles below. </p> <!-- Search Box --> <div class="mb-12"> <form id="search-form" class="flex flex-col gap-4"> - <label for="search-input" class="sr-only">{{ i18n "searchPlaceholder" }}</label> + <label for="search-input" class="sr-only">Search articles...</label> <input id="search-input" type="text" - placeholder="{{ (i18n "searchPlaceholder") }}" + placeholder="Search articles..." class="px-4 py-3 border-2 border-border rounded focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent bg-bg text-text" @input="filterArticles($el.value)" /> @@ -54,13 +54,13 @@ window.articlesData = [ </template> </div> <div x-show="searchQuery && filteredArticles.length === 0" class="mt-4 text-text-dim"> - {{ i18n "noSearchResults" }} + No articles found matching your search. </div> </div> <!-- Recent Articles Section --> <div class="mb-12"> - <h3 class="text-2xl font-bold mb-6">{{ i18n "recentArticles" }}</h3> + <h3 class="text-2xl font-bold mb-6">Recent Articles</h3> <div class="space-y-4"> {{ range first 5 (where .Site.RegularPages "Section" "articles") }} <div class="p-4 border-l-4 border-accent bg-bg/50 hover:bg-bg/70 transition-colors"> @@ -78,13 +78,13 @@ window.articlesData = [ <!-- Navigation Links --> <div class="space-y-4 flex flex-col items-center mb-12"> <a href="/" class="btn btn-primary"> - {{ i18n "goHome" }} + Go Home </a> <a href="/articles/" class="btn btn-secondary"> - {{ i18n "browseArticles" }} + Browse Articles </a> <a href="/is/here/" class="btn btn-outline"> - {{ i18n "contactSupport" }} + Get in Touch </a> </div> @@ -95,7 +95,7 @@ window.articlesData = [ @click="toggleEasterEgg()" class="text-sm text-text-dim hover:text-accent transition-colors underline" > - {{ i18n "followWhiteRabbit" }} + Follow the white rabbit... </button> </div> @@ -114,7 +114,7 @@ window.articlesData = [ <!-- Modal Content --> <div class="relative bg-bg border-2 border-accent p-8 rounded-lg shadow-xl max-w-md mx-4"> - <h2 class="text-2xl font-bold mb-6 text-accent">{{ i18n "easterEggTitle" }}</h2> + <h2 class="text-2xl font-bold mb-6 text-accent">Choose Your Path</h2> <div class="space-y-4"> <button @@ -122,7 +122,7 @@ window.articlesData = [ @click="showEasterEgg = false; window.location.href = '{{ .Site.BaseURL }}'" class="w-full btn btn-primary" > - 💊 {{ i18n "bluePill" }} + 💊 Stay Here </button> <button @@ -130,7 +130,7 @@ window.articlesData = [ @click="goToRandomArticle()" class="w-full btn btn-secondary" > - 🐰 {{ i18n "redPill" }} + 🐰 Show Me More </button> </div> diff --git a/themes/danix-xyz-hacker/layouts/404.it.html b/themes/danix-xyz-hacker/layouts/404.it.html new file mode 100644 index 0000000..3b4ea2e --- /dev/null +++ b/themes/danix-xyz-hacker/layouts/404.it.html @@ -0,0 +1,151 @@ +{{ define "main" }} + +<!-- Pass articles data to JavaScript for Alpine.js --> +<script> +window.articlesData = [ + {{ range (where .Site.RegularPages "Section" "articles") }} + { + title: '{{ .Title | safeJS }}', + url: '{{ .Permalink }}', + date: '{{ .Date.Format "Jan 02, 2006" }}', + content: '{{ (.Summary | plainify | safeJS) }}' + }, + {{ end }} +]; +</script> + +<main class="min-h-screen px-4 py-12"> + <div class="mx-auto px-4 py-12 max-w-4xl border border-border glow-accent rounded-lg bg-bg p-8" x-data="notFoundPage()"> + <div class="text-center"> + <!-- 404 Heading --> + <h1 class="text-7xl md:text-8xl font-bold text-accent mb-4 animate-fade-in"> + 404 + </h1> + + <!-- Error Message --> + <h2 class="text-3xl md:text-4xl font-bold mb-6"> + Pagina Non Trovata + </h2> + + <p class="text-lg text-text-dim mb-8"> + Mi dispiace, la pagina che stai cercando non esiste. Prova a cercare o sfoglia gli articoli qui sotto. + </p> + + <!-- Search Box --> + <div class="mb-12"> + <form id="search-form" class="flex flex-col gap-4"> + <label for="search-input" class="sr-only">Cerca articoli...</label> + <input + id="search-input" + type="text" + placeholder="Cerca articoli..." + class="px-4 py-3 border-2 border-border rounded focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent bg-bg text-text" + @input="filterArticles($el.value)" + /> + </form> + <div id="search-results" class="mt-4 text-left space-y-3" x-show="filteredArticles.length > 0"> + <template x-for="article in filteredArticles" :key="article.title"> + <div class="p-4 border-l-4 border-accent bg-bg/50 hover:bg-bg/70 transition-colors"> + <a :href="article.url" class="block text-left"> + <h4 class="font-bold text-accent hover:underline" x-text="article.title"></h4> + <p class="text-sm text-text-dim mt-1" x-text="article.date"></p> + </a> + </div> + </template> + </div> + <div x-show="searchQuery && filteredArticles.length === 0" class="mt-4 text-text-dim"> + Nessun articolo trovato che corrisponda alla tua ricerca. + </div> + </div> + + <!-- Recent Articles Section --> + <div class="mb-12"> + <h3 class="text-2xl font-bold mb-6">Articoli Recenti</h3> + <div class="space-y-4"> + {{ range first 5 (where .Site.RegularPages "Section" "articles") }} + <div class="p-4 border-l-4 border-accent bg-bg/50 hover:bg-bg/70 transition-colors"> + <a href="{{ .Permalink }}" class="block text-left"> + <h4 class="font-bold text-accent hover:underline">{{ .Title }}</h4> + <p class="text-sm text-text-dim mt-1"> + {{ .Date.Format "Jan 02, 2006" }} + </p> + </a> + </div> + {{ end }} + </div> + </div> + + <!-- Navigation Links --> + <div class="space-y-4 flex flex-col items-center mb-12"> + <a href="/it/" class="btn btn-primary"> + Torna a Casa + </a> + <a href="/it/articles/" class="btn btn-secondary"> + Sfoglia Articoli + </a> + <a href="/it/is/here/" class="btn btn-outline"> + Contattami + </a> + </div> + + <!-- Easter Egg Trigger --> + <div class="mt-12 pt-8 border-t border-border"> + <button + type="button" + @click="toggleEasterEgg()" + class="text-sm text-text-dim hover:text-accent transition-colors underline" + > + Segui il coniglio bianco... + </button> + </div> + + <!-- Easter Egg Modal (Hidden by default) --> + <div + class="fixed inset-0 z-50" + :class="{ 'flex items-center justify-center': showEasterEgg, 'hidden': !showEasterEgg }" + x-show="showEasterEgg" + x-cloak + > + <!-- Overlay --> + <div + class="absolute inset-0 bg-black/50" + @click="showEasterEgg = false" + ></div> + + <!-- Modal Content --> + <div class="relative bg-bg border-2 border-accent p-8 rounded-lg shadow-xl max-w-md mx-4"> + <h2 class="text-2xl font-bold mb-6 text-accent">Scegli il Tuo Percorso</h2> + + <div class="space-y-4"> + <button + type="button" + @click="showEasterEgg = false; window.location.href = '{{ .Site.BaseURL }}it/'" + class="w-full btn btn-primary" + > + 💊 Rimani Qui + </button> + + <button + type="button" + @click="goToRandomArticle()" + class="w-full btn btn-secondary" + > + 🐰 Mostrami di Più + </button> + </div> + + <button + type="button" + @click="showEasterEgg = false" + class="absolute top-4 right-4 text-text-dim hover:text-text dark:hover:text-text transition-colors" + aria-label="Close modal" + > + ✕ + </button> + </div> + </div> + </div> + </div> +</main> + +{{ end }} |