update

src/components/markdown-editor/render.tsx

@@ -143,7 +143,7 @@ export function MarkdownRender({ md,fontSize, ...rest }:Props) {
       <ChakraMarkdown 
         children={renderMd} 
         {...rest} 
-        style={{height:'100%',fontSize: fontSize??'1.1rem'}}
+        style={{height:'100%',fontSize: fontSize??'1.2rem',lineHeight:'1.7'}}
         className="markdown-render"
         options={{
           overrides: {

src/components/posts/post-card.tsx

@@ -17,7 +17,7 @@ export const PostCard = (props: Props) => {
     const [isLargeScreen] = useMediaQuery("(min-width: 768px)")
     const Layout = isLargeScreen ? HStack : VStack
     return (
-        <VStack alignItems="left" spacing="4" p="1">
+        <VStack alignItems="left" spacing="4" p="2">
             <PostAuthor post={post} showFooter={false} size="md" />
             <Link href={`/${post.creator.username}/${post.id}`}>
                 <Layout alignItems={isLargeScreen ? "top" : "left"} cursor="pointer" pl="2" pt="1">

src/components/posts/posts.tsx

@@ -20,7 +20,7 @@ export const Posts = (props: Props) => {
         <>
             <VStack alignItems="left">
                 {posts.map(post =>
-                    <Box py="4" borderBottom={`1px solid ${postBorderColor}`} key={post.id}>
+                    <Box py="2" borderBottom={`1px solid ${postBorderColor}`} key={post.id}>
                         <Card post={post} size={props.size}/>
                     </Box>)}
             </VStack>

theme.ts

@@ -34,7 +34,7 @@ const customTheme = extendTheme({
           fontStyle: "normal !important",
         },
         fontWeight: '450',
-        fontSize: '17px'
+        fontSize: '16px'
       },
       ...markdownEditor(props),
       ...markdownRender(props)