More changes to structure and UI

This commit is contained in:
2022-04-27 21:55:18 -04:00
parent 2d4a2809b4
commit 6ba7d561fb
22 changed files with 257 additions and 218 deletions

View File

@@ -1,28 +1,30 @@
import Link from 'next/link';
import React from 'react';
import Layout from '../../components/layout';
import prettyDatePrint from '../../util/pretty-date';
import date from '../../util/date';
import { getPostsMeta, PostMeta } from '../../util/slug';
function HomePage(props: {postsMeta: PostMeta[]}) {
props.postsMeta.sort((x: any, y: any) => { return (x as any).title.localeCompare((y as any).title) });
function HomePage({ postsMeta }: { postsMeta: PostMeta[] }) {
// todo: create a table-like user interface
return (
return ( // wow this is horrible
<Layout name='Posts'>
<>
<section className='h4 block'>
Post Name <span style={{float: 'right', margin: 'auto 1rem'}}> Created on </span> <span style={{float: 'right', margin: 'auto 1rem'}}>Last Updated </span>
Post Name
<span style={{ float: 'right', margin: 'auto 1rem' }}> Created on </span>
<span style={{ float: 'right', margin: 'auto 1rem' }}>Last Updated </span>
</section>
{props.postsMeta.map((post: any) => {
return <section key='' className='h5 block'>
<Link href={`posts/${post.slug}`}>
{postsMeta.map((post: PostMeta, i) => {
return <section key={i} className='h5 block'>
<Link href={`/posts/${post.slug}`}>
{post.title}
</Link>
<span className='h6' style={{float: 'right', margin: 'auto 1rem'}}>{prettyDatePrint(new Date(post.created_at))}</span>
{post.last_updated ? <span className='h6' style={{float: 'right', margin: 'auto 1rem'}}>{prettyDatePrint(new Date(post.last_updated))}</span> : ''}
<span className='h6' style={{ float: 'right', margin: 'auto 1rem' }}>
{date.prettyPrint(new Date(post.created_at))}
</span>
{post.last_updated && <span className='h6' style={{ float: 'right', margin: 'auto 1rem' }}>
{date.prettyPrint(new Date(post.last_updated))}
</span>}
</section>
})}
</>
</Layout>
)
}