added images + some styling + software post (empty)

1 files changed, 17 insertions, 19 deletions

diff --git a/pages/index.tsx b/pages/index.tsx
index be1f9f4..f030f2c 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,15 +1,15 @@
 import Button from '../components/button';
+import PostCard from '../components/card';
 import Chapters, { chapter } from '../components/chapters';
 import Navbar, { NavbarItem } from '../components/navbar';
 import Seperator from '../components/seperator';
-import PostCard from '../components/card';
-import { PostsInfo } from './search';
 import { ArticleMeta, getStaticProps as getBlogPage, RenderedArticle } from './post/[id]';
+import { PostsInfo } from './search';
 
 import { useEffect, useState } from 'react';
 
 // edit this to change the post displayed on the home page and the pinned posts
-var posts = ['index'];
+var posts = ['index', 'software'];
 
 export default function Home(props: {
 	posts: Array<{
@@ -54,24 +54,22 @@ export default function Home(props: {
 			<div className='contentWrapper'>
 				{props.posts.map((post, index) => {
 					return <>
-						{ index != 0 && <h1>{post.props.meta.title}</h1> }
+						{index != 0 && <h1>{post.props.meta.title}</h1>}
 						<RenderedArticle content={post.props.content} />
-						{ index + 1 != props.posts.length && <Seperator /> }
-						{
-							index == 0 && <>
-								<h2>Recent posts</h2>
-								<div className="recentPosts">
-								{
-									posts.posts.slice(0, 4).map(post => {
-										return <PostCard post={post}/>;
-									})
-								}
-								</div>
+						{index + 1 != props.posts.length && <Seperator />}
+						{index == 0 && <>
+							<h2>Recent posts</h2>
+							<div className='recentPosts'>
+								{posts.posts.slice(0, 4).map(post => {
+									return <PostCard post={post} />;
+								})}
+							</div>
 
-								<div><Button text="Go to all posts" href="/search"/></div>
-								<Seperator />
-							</>
-						}
+							<div>
+								<Button text='Go to all posts' href='/search' />
+							</div>
+							<Seperator />
+						</>}
 					</>;
 				})}
 			</div>