From 3b0d012b2ec2e59faa11b56f3a9d995e3389e208 Mon Sep 17 00:00:00 2001
From: Kalle <38327916+Sendouc@users.noreply.github.com>
Date: Thu, 5 Mar 2026 20:21:59 +0200
Subject: [PATCH] Chevron to view all

---
 app/components/layout/index.module.css | 10 ++++++++++
 app/components/layout/index.tsx        |  8 +++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/app/components/layout/index.module.css b/app/components/layout/index.module.css
index 87355bed3..958d244c4 100644
--- a/app/components/layout/index.module.css
+++ b/app/components/layout/index.module.css
@@ -122,6 +122,16 @@
 	padding: var(--s-1) var(--s-2);
 }
 
+.viewAllLink {
+	display: flex;
+	align-items: center;
+	gap: 2px;
+
+	& svg {
+		stroke-width: 3;
+	}
+}
+
 /* Doubled selector increases specificity to beat Button.module.css's display: flex */
 .sideNavCollapseButton.sideNavCollapseButton {
 	display: none;
diff --git a/app/components/layout/index.tsx b/app/components/layout/index.tsx
index e3152415f..748d863cf 100644
--- a/app/components/layout/index.tsx
+++ b/app/components/layout/index.tsx
@@ -3,6 +3,7 @@ import { isToday, isTomorrow } from "date-fns";
 import {
 	Bell,
 	Calendar,
+	ChevronRight,
 	LogIn,
 	PanelLeft,
 	Settings,
@@ -262,7 +263,12 @@ export function Layout({
 
 				<SideNavHeader
 					icon={<Users />}
-					action={<Link to={FRIENDS_PAGE}>{t("common:actions.viewAll")}</Link>}
+					action={
+					<Link to={FRIENDS_PAGE} className={styles.viewAllLink}>
+						{t("common:actions.viewAll")}
+						<ChevronRight size={14} />
+					</Link>
+				}
 				>
 					{t("front:sideNav.friends")}
 				</SideNavHeader>