From 7c12dbd30182b9978b895dc289f7955a661e9a75 Mon Sep 17 00:00:00 2001
From: radishzzz <shuyinsen@gmail.com>
Date: Mon, 26 May 2025 12:36:16 +0100
Subject: [PATCH] fix: back button position

---
 src/components/Widgets/BackButton.astro |  2 +-
 src/pages/[...posts_slug].astro         | 24 +++++++++++++-----------
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/components/Widgets/BackButton.astro b/src/components/Widgets/BackButton.astro
index d16b02c..16a0aab 100644
--- a/src/components/Widgets/BackButton.astro
+++ b/src/components/Widgets/BackButton.astro
@@ -5,7 +5,7 @@ import GoBackIcon from '@/assets/icons/go-back.svg';
 <button
   id="back-button"
   class="hidden"
-  lg="fixed left-[max(2.5rem,calc(50vw-37.5rem))] top-24 block aspect-square w-4.5 c-secondary/40 transition-colors ease-out hover:c-secondary/80 active:scale-90!"
+  lg="absolute left--10 top-3.8 block aspect-square w-4.5 c-secondary/40 transition-colors ease-out hover:c-secondary/80 active:scale-90!"
   aria-label="Go back"
 >
   <GoBackIcon
diff --git a/src/pages/[...posts_slug].astro b/src/pages/[...posts_slug].astro
index c36b4ae..b320fe4 100644
--- a/src/pages/[...posts_slug].astro
+++ b/src/pages/[...posts_slug].astro
@@ -107,17 +107,19 @@ const { Content, headings, remarkPluginFrontmatter } = await render(post)
   supportedLangs={supportedLangs}
 >
   <article class="heti mb-12.6">
-    <!-- Go Back Button On Desktop -->
-    <BackButton />
-    <!-- Title -->
-    <h1 class="post-title">
-      <span
-        transition:name={`post-${post.data.abbrlink || post.id}-${lang}`}
-        data-disable-theme-transition
-      >
-        {post.data.title}
-      </span>
-    </h1>
+    <div class="relative">
+      <!-- Go Back Button On Desktop -->
+      <BackButton />
+      <!-- Title -->
+      <h1 class="post-title">
+        <span
+          transition:name={`post-${post.data.abbrlink || post.id}-${lang}`}
+          data-disable-theme-transition
+        >
+          {post.data.title}
+        </span>
+      </h1>
+    </div>
 
     <!-- Date -->
     <div