chore

FinFellows · Jan 18, 2024 · 69ef5ab · 69ef5ab
1 parent 4149769
commit 69ef5ab
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 33 deletions.
diff --git a/src/components/molecules/News/NewsContent.tsx b/src/components/molecules/News/NewsContent.tsx
@@ -7,9 +7,9 @@ type TNewsContentProps = {
 const NewsContent: React.FC<TNewsContentProps> = ({ content }) => {
   return (
     <div>
-      <div className='mb-39 tablet:mb-56 desktop:mb-[300px]'>
-        <div className='w-342 border-2 border-border02 rounded-[20px] py-[270px] tablet:w-[438px] desktop:w-[855px] dark:bg-[#343434]  dark:border-[#343434]'>
-          <div className='px-[20px] mt-[-250px] paragraph-small tablet:paragraph-medium desktop:paragraph-large dark:text-[#D6D6D6]'>
+      <div className='mb-200'>
+        <div className='w-342 border-2 border-border02 rounded-[20px] tablet:w-[438px] desktop:w-[855px] dark:bg-[#343434]  dark:border-[#343434]'>
+          <div className='desktop:p-44 p-17 tablet:p-22 paragraph-small tablet:paragraph-medium desktop:paragraph-large dark:text-[#D6D6D6]'>
             <EditorRenderer contents={content} />
           </div>
         </div>

diff --git a/src/components/molecules/News/NewsHeadLine.tsx b/src/components/molecules/News/NewsHeadLine.tsx
@@ -17,17 +17,17 @@ const NewsHeadLine: React.FC<TNewsHeadLineProps> = ({ title, created_at, bookmar
         <div className='w-68 h-81 ml-[260px] mt-[-5px] tablet:w-87 tablet:h-104 tablet:ml-[350px] desktop:w-178 desktop:h-153 desktop:ml-[680px]'>
           <Glasses_goldtorihalf />
         </div>
-        <div className='w-342 flex py-20 mb-10 mt-[-37px] border-2 border-border02 rounded-[20px] tablet:w-[438px] tablet:mt-[-48px] desktop:w-[855px] desktop:mt-[-38px] dark:border-[#383838] dark:bg-[#343434] dark:text-[#D6D6D6]'>
+        <div className='w-342 flex justify-between items-center py-20 mb-10 mt-[-37px] border-2 border-border02 rounded-[20px] tablet:w-[438px] tablet:mt-[-48px] desktop:w-[855px] desktop:mt-[-38px] dark:border-[#383838] dark:bg-[#343434] dark:text-[#D6D6D6]'>
           <div className='w-300 flex-col desktop:w-[800px] px-10 tablet:p-20 tablet:pt-30 tablet:w-400 tablet:mt-[-20px]  desktop:pr-20'>
-            <div className='ml-5 heading-medium font-bold typoPrimary tablet:pt-10 tablet:heading-large desktop:heading-xxl '>
+            <div className='ml-5 item-center heading-medium font-bold typoPrimary tablet:pt-10 tablet:heading-large desktop:heading-xxl '>
               {title}
             </div>
             <div className='ml-5 paragraph-small text-typoSecondary tablet:paragraph-medium desktop:paragraph-medium dark:text-[#D6D6D6)]'>
               {created_at}
             </div>
           </div>
           <button
-            className='z-5 h-26 w-26 py-6 tablet:w-33 tablet:h-33 tablet:pt-30 tablet:mr-10 desktop:pt-44 desktop:mr-25 desktop:w-37 desktop:h-37 '
+            className='z-5 h-26 w-26 tablet:w-33 tablet:h-33 tablet:mr-10 desktop:mr-25 desktop:w-37 desktop:h-37 '
             onClick={onHeartClick}
           >
             {bookmarked ? <Heartclick /> : <Heartdefault />}

diff --git a/src/components/molecules/News/NewsList.tsx b/src/components/molecules/News/NewsList.tsx
@@ -15,9 +15,11 @@ import { postNoticeApi } from '@/api/noticeApi';
 import ContentsCreateBtn from '../manage/ContentsCreateBtn';
 import ManageBtns from '../manage/ManageBtns';
 import EditorRenderer from '@/components/templates/editor/EditorRenderer';
+import { useRouter } from 'next/navigation';
 
 const NewsList = () => {
   const { user } = useUser();
+  const router = useRouter();
   const [NewsListData, setNewsListData] = useState<TNews[] | undefined>([]);
   const [showModal, setShowModal] = useState(false);
   //페이지
@@ -68,43 +70,33 @@ const NewsList = () => {
           }}
         />
       )}{' '}
-      {NewsListData?.map((i, index) => {
+      {NewsListData?.map((i) => {
         let date = new Date(i.created_at);
         let dateOnly = date.toISOString().split('T')[0];
         return (
           <div
             key={i.id}
             className='flex w-full mb-10 border-2 border-color-[#D6D6D6] rounded-[10px] border-border02 hover:border-main hover:border-2 dark:bg-[#343434] dark:border-[#383838]'
+            onClick={() => router.push(`/news/${i.id}`)}
           >
-            <Link
-              key={i.id}
-              href={{
-                pathname: `news/${i.id}`,
-              }}
-            >
-              <div className='bg-[#6C6C6C] w-87 h-full tablet:w-[112px] desktop:w-[167px] border-border-02 rounded-l-[10px]  '></div>
-            </Link>
-            <div className='flex justify-evenly '>
-              <Link
-                key={i.id}
-                href={{
-                  pathname: `/news/${i.id}`,
-                }}
-              >
-                <div className='flex-col bg-secondary px-12 w-[210px] tablet:w-[300px] desktop:w-[630px] dark:bg-[#343434]'>
-                  <h2 className='heading-small tablet:heading-medium desktop:heading-xl font-bold mt-[5px] pb-14 dark:text-[#D6D6D6]'>
-                    {i.title}
-                  </h2>
-                  <div className='text-typoSecondary paragraph-small tablet:paragraph-medium desktop:paragraph-large'>
-                    <div className='w-150 tablet:w-180 tablet:h-26 desktop:h-29 desktop:w-600 overflow-hidden text-ellipsis whitespace-nowrap'>
-                      <EditorRenderer contents={i.content} />
-                    </div>
-                    <div className='pb-10'>{dateOnly}</div>
+            <div className='bg-[#6C6C6C] w-87 tablet:w-[112px] desktop:w-[167px] border-border-02 rounded-l-[10px] '></div>
+            <div className='flex justify-between items-center'>
+              <div className='flex-col bg-secondary px-12 w-[210px] tablet:w-[300px] desktop:w-[630px] dark:bg-[#343434]'>
+                <h2 className='heading-small tablet:heading-medium desktop:heading-xl font-bold mt-[5px] pb-14 dark:text-[#D6D6D6]'>
+                  {i.title}
+                </h2>
+                <div className='text-typoSecondary paragraph-small tablet:paragraph-medium desktop:paragraph-large'>
+                  <div className='w-150 tablet:w-180 tablet:h-26 desktop:h-29 desktop:w-600 overflow-hidden text-ellipsis whitespace-nowrap'>
+                    <EditorRenderer contents={i.content} />
+                  </div>
+                  <div className='pb-10 text-typoSecondary paragraph-small tablet:paragraph-medium desktop:paragraph-large'>
+                    {dateOnly}
                   </div>
                 </div>
-              </Link>
+              </div>
+
               <p
-                className='mt-28 h-[26px] w-[26px] tablet:h-33 tablet:w-33 desktop:w-37 tablet:ml-[-15px] tablet:mt-35 desktop:h-37 desktop:mt-[50px]'
+                className='h-[26px] w-[26px] tablet:h-33 tablet:w-33 desktop:w-37 tablet:ml-[-15px] desktop:h-37'
                 onClick={(event) => {
                   event.stopPropagation();
                   onHeartClick(i.id, i.bookmarked);