From 07ac22d313c874441d2ce03e9e933dcfecdce04c Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Fri, 27 Mar 2026 17:30:11 +0200
Subject: [PATCH] Add back breadcrumb links to subpage

---
 app/components/layout/index.module.css | 16 ++++++++++++++++
 app/components/layout/index.tsx        | 22 ++++++++++++++++------
 2 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/app/components/layout/index.module.css b/app/components/layout/index.module.css
index ec2c787d4..880b29a7f 100644
--- a/app/components/layout/index.module.css
+++ b/app/components/layout/index.module.css
@@ -22,6 +22,8 @@
 .siteTitleFlipper {
 	min-width: 0;
 	overflow: hidden;
+	padding: 3px;
+	margin: -3px;
 }
 
 .siteTitle {
@@ -31,6 +33,8 @@
 	height: 100%;
 	min-width: 0;
 	overflow: hidden;
+	padding: 3px;
+	margin: -3px;
 }
 
 .siteLogo {
@@ -101,6 +105,18 @@
 	}
 }
 
+.breadcrumbLink {
+	display: flex;
+	align-items: center;
+	text-decoration: none;
+	border-radius: var(--radius-field);
+}
+
+.breadcrumbLink:focus-visible {
+	outline: var(--focus-ring);
+	outline-offset: 1px;
+}
+
 .pageName {
 	font-size: var(--font-xs);
 	font-weight: var(--weight-semi);
diff --git a/app/components/layout/index.tsx b/app/components/layout/index.tsx
index 46fe2480e..4352198d7 100644
--- a/app/components/layout/index.tsx
+++ b/app/components/layout/index.tsx
@@ -470,12 +470,22 @@ function SiteTitle() {
 
 				{hasBreadcrumbs ? (
 					<>
-						{breadcrumbs.map((crumb) => (
-							<React.Fragment key={crumb.href}>
-								<span className={styles.separator}>/</span>
-								<PageIcon crumb={crumb} />
-							</React.Fragment>
-						))}
+						{breadcrumbs.map((crumb) => {
+							const isCurrentPage = location.pathname === crumb.href;
+
+							return (
+								<React.Fragment key={crumb.href}>
+									<span className={styles.separator}>/</span>
+									{isCurrentPage ? (
+										<PageIcon crumb={crumb} />
+									) : (
+										<Link to={crumb.href} className={styles.breadcrumbLink}>
+											<PageIcon crumb={crumb} />
+										</Link>
+									)}
+								</React.Fragment>
+							);
+						})}
 
 						{currentPageText ? (
 							<span className={styles.pageName}>{currentPageText}</span>