import { FC } from 'react'
import HeroSection from './components/HeroSection'
import Category from './components/Category'
import BigBlogItem from './components/BigBlogItem'
import MostVisited from './components/MostVisited'
import ContactUs from './components/ContactUs'
const Blogs: FC = () => {
    return (
        <div className='max-w-maxWidth mx-auto'>
            <HeroSection />

            <h1 className='text-2xl font-bold mt-10'>
                مجله داناک
            </h1>

            <div className='mt-10 flex gap-8'>
                <div className='w-[261px]'>
                    <Category />
                </div>

                <div className='flex-1 flex flex-col gap-8'>
                    <BigBlogItem />
                    <BigBlogItem />
                    <BigBlogItem />
                </div>

                <div className='w-[261px]'>
                    <MostVisited />
                    <div className='mt-6'>
                        <ContactUs />
                    </div>
                    <div className='mt-6'>
                        <MostVisited />
                    </div>
                </div>
            </div>
        </div>
    )
}

export default Blogs