blog: cleanup blog layout

Author: tianzhou

src/components/pages/blog/posts/posts-grid/posts-grid.tsx

@@ -5,23 +5,10 @@ import { BlogPost } from '@/types/blog-post';
 import BlogPostCard from '../../blog-post-card';
 import { BlogPostTCardThemes } from '../../blog-post-card/blog-post-card';
 
-const getPostSize = (index: number): { size: string; theme: BlogPostTCardThemes } => {
-  if ([3, 4, 15, 16].indexOf(index) > -1) {
-    return {
-      size: 'col-span-6',
-      theme: 'large',
-    };
-  }
-
-  if (index <= 3 || (index >= 9 && index <= 14)) {
-    return {
-      size: 'col-span-4 md:col-span-6',
-      theme: 'default',
-    };
-  }
+const getPostSize = (): { size: string; theme: BlogPostTCardThemes } => {
   return {
-    size: 'col-span-3 md:col-span-6',
-    theme: 'small',
+    size: 'col-span-4 md:col-span-6',
+    theme: 'default',
   };
 };
 
@@ -33,7 +20,7 @@ const PostsGrid = ({ posts }: PostsGridProps) => {
   return (
     <ul className="gap-x-grid mt-16 grid grid-cols-12 gap-y-14 lg:mt-12 lg:gap-y-12 md:mt-8 md:gap-y-8 xs:mt-6">
       {posts.map((post, index) => {
-        const { size, theme } = getPostSize(index);
+        const { size, theme } = getPostSize();
         return (
           <li key={index} className={clsx('xs:col-span-full', size)}>
             <BlogPostCard post={post} theme={theme} />