From 852b7a79deebd8430f48d393c62327bb1bf40f45 Mon Sep 17 00:00:00 2001
From: Lemon <lemonknowsall@gmail.com>
Date: Wed, 18 Mar 2026 23:33:10 -0700
Subject: [PATCH] Add back arrow to Trends page header to match other pages

Updates the Trends header to use the same layout pattern as
Bookmarks, Treasures, and other feed pages with a back arrow
that links to home, hidden on desktop.
---
 src/pages/TrendsPage.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/pages/TrendsPage.tsx b/src/pages/TrendsPage.tsx
index e421c131..4b85dae4 100644
--- a/src/pages/TrendsPage.tsx
+++ b/src/pages/TrendsPage.tsx
@@ -1,5 +1,5 @@
 import { useSeoMeta } from "@unhead/react";
-import { Flame, Loader2, Swords, TrendingUp } from "lucide-react";
+import { ArrowLeft, Flame, Loader2, Swords, TrendingUp } from "lucide-react";
 import { useEffect, useMemo, useState } from "react";
 import { useInView } from "react-intersection-observer";
 import { Link } from "react-router-dom";
@@ -65,10 +65,13 @@ export function TrendsPage() {
   return (
     <main className="">
       {/* Page header */}
-      <div className="px-4 py-3.5 sidebar:py-5">
-        <div className="flex items-center gap-2">
+      <div className="flex items-center gap-4 px-4 mt-4 mb-1">
+        <Link to="/" className="p-2 -ml-2 rounded-full hover:bg-secondary transition-colors sidebar:hidden">
+          <ArrowLeft className="size-5" />
+        </Link>
+        <div className="flex items-center gap-2 flex-1 min-w-0">
           <TrendingUp className="size-5" />
-          <h1 className="font-bold text-xl">Trends</h1>
+          <h1 className="text-xl font-bold">Trends</h1>
         </div>
       </div>