pixel perfect

src/app/blogs/components/BigBlogItem.tsx

@@ -43,7 +43,7 @@ const BigBlogItem: FC<BigBlogItemProps> = ({ item }) => {
                     </div>
                 </div>
 
-                <div className='mt-3 text-sm leading-5'>
+                <div className='mt-3 text-sm leading-6'>
                     {item.previewContent.replace(/<\/?[^>]+(>|$)/g, "")}
                 </div>
 

src/app/blogs/components/BlogList.tsx

@@ -104,7 +104,7 @@ const BlogList: FC = () => {
                         <ContactUs />
                     </div>
                     <div className='mt-6'>
-                        <MostVisited />
+                        <MostVisited title='انتخاب سردبیر' />
                     </div>
                 </div>
             </div>

src/app/blogs/components/HeroSection.tsx

@@ -4,6 +4,7 @@ import { FC } from 'react'
 import { useGetBlogCombined } from '../hooks/useBlogsData'
 import { AdsDisplayLocation } from '@/app/ads/types/AdsTypes'
 import { useGetAds } from '@/app/ads/hooks/useAdsData'
+import Link from 'next/link'
 
 const HeroSection: FC = () => {
 
@@ -27,7 +28,9 @@ const HeroSection: FC = () => {
 
                                     <div className='absolute bottom-0 h-[140px] modalGlass3 w-full p-6 text-white'>
                                         <h4 className='font-bold xl:text-base text-sm'>
+                                            <Link href={`/blogs/${item.slug}`}>
                                                 {item.title}
+                                            </Link>
                                         </h4>
 
                                         <div className="text-xs xl:text-sm mt-4 leading-7 truncate xl:text-clip xl:whitespace-normal line-clamp-2">

src/app/blogs/components/MiniBlogItem.tsx

@@ -16,7 +16,7 @@ const MiniBlogItem: FC<{ item: Blog }> = ({ item }) => {
             </Link>
 
             <Link href={`/blogs/${item.slug}`}>
-                <h6 className='text-xs leading-5 font-bold hover:opacity-70 transition-opacity'>
+                <h6 className='text-xs leading-5  hover:opacity-70 transition-opacity'>
                     {item.title}
                 </h6>
             </Link>

src/app/blogs/components/MostVisited.tsx

@@ -2,12 +2,16 @@ import { FC } from 'react'
 import MiniBlogItem from './MiniBlogItem'
 import { useGetMostVisitedBlogs } from '../hooks/useBlogsData'
 
-const MostVisited: FC = () => {
+type Props = {
+    title?: string
+}
+
+const MostVisited: FC<Props> = ({ title }) => {
     const { data } = useGetMostVisitedBlogs()
     return (
         <div className='w-full rounded-4xl bg-white p-4'>
-            <h4>
-                انتخاب سردبیر
+            <h4 className='font-bold'>
+                {title || 'پر بازدیدترین ها'}
             </h4>
 
             <div className='flex flex-col gap-6 mt-7 text-sm'>