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

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

diff --git a/src/components/Widgets/BackButton.astro b/src/components/Widgets/BackButton.astro
index 330c25e..3f33671 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="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors ease-out c-secondary active:scale-90! hover:c-secondary/80"
+  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!"
   aria-label="Go back"
 >
   <GoBackIcon
diff --git a/src/pages/[...posts_slug].astro b/src/pages/[...posts_slug].astro
index b320fe4..c36b4ae 100644
--- a/src/pages/[...posts_slug].astro
+++ b/src/pages/[...posts_slug].astro
@@ -107,19 +107,17 @@ const { Content, headings, remarkPluginFrontmatter } = await render(post)
   supportedLangs={supportedLangs}
 >
   <article class="heti mb-12.6">
-    <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>
+    <!-- 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>
 
     <!-- Date -->
     <div