Merge pull request TEAM-BEAT#227 from TEAM-BEAT/fix/TEAM-BEAT#208/FixQADesign

[Fix/TEAM-BEAT#208] 디자인 QA 사항 일부 반영

Author: pepperdad

src/components/commons/bottomSheet/BottomSheet.tsx

@@ -1,15 +1,16 @@
-import { ReactNode } from "react";
+import React, { ReactNode } from "react";
 import * as S from "./BottomSheet.styled";
 
 export interface BottomSheetPropType {
+  onClick?: React.MouseEventHandler<HTMLButtonElement>;
   isOpen: boolean;
   children?: ReactNode;
   title?: string;
 }
 
 const BottomSheet = ({ isOpen, title, children }: BottomSheetPropType) => {
   return (
-    <S.BottomSheetWrapper $isOpen={isOpen}>
+    <S.BottomSheetWrapper $isOpen={isOpen} onClick={(e) => e.stopPropagation()}>
       <S.BottomSheetLayout>
         <S.Title>{title}</S.Title>
         {children}

src/pages/main/components/floating/Floating.styled.ts

@@ -13,10 +13,14 @@ const float = keyframes`
   }
 `;
 
+export const Layer = styled.section`
+  position: relative;
+`;
+
 export const FloatingWrapper = styled.section`
   position: fixed;
   right: 0.3rem;
-  bottom: 12rem;
+  bottom: 15rem;
   z-index: 25;
   display: flex;
   flex-direction: column;

src/pages/main/components/floating/Floating.tsx

@@ -5,19 +5,21 @@ const Floating = () => {
   const navigate = useNavigate();
 
   return (
-    <S.FloatingWrapper>
-      <S.FloatingContainer>
-        <S.UnionIcon></S.UnionIcon>
-        <S.UnionText>공연을 등록해보세요!</S.UnionText>
-        <S.FloatingBtnWrapper
-          onClick={() => {
-            navigate("/gig-register");
-          }}
-        >
-          <S.FloatingBtn />
-        </S.FloatingBtnWrapper>
-      </S.FloatingContainer>
-    </S.FloatingWrapper>
+    <S.Layer>
+      <S.FloatingWrapper>
+        <S.FloatingContainer>
+          <S.UnionIcon></S.UnionIcon>
+          <S.UnionText>공연을 등록해보세요!</S.UnionText>
+          <S.FloatingBtnWrapper
+            onClick={() => {
+              navigate("/register");
+            }}
+          >
+            <S.FloatingBtn />
+          </S.FloatingBtnWrapper>
+        </S.FloatingContainer>
+      </S.FloatingWrapper>
+    </S.Layer>
   );
 };