From ecd3c6130f20dd74d06a2d4369f1871a4e7f0af7 Mon Sep 17 00:00:00 2001
From: sussy-code <dev@sudo-flix.lol>
Date: Fri, 3 May 2024 17:59:22 +0000
Subject: [PATCH] Make the bookmark button a little more elegant

---
 src/components/media/MediaBookmark.tsx | 2 +-
 src/pages/HomePage.tsx                 | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/media/MediaBookmark.tsx b/src/components/media/MediaBookmark.tsx
index 802fd7f2..1036cb05 100644
--- a/src/components/media/MediaBookmark.tsx
+++ b/src/components/media/MediaBookmark.tsx
@@ -38,7 +38,7 @@ export function MediaBookmarkButton({ media }: MediaBookmarkProps) {
     <IconPatch
       onClick={toggleBookmark}
       icon={isBookmarked ? Icons.BOOKMARK : Icons.BOOKMARK_OUTLINE}
-      className="p-3 opacity-80 transition-opacity duration-200 hover:opacity-100"
+      className="p-2 opacity-75 transition-opacity transition-transform duration-300 hover:opacity-95 hover:scale-110"
     />
   );
 }
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 3bf122e2..e6f5c4b5 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -68,8 +68,10 @@ export function HomePage() {
           <SearchListPart searchQuery={search} />
         ) : (
           <>
-            <BookmarksPart onItemsChange={setShowBookmarks} />
-            <WatchingPart onItemsChange={setShowWatching} />
+            <div className="flex flex-col gap-8">
+              <BookmarksPart onItemsChange={setShowBookmarks} />
+              <WatchingPart onItemsChange={setShowWatching} />
+            </div>
             {!(showBookmarks || showWatching) ? (
               <div className="flex flex-col items-center justify-center">
                 <p className="text-[18.5px] pb-3">{emptyText}</p>