close #46

src/components/Article/Footer/Article.Footer.tsx

@@ -31,7 +31,6 @@ const ArticleFooter = ({ data }: { data: ArticlePostData }) => {
 
 const ArticleFooterContainer = styled.div`
   margin-top: 16px;
-
   & > div:not(:first-child) > div > button {
     border-top: none;
   }

src/components/Post/Post.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import { Typography } from '@acid-info/lsd-react'
 import { CommonProps } from '@acid-info/lsd-react/dist/utils/useCommonProps'
 import styled from '@emotion/styled'
@@ -124,7 +125,7 @@ export default function Post({
 
   const _thumbnail = useMemo(() => {
     if (!showImage || !coverImage) return null
-    if (postType === 'body') {
+    if (postType === PostType.BODY) {
       return <ResponsiveImage {...imageProps} data={coverImage} />
     } else {
       // TBD

src/components/PostList/PostList.tsx

@@ -5,9 +5,15 @@ import styled from '@emotion/styled'
 import Post, { PostDataProps } from '../Post/Post'
 import { Button, Typography } from '@acid-info/lsd-react'
 
+enum Layout {
+  XXXX = 'xxxx',
+  XXXX_XX = 'xxxx_xx',
+}
+
 type Props = {
   posts: PostDataProps[]
   pageSize?: number
+  layout?: Layout
 }
 
 const getGridItemWidth = (index: number) => {
@@ -45,7 +51,14 @@ export const PostsList = (props: Props) => {
       <Grid style={{ minHeight: '500px' }}>
         {postsToShow.length > 0 ? (
           postsToShow.map((post, index) => (
-            <GridItem className="w-4" key={index}>
+            <GridItem
+              className={
+                props.layout === Layout.XXXX_XX
+                  ? getGridItemWidth(index)
+                  : 'w-4'
+              }
+              key={index}
+            >
               <PostLink href={`/article/${post.slug}`}>
                 <PostWrapper>
                   <Post data={post} />