feat: add breadcrumb navigation component

- Create breadcrumb.html partial with Home > Articles > Title structure
- Support both English and Italian language versions
- Add breadcrumb and breadcrumb-separator CSS classes
- Integrate breadcrumb into article detail pages
- Rebuild CSS: main.min.css updated

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

4 files changed, 61 insertions, 0 deletions

diff --git a/themes/danix-xyz-hacker/assets/css/main.css b/themes/danix-xyz-hacker/assets/css/main.css
index 50d5284..883d485 100644
--- a/themes/danix-xyz-hacker/assets/css/main.css
+++ b/themes/danix-xyz-hacker/assets/css/main.css
@@ -424,6 +424,19 @@ html.theme-light {
     @apply text-text hover:text-accent transition-colors;
   }
 
+  /* Breadcrumb navigation */
+  .breadcrumb {
+    @apply flex items-center gap-2 text-sm text-text-dim;
+  }
+
+  .breadcrumb a {
+    @apply hover:text-accent transition-colors;
+  }
+
+  .breadcrumb-separator {
+    @apply opacity-50;
+  }
+
   /* Article metadata styling (with icons) */
   .article-meta {
     @apply flex flex-wrap items-center gap-4 text-sm text-text-dim;
diff --git a/themes/danix-xyz-hacker/assets/css/main.min.css b/themes/danix-xyz-hacker/assets/css/main.min.css
index fac5cca..82ac77c 100644
--- a/themes/danix-xyz-hacker/assets/css/main.min.css
+++ b/themes/danix-xyz-hacker/assets/css/main.min.css
@@ -1504,6 +1504,31 @@ article.border.border-border\/30.rounded-lg.overflow-hidden.group.menu-overlay {
   opacity: 1;
 }
 
+/* Breadcrumb navigation */
+
+.breadcrumb {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  color: var(--text-dim);
+}
+
+.breadcrumb a {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.breadcrumb a:hover {
+  color: var(--accent);
+}
+
+.breadcrumb-separator {
+  opacity: 0.5;
+}
+
 /* Article metadata styling (with icons) */
 
 /* Hero typography with fluid sizing */
diff --git a/themes/danix-xyz-hacker/layouts/articles/single.html b/themes/danix-xyz-hacker/layouts/articles/single.html
index fe2ff6e..4e97fb3 100644
--- a/themes/danix-xyz-hacker/layouts/articles/single.html
+++ b/themes/danix-xyz-hacker/layouts/articles/single.html
@@ -5,6 +5,9 @@
   <div class="grid md:grid-cols-3 gap-8 max-w-7xl mx-auto content-grid">
     <!-- Article section -->
     <div class="md:col-span-2">
+      <!-- Breadcrumb -->
+      {{ partial "breadcrumb.html" . }}
+
       <!-- Article header -->
       {{ partial "article-header.html" . }}
 
diff --git a/themes/danix-xyz-hacker/layouts/partials/breadcrumb.html b/themes/danix-xyz-hacker/layouts/partials/breadcrumb.html
new file mode 100644
index 0000000..f2f794f
--- /dev/null
+++ b/themes/danix-xyz-hacker/layouts/partials/breadcrumb.html
@@ -0,0 +1,20 @@
+<nav class="breadcrumb mb-6" aria-label="Breadcrumb">
+  {{ $currentLang := .Page.Language }}
+
+  <!-- Home link -->
+  <a href="/">Home</a>
+  <span class="breadcrumb-separator">/</span>
+
+  <!-- Articles section -->
+  {{ if eq .Page.Type "article" }}
+    {{ if eq $currentLang "it" }}
+      <a href="/it/articles/">{{ i18n "articles" }}</a>
+    {{ else }}
+      <a href="/articles/">{{ i18n "articles" }}</a>
+    {{ end }}
+    <span class="breadcrumb-separator">/</span>
+
+    <!-- Current article title -->
+    <span>{{ .Page.Title }}</span>
+  {{ end }}
+</nav>