feat: 생성한 리뷰 관리 디자인 수정 (#109)

* feat: 생성한 리뷰 관리 페이지 상세에서 scrolltop적용

* refactor: 질문 크기 수정

* refactor: 헥사스텟 UI 수정

src/pages/CreatedReviewManagePage/components/AnswerGroup/RenderHexaStat.tsx

@@ -14,17 +14,18 @@ const RenderHexaStat = ({
   return (
     <>
       <div>
-        <h2 className="mb-[0.81rem] flex h-[1.375rem] w-[3rem] items-center justify-center bg-gray-300 text-sm text-white">
+        <h2 className="mb-[0.81rem] flex h-[1.375rem] w-fit items-center justify-center bg-gray-300 p-2 text-sm text-white">
           {value?.name}
         </h2>
       </div>
-      <div className="flex">
+      <div className="grid grid-cols-3 gap-4">
         {filteredAnswers.map((value) => (
-          <div className="flex w-3/6 flex-wrap gap-[0.31rem]" key={nanoid()}>
+          <div className="flex gap-[0.31rem]" key={nanoid()}>
             <img
               src={BasicProfile}
               className="avatar h-[1.25rem] w-[1.25rem] border dark:bg-white dark:fill-white"
             />
+
             <p className="text-sm">{value?.userName}</p>
             <p className="text-sm text-sub-wine">{value?.value}</p>
           </div>

src/pages/CreatedReviewManagePage/components/ReceiverTabReviewDatail/index.tsx

@@ -5,6 +5,7 @@ import {
   useSaveFinalResult,
 } from '@/apis/hooks'
 import { CloseDropDownIcon } from '@/assets/icons'
+import { scrollToTop } from '@/utils'
 import { ProfileGroup, AnswerGroup } from '..'
 import { getAnswer } from '../../utils'
 
@@ -103,6 +104,9 @@ const ReceiverReviewDetail = ({
   const responserCount = new Set(
     responseByReceiver?.map((data) => data?.responser?.id.toString()),
   )
+  useEffect(() => {
+    scrollToTop()
+  }, [])
 
   return (
     <>

src/pages/CreatedReviewManagePage/components/ResponserTabReviewDetail/index.tsx

@@ -1,10 +1,11 @@
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 import {
   useGetReviewForCreator,
   useGetResponseByResponserForCreator,
 } from '@/apis/hooks'
 import { CloseDropDownIcon } from '@/assets/icons'
 import { getAnswer } from '@/pages/CreatedReviewManagePage/utils'
+import { scrollToTop } from '@/utils'
 import { SelectResponseUser, ProfileGroup, AnswerGroup } from '..'
 
 interface ReviewDetailAccordionProps {
@@ -39,6 +40,10 @@ const ReceiverReviewDetail = ({
     (response) => response?.receiver?.name === selectedName,
   )
 
+  useEffect(() => {
+    scrollToTop()
+  }, [])
+
   return (
     <>
       <label className="overlay" htmlFor="drawer-bottom"></label>

src/pages/CreatedReviewManagePage/index.tsx

@@ -132,7 +132,10 @@ const CreatedReviewManagePage = () => {
       </div>
 
       <div className="mx-auto flex w-full max-w-[37.5rem] flex-col px-5 py-7 md:p-10">
-        <h1 className="text-xl md:text-2xl">{getReviewQuestion?.title}</h1>
+        <h1 className="text-2xl font-bold md:text-3xl">
+          {getReviewQuestion?.title}
+        </h1>
+
         <h2 className="mt-3 whitespace-pre-wrap text-sm md:mt-4 md:text-xl">
           {getReviewQuestion?.description}
         </h2>