From 59cc2b720b6529b86c70d54d82c4d9b05160b75e Mon Sep 17 00:00:00 2001
From: Hailey <74346290+healim01@users.noreply.github.com>
Date: Mon, 9 Dec 2024 17:03:26 +0900
Subject: [PATCH] =?UTF-8?q?[FE]=20=EB=9F=B0=EC=B9=AD=20=ED=9B=84=20?=
 =?UTF-8?q?=EC=83=9D=EA=B8=B4=20=EB=B2=84=EA=B7=B8=EB=A5=BC=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=ED=95=9C=EB=8B=A4.=20=20(#1060)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Seyeong Jeon <86130706+skiende74@users.noreply.github.com>
Co-authored-by: Hyerin <125418818+ooherin@users.noreply.github.com>
---
 .../NewChecklist/MoveNextButton.tsx           | 22 ++++++++++---------
 .../NewRoomInfoForm/RoomFloor.tsx             |  2 +-
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/frontend/src/components/NewChecklist/MoveNextButton.tsx b/frontend/src/components/NewChecklist/MoveNextButton.tsx
index 4861aadb2..159f89124 100644
--- a/frontend/src/components/NewChecklist/MoveNextButton.tsx
+++ b/frontend/src/components/NewChecklist/MoveNextButton.tsx
@@ -5,7 +5,6 @@ import { useTabContext } from '@/components/_common/Tabs/TabContext';
 import useTabs from '@/hooks/useTabs';
 import useChecklistStore from '@/store/useChecklistStore';
 import { flexRow } from '@/styles/common';
-import theme from '@/styles/theme';
 
 interface Props {
   marginTop?: string;
@@ -23,11 +22,11 @@ const MoveNextButton = ({ marginTop = '0', marginBottom = '0' }: Props) => {
 
   return (
     <S.ContentBox marginTop={marginTop} marginBottom={marginBottom}>
-      <S.Button onClick={handleClickPrev}>
-        <S.Text color={theme.palette.yellow600}>{'< 이전으로 이동'}</S.Text>
+      <S.Button onClick={handleClickPrev} disabled={currentTabId === -1}>
+        {`< 이전으로 이동`}
       </S.Button>
-      <S.Button onClick={handleClickNext}>
-        <S.Text color={theme.palette.yellow600}>{'다음으로 이동 >'}</S.Text>
+      <S.Button onClick={handleClickNext} disabled={currentTabId === categories.length}>
+        {'다음으로 이동 >'}
       </S.Button>
     </S.ContentBox>
   );
@@ -36,10 +35,6 @@ const MoveNextButton = ({ marginTop = '0', marginBottom = '0' }: Props) => {
 export default React.memo(MoveNextButton);
 
 const S = {
-  Text: styled.span<{ color: string }>`
-    color: ${({ color }) => color};
-    font-weight: ${({ theme }) => theme.text.weight.bold};
-  `,
   Button: styled.button`
     margin: 10px 0;
     padding: 0 15px;
@@ -47,10 +42,17 @@ const S = {
 
     background-color: ${({ theme }) => theme.palette.white};
 
-    font-weight: ${({ theme }) => theme.text.weight.medium};
+    color: ${({ theme }) => theme.palette.yellow600};
+    font-weight: ${({ theme }) => theme.text.weight.bold};
     font-size: ${({ theme }) => theme.text.size.small};
     line-height: 2.5;
     border-radius: 3rem;
+
+    &:disabled {
+      border: 0.25rem solid ${({ theme }) => theme.palette.grey300};
+
+      color: ${({ theme }) => theme.palette.grey500};
+    }
   `,
   ContentBox: styled.div<{ marginTop: string; marginBottom: string }>`
     ${flexRow}
diff --git a/frontend/src/components/NewChecklist/NewRoomInfoForm/RoomFloor.tsx b/frontend/src/components/NewChecklist/NewRoomInfoForm/RoomFloor.tsx
index ef6ab14e8..85d2df9fd 100644
--- a/frontend/src/components/NewChecklist/NewRoomInfoForm/RoomFloor.tsx
+++ b/frontend/src/components/NewChecklist/NewRoomInfoForm/RoomFloor.tsx
@@ -11,7 +11,7 @@ const RoomFloor = () => {
 
   const handleClickDropdown = (level: string) => {
     floorLevel.set(level);
-    if (level === '반지하/지하') {
+    if (level === '반지하/지하' || level === '옥탑') {
       floor.set('');
     }
   };