From 9e2c41f5e288be6d7e752f382f8ea94886288327 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Fri, 4 Aug 2023 22:19:38 +0800
Subject: [PATCH] Fix absolute positioning of list card mobile menus

---
 .../patterns/LibraryCards/LibraryListCard.tsx | 24 ++++++++++++-------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx b/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
index 939f28c9f..b149c9dad 100644
--- a/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
+++ b/packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
@@ -242,14 +242,26 @@ export function LibraryListCardContent(
           title={props.item.title}
           readingProgress={item.readingProgressPercent}
         />
-
+      </Box>
+      <VStack
+        alignment="start"
+        distribution="start"
+        css={{
+          height: '100%',
+          width: '100%',
+          lineHeight: 1,
+          gap: '5px',
+          position: 'relative',
+        }}
+      >
         <Box
           css={{
             ...MenuStyle,
             position: 'absolute',
-            top: 0,
-            right: 0,
+            top: -10,
+            right: -10,
             m: '5px',
+            bg: 'red',
             visibility: menuOpen ? 'visible' : 'hidden',
             '@media (hover: none)': {
               visibility: 'unset',
@@ -266,12 +278,6 @@ export function LibraryListCardContent(
             }
           />
         </Box>
-      </Box>
-      <VStack
-        alignment="start"
-        distribution="start"
-        css={{ height: '100%', width: '100%', lineHeight: 1, gap: '5px' }}
-      >
         <HStack
           css={{
             ...MetaStyle,