Merge pull request #89 from LikeLion-at-DGU/develop

🚀 Deploy
LikeLion-at-DGU · Oct 5, 2024 · 1c48208 · 1c48208
2 parents 0d89ded + 46befbb
commit 1c48208
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 17 deletions.
diff --git a/src/components/common/BoothDetail/styled.js b/src/components/common/BoothDetail/styled.js
@@ -9,21 +9,29 @@ const slideUp = keyframes`
   }
 `;
 export const DetailWrapper = styled.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
   position: fixed;
   bottom: 0;
-  width: 370px;
-  height: 55%;
-  gap: 20px;
+  width: 100%;
+  max-width: 540px;
+  height: 400px;
+  overflow-y: auto;
+  ::-webkit-scrollbar {
+    display: none; /* Chrome , Safari , Opera */
+  }
+  /* Firefox */
+  scrollbar-width: none;
+
+  /* Internet Explorer 10+, Edge */
+  -ms-overflow-style: none;
+
   background-color: #fff;
+  padding: 1.5rem 1.75rem;
   border-radius: 20px 20px 0px 0px;
   box-shadow: 0px 2px 40px 0px rgba(0, 0, 0, 0.7);
-  z-index: 10;
+  z-index: 30;
 
-  animation: ${slideUp} 0.5s ease-out forwards;
+  animation: ${({ $isVisible }) => ($isVisible ? slideInUp : slideOutDown)}
+    0.75s ease-out;
 
   @media (max-width: 375px) {
     height: 80%;
@@ -32,11 +40,8 @@ export const DetailWrapper = styled.div`
 export const DetailContent = styled.div`
   display: flex;
   flex-direction: column;
-  width: 90%;
+
   gap: 15px;
-  @media (max-width: 375px) {
-    margin-top: 1rem;
-  }
 `;
 
 export const NameContainer = styled.div`

diff --git a/src/hook/useBooth.js b/src/hook/useBooth.js
@@ -12,10 +12,6 @@ export const useBoothData = ({
 
   const fetchBoothData = async () => {
     try {
-      if (!day) {
-        console.warn("day 값이 없습니다. 기본값을 사용합니다.");
-        return; // day 값이 없을 경우 요청을 보내지 않음
-      }
       const res = await getBoothList(
         day,
         category,

diff --git a/src/pages/booth/BoothPage.jsx b/src/pages/booth/BoothPage.jsx
@@ -549,6 +549,7 @@ export const BoothPage = () => {
           <BoothDetail
             booth_id={selectBooth.id} // 선택된 부스 ID 전달
             onClose={() => setSelectBooth(null)}
+            $isVisible={selectBooth}
           />
           /* <S.BackgroundOverlay onClick={() => setSelectBooth(null)} />
             <S.BoothDetailWrapper $isVisible={selectBooth}>