[FE] feat: 꿀조합 페이지 디자인 수정 (#693)

woowacourse-teams · Sep 21, 2023 · 1ccee48 · 1ccee48
1 parent 762ba8c
commit 1ccee48
Showing 1 changed file with 5 additions and 6 deletions.
diff --git a/frontend/src/pages/RecipePage.tsx b/frontend/src/pages/RecipePage.tsx
@@ -50,17 +50,17 @@ export const RecipePage = () => {
           <SvgIcon variant="search" />
         </Link>
       </TitleWrapper>
+      <Spacing size={12} />
       <ErrorBoundary fallback={ErrorComponent} handleReset={reset}>
         <Suspense fallback={<Loading />}>
-          <SortButtonWrapper>
-            <SortButton option={selectedOption} onClick={handleOpenSortOptionSheet} />
-          </SortButtonWrapper>
           <RecipeListWrapper ref={recipeRef}>
+            <SortButtonWrapper>
+              <SortButton option={selectedOption} onClick={handleOpenSortOptionSheet} />
+            </SortButtonWrapper>
             <RecipeList selectedOption={selectedOption} />
           </RecipeListWrapper>
         </Suspense>
       </ErrorBoundary>
-      <Spacing size={80} />
       <RecipeRegisterButtonWrapper>
         <RegisterButton
           activeLabel={REGISTER_RECIPE}
@@ -101,11 +101,10 @@ const Title = styled(Heading)`
 const SortButtonWrapper = styled.div`
   display: flex;
   justify-content: flex-end;
-  margin: 20px 0;
 `;
 
 const RecipeListWrapper = styled.div`
-  height: calc(100% - 190px);
+  height: calc(100% - 130px);
   overflow-y: auto;
 `;