style: Change post detail page layout

src/components/Graph/ProductPriceGraph.jsx

@@ -80,7 +80,7 @@ const ProductPriceGraph = ({ id }) => {
         ></Line>
       </S.GraphArea>
       <S.Text>
-        최근 6개월간 최저 <span>{minPriceString}원</span>
+        최근 6개월간 최저가 <span>{minPriceString}원</span>
       </S.Text>
     </S.ProductPriceGraph>
   );

src/pages/PostDetail/index.jsx

@@ -11,20 +11,9 @@ import ProductPriceGraph from '../../components/Graph/ProductPriceGraph';
 import { SubTitle } from '../../styles/Common.styles';
 import ButtonArea from '../../components/ButtonArea';
 import Button from '../../components/Button';
-import Spacer from '../../components/Spacer';
 import { useOverlay } from '@toss/use-overlay';
-import { Dialog, Slide } from '@mui/material';
+import { Suspense } from 'react';
-import React, { Suspense } from 'react';
+import CustomDialog from '../../components/CustomDialog';
-
-const Transition = React.forwardRef(function Transition(props, ref) {
-  return (
-    <Slide
-      direction="up"
-      ref={ref}
-      {...props}
-    />
-  );
-});
 
 const PostDetail = () => {
   const overlay = useOverlay();
@@ -32,29 +21,15 @@ const PostDetail = () => {
   const { data } = usePost(id);
   const openOverlay = () => {
     overlay.open(({ isOpen, close }) => (
-      <Dialog
+      <CustomDialog
         open={isOpen}
         onClose={close}
-        TransitionComponent={Transition}
+        title={'최근 거래 가격'}
-        PaperProps={{
-          style: {
-            padding: '8px 24px 24px 24px',
-            borderRadius: '20px',
-          },
-        }}
-        slotProps={{
-          backdrop: {
-            style: {
-              backdropFilter: 'blur(5px)',
-            },
-          },
-        }}
       >
-        <SubTitle>최근 거래 가격</SubTitle>
         <Suspense fallback={<></>}>
           <ProductPriceGraph id={data.product.id} />
         </Suspense>
-      </Dialog>
+      </CustomDialog>
     ));
   };