From c1bdcdf9df97bb71558c4452011111d594cde79d Mon Sep 17 00:00:00 2001
From: Pas <74743263+Pasithea0@users.noreply.github.com>
Date: Thu, 4 Dec 2025 20:04:38 -0700
Subject: [PATCH] Adjust carousel title paddings and margins for layout
 consistency

---
 src/pages/discover/components/MediaCarousel.tsx | 6 +++---
 src/pages/parts/home/BookmarksCarousel.tsx      | 4 ++--
 src/pages/parts/home/WatchingCarousel.tsx       | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/pages/discover/components/MediaCarousel.tsx b/src/pages/discover/components/MediaCarousel.tsx
index 281b8b62..5b151023 100644
--- a/src/pages/discover/components/MediaCarousel.tsx
+++ b/src/pages/discover/components/MediaCarousel.tsx
@@ -305,9 +305,9 @@ export function MediaCarousel({
   return (
     <div>
       <div className="flex items-center justify-between ml-2 md:ml-8 mt-2">
-        <div className="flex flex-col">
+        <div className="flex flex-col pl-2 md:pl-[68px]">
           <div className="flex items-center gap-4">
-            <h2 className="text-2xl cursor-default font-bold text-white md:text-2xl pl-5 text-balance">
+            <h2 className="text-2xl cursor-default font-bold text-white md:text-2xl pl-0 text-balance">
               {sectionTitle}
             </h2>
             {showRecommendations &&
@@ -398,7 +398,7 @@ export function MediaCarousel({
             <Link
               to={generatedMoreLink}
               onClick={handleMoreClick}
-              className="flex px-5 items-center hover:text-type-link transition-colors"
+              className="flex items-center hover:text-type-link transition-colors"
             >
               <span className="text-sm">{t("discover.carousel.more")}</span>
               <Icon className="text-sm ml-1" icon={Icons.ARROW_RIGHT} />
diff --git a/src/pages/parts/home/BookmarksCarousel.tsx b/src/pages/parts/home/BookmarksCarousel.tsx
index 0d91b069..a2790e34 100644
--- a/src/pages/parts/home/BookmarksCarousel.tsx
+++ b/src/pages/parts/home/BookmarksCarousel.tsx
@@ -299,9 +299,9 @@ export function BookmarksCarousel({
                     <UserIcon icon={icon} className="w-full h-full" />
                   </span>
                 }
-                className="ml-4 md:ml-12 mt-2 -mb-5"
+                className="ml-4 md:ml-12 mt-2 -mb-5 md:pl-[48px]"
               >
-                <div className="mr-4 md:mr-8 flex items-center gap-2">
+                <div className="mr-4 md:mr-[48px] flex items-center gap-2">
                   {editing && section.group && (
                     <EditButtonWithText
                       editing={editing}
diff --git a/src/pages/parts/home/WatchingCarousel.tsx b/src/pages/parts/home/WatchingCarousel.tsx
index dc8d0942..12366fb9 100644
--- a/src/pages/parts/home/WatchingCarousel.tsx
+++ b/src/pages/parts/home/WatchingCarousel.tsx
@@ -91,9 +91,9 @@ export function WatchingCarousel({
       <SectionHeading
         title={t("home.continueWatching.sectionTitle")}
         icon={Icons.CLOCK}
-        className="ml-2 md:ml-8 mt-2 -mb-5"
+        className="ml-4 md:ml-12 mt-2 -mb-5 md:pl-[48px]"
       >
-        <div className="mr-6">
+        <div className="mr-4 md:mr-[48px]">
           <EditButton
             editing={editing}
             onEdit={setEditing}