From a3b58b9e95ccc21d80569b844e7eb18eab903a09 Mon Sep 17 00:00:00 2001
From: Aditya Telange <21258296+adityatelange@users.noreply.github.com>
Date: Sat, 11 Apr 2026 20:12:11 +0530
Subject: [PATCH] style(breadcrumbs): update markup to use <nav> for improved
 semantics and add SVG seperator

---
 assets/css/common/post-single.css | 13 +++++++++----
 layouts/partials/breadcrumbs.html | 28 ++++++++++++++++------------
 2 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/assets/css/common/post-single.css b/assets/css/common/post-single.css
index 6b974b28..a0dbc093 100644
--- a/assets/css/common/post-single.css
+++ b/assets/css/common/post-single.css
@@ -23,6 +23,15 @@
     display: flex;
     flex-wrap: wrap;
     align-items: center;
+    gap: 0.2rem;
+}
+
+.breadcrumbs a {
+    font-size: 16px;
+}
+
+.breadcrumbs svg {
+    height: 1em;
 }
 
 .i18n_list {
@@ -34,10 +43,6 @@
     margin: auto 3px;
 }
 
-.breadcrumbs a {
-    font-size: 16px;
-}
-
 .post-meta .i18n_list li a,
 .toc a:hover {
     box-shadow: 0 1px 0;
diff --git a/layouts/partials/breadcrumbs.html b/layouts/partials/breadcrumbs.html
index 2686ca09..ba53824e 100644
--- a/layouts/partials/breadcrumbs.html
+++ b/layouts/partials/breadcrumbs.html
@@ -1,19 +1,23 @@
 {{- if (.Param "ShowBreadCrumbs") -}}
-<div class="breadcrumbs">
+<nav class="breadcrumbs" role="navigation" aria-label="Breadcrumb">
+    <a href='{{ "" | absLangURL }}'>
+        {{- i18n "home" | default "Home" -}}
+    </a>
     {{- $url := replace .Parent.Permalink (printf "%s" site.Home.Permalink) "" }}
     {{- $lang_url := strings.TrimPrefix (printf "%s/" .Lang) $url -}}
-
-    <a href="{{ "" | absLangURL }}">{{ i18n "home" | default "Home" }}</a>
     {{- $scratch := newScratch }}
     {{- range $index, $element := split $lang_url "/" }}
-
-    {{- $scratch.Add "path" (printf "%s/" $element )}}
-    {{- $bc_pg := site.GetPage ($scratch.Get "path") -}}
-
-    {{- if (and ($bc_pg) (gt (len . ) 0))}}
-    {{- print "&nbsp;»&nbsp;" | safeHTML -}}<a href="{{ $bc_pg.Permalink }}">{{ $bc_pg.Name }}</a>
-    {{- end }}
-
+        {{- $scratch.Add "path" (printf "%s/" $element )}}
+        {{- $bc_pg := site.GetPage ($scratch.Get "path") -}}
+        {{- if (and ($bc_pg) (gt (len . ) 0))}}
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right">
+                <polyline points="9 18 15 12 9 6"></polyline>
+            </svg>
+            <a href="{{ $bc_pg.Permalink }}">
+                {{- $bc_pg.Name -}}
+            </a>
+        {{- end }}
     {{- end -}}
-</div>
+</nav>
 {{- end -}}