Merge pull request StudyBadge-TenTen#129 from StudyBadge-TenTen/hotfix

[StudyBadge_FE StudyBadge-TenTen#117 ]: 반응형 ui 보완
rabyeoljji · Aug 6, 2024 · c956b06 · c956b06
2 parents 4c2cec5 + ddc3d1c
commit c956b06
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 8 deletions.
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -17,7 +17,11 @@ const Footer = (): JSX.Element => {
             GITHUB
           </a>{" "}
           | <a href="mailto:[email protected]">GMAIL</a> |{" "}
-          <a href="http://tenten-studybadge.notion.site" target="_blank" rel="noopener noreferrer">
+          <a
+            href="https://tenten-studybadge.notion.site/StudyBadge-88869c57effe4ef2a33ea393c594bcf4?pvs=4"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
             NOTION
           </a>
         </div>

diff --git a/src/components/map/LocationSelect.tsx b/src/components/map/LocationSelect.tsx
@@ -20,7 +20,7 @@ const LocationSelector: React.FC<LocationSelectorProps> = ({
 
   return (
     <Modal onClose={onClose}>
-      <div className="w-[800px] max-h-[80vh] overflow-y-auto">
+      <div className="w-[280px] md:w-[500px] lg:w-[800px] max-h-[80vh] overflow-y-auto">
         <h1 className="text-2xl font-bold text-Blue-2 text-center mb-4">장소 선택</h1>
         <KakaoMap originPlaceId={originPlaceId} studyChannelId={studyChannelId} setPlaceId={setPlaceId} />
       </div>

diff --git a/src/components/payment/Checkout.tsx b/src/components/payment/Checkout.tsx
@@ -97,7 +97,7 @@ const Checkout = ({
 
   return (
     <div className="outside-modal fixed top-0 left-0 w-screen h-screen bg-Gray-3 bg-opacity-25 z-40 flex justify-center items-center">
-      <div className="w-[320px] md:w-[550px] h-[450px] md:min-h-[600px] p-8 bg-white opacity-100 border border-solid border-Gray-2 rounded-[30px] fixed z-50 flex flex-col overflow-y-scroll">
+      <div className="w-[320px] md:w-[550px] h-[450px] md:h-[620px] p-8 bg-white opacity-100 border border-solid border-Gray-2 rounded-[30px] fixed z-50 flex flex-col overflow-y-scroll scrollbar-hide">
         <h2 className="text-2xl font-bold self-center">스터디 뱃지 포인트 충전</h2>
         {/* 결제 UI, 이용약관 UI 영역 */}
         <div id="payment-widget" />

diff --git a/src/components/payment/Success.tsx b/src/components/payment/Success.tsx
@@ -21,17 +21,18 @@ const Success = (): JSX.Element => {
   return (
     <Modal>
       {isLoading ? (
-        <div className="w-60 h-60 flex justify-center items-center">결제응답을 기다리는 중입니다...</div>
+        <div className="w-60 h-fit flex justify-center items-center">결제응답을 기다리는 중입니다...</div>
       ) : error ? (
-        <div className="">
+        <div className="w-60 h-fit">
           서버 응답에 문제가 발생하였습니다. error name:{error.name}. error message:{error.message}
         </div>
       ) : (
         data && (
-          <div className="w-60 h-60 result wrapper flex flex-col justify-center items-center">
+          <div className="w-60 h-fit result wrapper flex flex-col justify-center items-center">
             <h2 className="text-2xl font-bold text-center mb-4">결제가 완료되었습니다</h2>
-            <p>{`주문번호: ${data.orderId}`}</p>
-            <p className="mb-2">
+            <p>{`<주문번호>`}</p>
+            <p>{data.orderId}</p>
+            <p className="my-4">
               결제 금액:
               <b>{" " + Number(searchParams.get("amount")).toLocaleString()}</b>원
             </p>