[FEAT] 최종 QA

src/api/auth/KakaoLoginButton.tsx

@@ -20,7 +20,7 @@ const KakaoLoginButton = () => {
           <span className="title2 text-text w-full text-center">
             카카오 로그인
           </span>
-        </button>{' '}
+        </button>
       </div>
     </div>
   );

src/app/layout.tsx

@@ -7,6 +7,9 @@ import ReactQueryProvider from '@/components/ReactQueryProvider';
 import { suite } from '@/styles/font';
 
 export const metadata: Metadata = {
+  icons: {
+    icon: [{ url: '/icon.png', type: 'image/png', sizes: '32x32' }],
+  },
   title: 'WishPooL',
   description: '선물 준비의 모든 과정을 한 곳에, WishPooL',
 };

src/app/login/page.tsx

@@ -5,7 +5,7 @@
 
 const LoginPage = () => {
   return (
-    <div className="bg-background-01 flex h-[100vh] flex-col items-center px-[2rem] pb-[4rem]">
+    <div className="bg-background-01 flex flex-col items-center px-[2rem] pt-[22rem] pb-[4rem]">
       <div className="text-text flex h-full flex-col items-center justify-center self-center text-center">
         <Image
           className="mb-[4rem]"
@@ -15,7 +15,7 @@
           alt="위시풀 로고"
         />
         <h2 className="head1 mb-[0.4rem]">마음을 선물할 때,</h2>
         <img src="/images/logoText.svg" />
       </div>
       <KakaoLoginButton />
     </div>

src/app/pick/invite/layout.tsx

@@ -3,8 +3,8 @@ import HomeHeader from '@/components/layout/Header/HomeHeader';
 const InviteLayout = ({ children }: { children: React.ReactNode }) => {
   return (
     <>
-      <HomeHeader />
-      <main className="from-Background-02 to-blue-5 pt-header min-h-screen bg-gradient-to-b px-[2rem]">
+      <HomeHeader bgColor="background02" />
+      <main className="from-background-02 to-blue-5 pt-header min-h-screen bg-gradient-to-b px-[2rem] pb-[21.6rem]">
         {children}
       </main>
     </>

src/app/pick/invite/page.tsx

@@ -41,7 +41,7 @@ const InviteHandler = () => {
     : WishpoolCardImage;
   return (
     <>
-      <div className="relative mt-[9rem] w-full rounded-[16px] bg-white">
+      <div className="relative mt-[7rem] mb-[4rem] w-full rounded-[16px] bg-white">
         <Icon
           name="ribbon"
           width={120}

src/app/wishpool/(builder)/preview/page.tsx

@@ -47,6 +47,8 @@ const PreviewPage = () => {
   const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
+    if (createMutation.isPending || createMutation.isSuccess) return;
+
     try {
       const res = await createMutation.mutateAsync(data);
 
@@ -120,6 +122,7 @@ const PreviewPage = () => {
               textColor="black"
               backgroundColor="light"
               textSize="sm"
+              type="button"
               onClick={() => {
                 history.back();
               }}

src/app/wishpool/join/[id]/complete/layout.tsx

@@ -25,7 +25,7 @@ const CompleteLayout = ({ children }: { children: React.ReactNode }) => {
         onClick={handleClose}
         bgColor="white"
       />
-      <main className="mt-header p-[2rem]">{children}</main>
+      <main className="mt-header px-[2rem] pb-[2rem]">{children}</main>
     </>
   );
 };

src/app/wishpool/join/[id]/complete/page.tsx

@@ -1,17 +1,10 @@
 'use client';
 import Image from 'next/image';
-import { useEffect, useState } from 'react';
 
 import CongratsImage from '@/assets/images/congrats.png';
 import FeedbackBox from '@/components/common/FeedbackBox';
 
 const CompletePage = () => {
-  const [hasToken, setHasToken] = useState(false);
-  useEffect(() => {
-    const token = localStorage.getItem('accessToken');
-    if (token) setHasToken(true);
-  }, []);
-
   return (
     <>
       <div className="flex flex-col items-center">
@@ -26,7 +19,7 @@ const CompletePage = () => {
           height={180}
         />
       </div>
-      {hasToken ? null : <FeedbackBox />}
+      <FeedbackBox />
     </>
   );
 };

src/components/common/Form/GiftField.tsx

@@ -53,7 +53,7 @@
     if (!imageKey) return;
     onChangeImage(imageKey);
     patchGift(index, { imageUrl: imageKey });
   }, [imageKey]);
 
   const handleDeleteImage = () => {
     reset();
@@ -122,7 +122,7 @@
               alt="선물 이미지 미리보기"
               width={82}
               height={82}
-              className="h-[8.2rem] w-[8.2rem] rounded-[12px] border border-gray-400"
+              className="h-[8.2rem] w-[8.2rem] rounded-[12px] border border-gray-400 object-cover"
             />
             <span className="absolute top-[0.6rem] left-[6rem]">
               <button
@@ -136,22 +136,24 @@
           </div>
         ) : (
           <div className="mt-[1.2rem]">
-            <div className="flex h-[5.6rem] w-full gap-[1.2rem] rounded-[12px] border border-gray-400 px-[1.6rem] py-[1.6rem] focus:border-gray-400 focus:outline-none">
-              <button
-                type="button"
-                onClick={() => fileInputRef.current?.click()}
-                aria-label="선물 이미지 추가"
-                disabled={isUploading}
-              >
+            <button
+              type="button"
+              className="w-full"
+              onClick={() => fileInputRef.current?.click()}
+              aria-label="선물 이미지 추가"
+              disabled={isUploading}
+            >
+              <div className="flex h-[5.6rem] gap-[1.2rem] rounded-[12px] border border-gray-400 px-[1.6rem] py-[1.6rem] focus:border-gray-400 focus:outline-none">
                 <Icon
                   name="photo"
                   width={24}
                   height={24}
                   className="text-gray-600"
                 />
-              </button>
-              <p className="body1 text-text">선물 사진 추가</p>
-            </div>
+
+                <p className="body1 text-text">선물 사진 추가</p>
+              </div>
+            </button>
             <p className="caption2 text-blue-primary mt-[0.8rem]">
               *사진을 추가하지 않을 때는 기본 이미지로 보여줄게요.
             </p>

src/components/pick/list/GiftCard.tsx

@@ -26,13 +26,19 @@ const GiftCard = ({
     <div
       className={`bg-background-01 flex grow-1 flex-col items-center gap-[2.4rem] rounded-[16px] ${isSmall ? 'p-[2.2rem]' : 'p-[6.4rem]'}`}
     >
-      <Image
-        src={finalSrc}
-        alt={`선물 카드 이미지 - ${giftId}`}
-        width={isSmall ? 126 : 170}
-        height={isSmall ? 126 : 170}
-        className={`rounded-[12px] object-cover`}
-      />
+      <div
+        className={`relative overflow-hidden rounded-[12px] ${
+          isSmall ? 'h-[12.6rem] w-[12.6rem]' : 'h-[17.1rem] w-[17.1rem]'
+        }`}
+      >
+        <Image
+          src={finalSrc}
+          alt={`선물 카드 이미지 - ${giftId}`}
+          fill
+          className="object-cover"
+        />
+      </div>
+
       <span
         className={`subtitle2 text-text line-clamp-2 h-[4.8rem] text-center ${isSmall ? 'w-[12.6rem]' : ''}`}
       >