styles: format code

pages/index.tsx

@@ -11,7 +11,8 @@ const CONTENT_DATA = [
       "When you’re trying to eat healthier but want something more substantial than a leafy green salad, broccoli salad is there for you. I love the crunch and heft of broccoli, especially when it’s cut up into bite size spoonable pieces.",
       "Some people aren’t into raw broccoli, but I love it! I always go for the raw broccoli on those vegetable platters that seem to be at every potluck/party you go to.",
       "This is a simple broccoli salad: you have the bulk of it, raw broccoli; crunchy red onions for a bit of acidity and raw crunch, craisins for sweetness, almonds for a nutty counter point; and a sweet and tangy soy-rice vinegar-sesame dressing.",
-    ]
+    ],
+    link: "/title"
   },
   {
     title: "This is a subtitle",
@@ -19,7 +20,8 @@ const CONTENT_DATA = [
       "When you’re trying to eat healthier but want something more substantial than a leafy green salad, broccoli salad is there for you. I love the crunch and heft of broccoli, especially when it’s cut up into bite size spoonable pieces.",
       "Some people aren’t into raw broccoli, but I love it! I always go for the raw broccoli on those vegetable platters that seem to be at every potluck/party you go to.",
       "This is a simple broccoli salad: you have the bulk of it, raw broccoli; crunchy red onions for a bit of acidity and raw crunch, craisins for sweetness, almonds for a nutty counter point; and a sweet and tangy soy-rice vinegar-sesame dressing.",
-    ]
+    ],
+    link: "/title"
   },
   {
     title: "This is a subtitle",
@@ -27,7 +29,8 @@ const CONTENT_DATA = [
       "When you’re trying to eat healthier but want something more substantial than a leafy green salad, broccoli salad is there for you. I love the crunch and heft of broccoli, especially when it’s cut up into bite size spoonable pieces.",
       "Some people aren’t into raw broccoli, but I love it! I always go for the raw broccoli on those vegetable platters that seem to be at every potluck/party you go to.",
       "This is a simple broccoli salad: you have the bulk of it, raw broccoli; crunchy red onions for a bit of acidity and raw crunch, craisins for sweetness, almonds for a nutty counter point; and a sweet and tangy soy-rice vinegar-sesame dressing.",
-    ]
+    ],
+    link: "/title"
   },
   {
     title: "This is a subtitle",
@@ -35,7 +38,8 @@ const CONTENT_DATA = [
       "When you’re trying to eat healthier but want something more substantial than a leafy green salad, broccoli salad is there for you. I love the crunch and heft of broccoli, especially when it’s cut up into bite size spoonable pieces.",
       "Some people aren’t into raw broccoli, but I love it! I always go for the raw broccoli on those vegetable platters that seem to be at every potluck/party you go to.",
       "This is a simple broccoli salad: you have the bulk of it, raw broccoli; crunchy red onions for a bit of acidity and raw crunch, craisins for sweetness, almonds for a nutty counter point; and a sweet and tangy soy-rice vinegar-sesame dressing.",
-    ]
+    ],
+    link: "/title"
   },
 ]
 export default function Home() {

src/components/common/CardBlog/CardBlog.module.scss

@@ -1,9 +1,9 @@
 @import "../../../styles/utilities";
 
 .cardBlogWarpper {
+    @apply inline-flex flex-col justify-start;
     max-width: 39.2rem;
     min-height: 34.4rem;
-    @apply inline-flex flex-col justify-start;
     .image {
         width: 100%;
         max-height: 22rem;

src/components/common/CollapseCommon/CollapseChild/CollapseChild.tsx

@@ -2,13 +2,15 @@ import s from './CollapseChild.module.scss'
 import { useState } from 'react'
 import classNames from 'classnames'
 import CollapseContent from './CollapseContent/CollapseContent'
+import Link from 'next/link'
 
 interface CollapseProps{
     title?: string,
     content: Array<string>,
     isToggle?: boolean,
+    link?: string,
 }
-const CollapseChild = ({title, content, isToggle=false}: CollapseProps) => {
+const CollapseChild = ({title, content, isToggle=false, link="/"}: CollapseProps) => {
     const [isActive, changeActive] = useState(isToggle)
 
     const handleToggle = () => {
@@ -22,7 +24,9 @@ const CollapseChild = ({title, content, isToggle=false}: CollapseProps) => {
             onClick = { handleToggle }
         >    
             <div className={s.title}>
+                <Link href={link}>
                     <a>{title}</a>
+                </Link>
                 <div className={s.toggle}></div>
             </div>
             <div className={s.contentContainer}>

src/components/common/CollapseCommon/CollapseChild/CollapseContent/CollapseContent.tsx

@@ -1,4 +1,3 @@
-import classNames from 'classnames'
 import s from './CollapseContent.module.scss'
 
 interface CollapseContentProps{

src/components/common/CollapseCommon/CollapseCommon.tsx

@@ -1,8 +1,7 @@
-import s from './CollapseCommon.module.scss'
 import CollapseChild from './CollapseChild/CollapseChild'
 
 interface CollapseCommonProps{
-    data: {title: string, content: Array<string>}[],
+    data: {title: string, content: Array<string>, link: string}[],
 }
 
 const CollapseCommon = ({data}: CollapseCommonProps) => {
@@ -10,7 +9,7 @@ const CollapseCommon = ({data}:CollapseCommonProps) => {
         <section>
             {
                 data.map(item =>
-                    <CollapseChild key={item.title} title={item.title} content={item.content} />
+                    <CollapseChild key={item.title} title={item.title} content={item.content} link={item.link} />
                 )
             }
         </section>

src/utils/constanst.utils.ts

@@ -9,7 +9,7 @@ export const ROUTE = {
     HOME: '/',
     PRODUCTS: '/products',
     ABOUT: '/about',
-    BLOG_DETAIL: '/blogdetail',
+    BLOG_DETAIL: '/blog',
     ACCOUNT: '/account',
     BUSSINESS: '/bussiness',
     CONTACT: '/contact',