From 845bea6bcb152115935fd7f286a0ad66397791e6 Mon Sep 17 00:00:00 2001
From: Jungjjeong <sky990106@dgu.ac.kr>
Date: Thu, 8 Feb 2024 23:56:47 +0900
Subject: [PATCH] =?UTF-8?q?jungjjeong=20|=20refactor:=20=EC=82=AD=EC=A0=9C?=
 =?UTF-8?q?=ED=95=98=EA=B8=B0=20=EB=B2=84=ED=8A=BC=20=EA=B5=AC=EC=A1=B0=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../app/archive/marble-detail-card.tsx        | 32 ++++++++++---------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/components/app/archive/marble-detail-card.tsx b/src/components/app/archive/marble-detail-card.tsx
index 3cd6a60..0d6a30e 100644
--- a/src/components/app/archive/marble-detail-card.tsx
+++ b/src/components/app/archive/marble-detail-card.tsx
@@ -80,12 +80,23 @@ export const MarbleDetailCard = forwardRef<HTMLDivElement, Props>(
     // TODO: Add image save button
     return (
       <div className="relative">
-        <button
-          onClick={() => setIsShowDeleteBtn(!isShowDeleteBtn)}
-          className="absolute right-[52px] top-[30px] z-20 h-[24px] w-[24px]"
-        >
-          <Overflow />
-        </button>
+        <div className="absolute right-[52px] top-[30px] z-20 flex flex-col items-end gap-[6px]">
+          <button
+            onClick={() => setIsShowDeleteBtn(!isShowDeleteBtn)}
+            className=" h-[24px] w-[24px]"
+          >
+            <Overflow />
+          </button>
+
+          {isShowDeleteBtn && (
+            <button
+              className="h-fit w-fit rounded-3 bg-white px-4 py-3 text-secondary"
+              onClick={onClickMenu}
+            >
+              삭제하기
+            </button>
+          )}
+        </div>
 
         <div
           className="bg-archive-marble-detail mx-[20px] flex flex-col justify-center gap-3 self-stretch rounded-2xl bg-cover px-4 pb-5 pt-4 text-primary"
@@ -100,15 +111,6 @@ export const MarbleDetailCard = forwardRef<HTMLDivElement, Props>(
               alt="marble thumbnail"
               className="box-border w-full rounded-xl after:block after:pb-[calc(100%)]"
             />
-
-            {isShowDeleteBtn && (
-              <button
-                className="absolute right-[16px] top-[44px] h-fit w-fit rounded-3 bg-white px-4 py-3 text-secondary"
-                onClick={onClickMenu}
-              >
-                삭제하기
-              </button>
-            )}
           </div>
           <p
             className="mt-1 h-12 overflow-y-auto whitespace-pre-wrap"