dep ver bump; clean-up; minor updates

Signed-off-by: Paul W. <lambdapaul@protonmail.com>

components/container.tsx

@@ -1,3 +1,5 @@
+import { JSX } from "react";
+
 export type ChildrenType = JSX.Element| Array<ChildrenType>;
 
 function Container(props: { children?: ChildrenType, ignore?: boolean }) {

components/title.tsx

@@ -1,20 +1,21 @@
 import Link from 'next/link';
 import { useRouter } from 'next/router';
+import { Fragment } from 'react';
 
 import style from '../styles/title.module.css';
 import SiteMap from '../public/sitemap.json';
 import Head from 'next/head';
-import { SiteSubPages } from '../lib/site';
+import { Sites } from '../lib/site';
 
 function createPathElements(ancestors: Array<{ name: string, path: string }>) {
     let currentPath = '';
     return ancestors.map((ancestor, id) => {
         currentPath += `/${ancestor.path}`
         return (
-            <>
-                <Link key={currentPath} href={currentPath}>{ancestor.name}</Link>
+            <Fragment key={currentPath} >
+                <Link href={currentPath}>{ancestor.name}</Link>
                 <> / </>
-            </>
+            </Fragment>
         );
     });
 }
@@ -25,7 +26,8 @@ function Title() {
     const pagePath = router.asPath;
     const splitPath: Array<{ name: string, path: string }> = [];
 
-    let currRoot: SiteSubPages = SiteMap.subpages;
+	// TODO(Paul): clean this up
+    let currRoot: Sites = SiteMap.pages;
     let title: string | null = null;
     if (pagePath !== '/') {
         const subPaths = pagePath.split('?')[0].split('#')[0].split('/');
@@ -36,9 +38,9 @@ function Title() {
 
             if (currRoot === undefined
                 || currRoot[p] === undefined
-                || currRoot[p].subpages === undefined)
+                || currRoot[p].pages === undefined)
                 break;
-            currRoot = currRoot[p].subpages!;
+            currRoot = currRoot[p].pages!;
         }
         if (splitPath !== undefined && splitPath.length > 0)
             title = splitPath.pop()!.name;

lib/site.ts

@@ -1,11 +1,11 @@
 
 export interface Site {
     title: string;
-    subpages?: SiteSubPages;
+    pages?: Sites;
     mtime?: string;
     otime?: string;
 }
 
-export interface SiteSubPages {
+export interface Sites {
     [slug: string]: Site;
 }

next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.

next.config.ts

@@ -1,14 +1,18 @@
-const config = {
+import type {NextConfig } from 'next';
+import NextBundleAnalyzer from '@next/bundle-analyzer';
+
+let config: NextConfig = {
+    reactStrictMode: true,
     i18n: {
         locales: ['en-US'],
         defaultLocale: 'en-US'
     },
+    // not sure why this breaks prod build in the latest version
+    // aah it's so frustrating to deal with an warning log that
+    // shows up regardless of the config but its presence halts
+    // the entire thing. 
     webpack: (config, _options) => {
         config.module.rules.push(
-            {
-                test: /\.ya?ml$/,
-                use: 'js-yaml-loader',
-            },
             {
                 test: /\.svg$/,
                 use: [{ loader: '@svgr/webpack' }],
@@ -25,10 +29,6 @@ const config = {
                 test: /\.txt$/,
                 type: 'asset/source',
             },
-            {
-                resourceQuery: /raw/,
-                type: 'asset/source',
-            },
         );
 
         return config;
@@ -36,10 +36,9 @@ const config = {
 };
 
 if (process.env.ANALYZE) {
-    const bundleAnalyzer = require('@next/bundle-analyzer')({
+    config = NextBundleAnalyzer({
         enabled: true
-    });
-    module.exports = bundleAnalyzer(config);
-} else {
-    module.exports = config;
+    })(config);
 }
+
+export default config;

notes/lua.md

@@ -1,15 +1,11 @@
 # Lua Programming Language
-
-## Lua 5.4 C API
-
+<!-- TODO ## Lua 5.4 C API-->
 
 ## Lua 5.4 Bytecode
 
-> [!note]
 > These are **unstable** and may differ in different versions of the language.
 > They are not part of the language specification but an implementation detail, which in this case is the reference implementation.
 
-> [!note]
 > The reference implementation used to have a stack based but now uses a register based VM similar to how modern real computer architectures.
 
 The instructions are 32 bits wide; every instruction has an opcode that takes up 7 bits, which leaves out 25 bits for the addresses and values.

notes/os.md

@@ -33,8 +33,8 @@ Open it by exceuting the following command or saving it as a shortcut: `explorer
 
 ### Video Players
 
-- IINA
+- [IINA](https://iina.io/)
     - video player based on mpv with native macOS UI
-- mpv
+- [mpv](https://mpv.io/)
     - mpv doesn't have a brew cask for Apple silicon; stolen-mpv exists but it is x86 only
     - mpv brew formula is the cli tool which works pretty well but it is not as nice as packaged applications

notes/programming-resources.md

@@ -61,3 +61,8 @@ Semi-paywalled
 ## UTF-8 Everywhere
 
 - http://utf8everywhere.org
+
+## Parsing Gigabytes of JSON per Second
+
+- https://arxiv.org/abs/1902.08318 [[PDF](https://arxiv.org/pdf/1902.08318)]
+

notes/steam-deck.md

@@ -17,7 +17,7 @@
   following XDG Desktop Configuration, for example, can be used and added as a
   non-Steam game while in Desktop mode for access in gaming mode
 
-```cfg
+```ini
 #!/usr/bin/env xdg-open
 [Desktop]
 Version=1.0
@@ -27,7 +27,8 @@ GenericName=Online Video Platform
 Comment=An online video-sharing, social media platform
 Exec=/usr/bin/flatpak run --branch=master --arch=x86_64 --file-forwarding org.chromium.Chrome @@ %F @@ --user-agent='Mozilla/5.0 (Windows NT 10.0; Win64; x64; Xbox; Xbox Series X) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.82 Safari/537.36 Edge/20.02' --kiosk 'https://www.youtube.com/tv'
 Terminal=false
-MimeType=text/plain; # $XDG_PATH contains the paths used to fetch icons, extensions for supported formats are optional Icon=com.youtube.tv
+MimeType=text/plain;
+# $XDG_PATH contains the paths used to fetch icons, extensions for supported formats are optional Icon=com.youtube.tv
 ```
 
 - Firefox can also be used however the supported command-line options are

notes/steam.md

@@ -14,11 +14,11 @@
 - Alternatively, SteamCMD, a command-line only version of the Steam client, can
   be used
   - [Windows
-    Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd.zip)
+    Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd.zip)
   - [Linux
-    Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_linux.tar.gz)
+    Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_linux.tar.gz)
   - [macOS
-    Binary](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_osx.tar.gz)
+    Binary (.zip)](https://steamcdn-a.akamaihd.net/client/installer/steamcmd_osx.tar.gz)
 
 ## Downloading Older Depots
 
@@ -51,4 +51,7 @@ values.
   - useful bot written in C# to farm trading cards for owned games that can be
     sold
 - [SteamGridDB](https://steamgriddb.com/)
-  - custom video game assets for games available and not available on steam
+  - custom video game assets for games available and not available on Steam
+- [ProtonDB](https://www.protondb.com/)
+  - community-sourced Linux compatibility tracker
+

package.json

@@ -1,4 +1,5 @@
 {
+  "private": true,
   "scripts": {
     "dev": "next dev",
     "build": "next build",
@@ -7,28 +8,32 @@
   },
   "dependencies": {
     "dotenv": "^16.3.1",
-    "js-yaml-loader": "^1.2.2",
-    "next": "^13.5.1",
+    "highlight.js": "^11.10.0",
+    "next": "^15.0.4",
     "normalize.css": "^8.0.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-markdown": "^9.0.0",
-    "react-syntax-highlighter": "^15.5.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-markdown": "^9.0.1",
+    "rehype-autolink-headings": "^7.1.0",
+    "rehype-highlight": "^7.0.0",
+    "rehype-highlight-code-lines": "^1.0.4",
+    "rehype-katex": "^7.0.1",
     "rehype-raw": "^7.0.0",
-    "remark-directive": "^3.0.0",
+    "rehype-slug": "^6.0.0",
     "remark-gfm": "^4.0.0",
-    "remark-github-admonitions-to-directives": "^2.0.0",
+    "remark-loader": "^6.0.0",
+    "remark-math": "^6.0.0",
     "uri-js": "^4.4.1"
   },
   "devDependencies": {
-    "@next/bundle-analyzer": "^14.0.1",
-    "@svgr/webpack": "^6.5.1",
-    "@types/node": "^18.17.17",
-    "@types/react": "^18.2.22",
-    "@types/react-dom": "^18.2.7",
+    "@next/bundle-analyzer": "^15.0.4",
+    "@svgr/webpack": "^8.1.0",
+    "@types/node": "^22.7.4",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.1",
     "@types/react-syntax-highlighter": "^15.5.7",
-    "eslint": "^8.49.0",
-    "eslint-config-next": "^13.5.1",
-    "typescript": "^4.9.5"
+    "eslint": "^9.11.1",
+    "eslint-config-next": "^15.0.4",
+    "typescript": "^5.6.2"
   }
 }

pages/_document.tsx

@@ -0,0 +1,13 @@
+import { Html, Head, Main, NextScript } from "next/document";
+
+export default function Document() {
+  return (
+    <Html lang="en">
+      <Head />
+      <body>
+        <Main />
+        <NextScript />
+      </body>
+    </Html>
+  );
+}

pages/notes/[note].tsx

@@ -1,10 +1,15 @@
 import ReactMarkdown from 'react-markdown';
-import SyntaxHighlighter from 'react-syntax-highlighter';
-import { monokaiSublime as hlTheme } from 'react-syntax-highlighter/dist/cjs/styles/hljs';
+import { PluggableList } from 'unified';
+
 import remarkGfm from 'remark-gfm';
+import remarkMath from 'remark-math';
+
+import rehypeKatex from 'rehype-katex';
 import rehypeRaw from 'rehype-raw';
-import remarkDirective from 'remark-directive';
-import remarkGithubAdmonitionsToDirectives from 'remark-github-admonitions-to-directives';
+import rehypeSlug from 'rehype-slug';
+import rehypeAutolinkHeadings from 'rehype-autolink-headings';
+import rehypeHighlight from 'rehype-highlight';
+import rehypeHighlightCodeLines, { type HighlightLinesOptions } from 'rehype-highlight-code-lines';
 
 import Layout from '../../components/layout';
 import readMarkdown from '../../lib/read-markdown';
@@ -12,6 +17,8 @@ import { toLocaleString } from '../../lib/date';
 import NotesInfo from '../../public/notes.json';
 
 import style from '../../styles/note.module.css';
+import 'highlight.js/styles/monokai-sublime.css';
+import 'katex/dist/katex.min.css';
 
 interface Note {
 	title: string,
@@ -24,31 +31,20 @@ interface Notes {
 }
 
 function Markdown({ content }: any) {
-    return <ReactMarkdown
-        remarkPlugins={[remarkGithubAdmonitionsToDirectives, remarkDirective, remarkGfm]}
-        rehypePlugins={[rehypeRaw]}
-        components={{
-            code({ node, className, children, ...props }) {
-                const match = /language-(\w+)/.exec(className || '')
-                return match
-                    ? (
-                        <SyntaxHighlighter
-                            showLineNumbers={true}
-                            language={match[1]}
-                            //@ts-ignore
-                            style={hlTheme}
-                            PreTag='div'
-                            codeTagProps={{ style: { display: 'block' } }}
-                            customStyle={{ padding: '0', borderRadius: '1rem' }}
-                            {...props}
-                        >{String(children).replace(/\n$/, '')}</SyntaxHighlighter>
-                    )
-                    : <code className={className} {...props}>
-                        {children}
-                    </code>
-            }
-        }}
-    >{content}</ReactMarkdown>
+	const remarkPlugins: PluggableList = [
+		remarkGfm,
+		remarkMath,
+	];
+	const rehypePlugins: PluggableList = [
+		rehypeSlug,
+		rehypeAutolinkHeadings,
+		rehypeRaw,
+		rehypeHighlight,
+		rehypeKatex,
+	];
+	return <ReactMarkdown remarkPlugins={remarkPlugins} rehypePlugins={rehypePlugins}>
+		{content}
+	</ReactMarkdown>
 }
 
 function Note({ note }: { note: Note }) {
@@ -93,5 +89,4 @@ export async function getStaticPaths() {
 	};
 }
 
-
 export default Note;

pages/posts/[post].tsx

@@ -3,16 +3,16 @@ import ReactMarkdown from 'react-markdown';
 import style from '../../styles/post.module.css';
 import PostsInfo from '../../public/posts.json';
 import readMarkdown from '../../lib/read-markdown';
-import DateTool from '../../lib/date';
+import DateTool, { toLocaleString } from '../../lib/date';
 
-interface Post {
+interface IPost {
 	title: string;
 	mtime: string;
 	otime?: string;
 }
 
-interface Posts {
-    [slug: string]: Post
+interface IPosts {
+	[slug: string]: IPost
 }
 
 
@@ -51,9 +51,21 @@ function TimeBlock({ mtime, otime }: { mtime: string, otime: string }) {
 	);
 }
 
-function Post({ post }: { post: Post & { content: string, cover?: string, otime: string, mtime?: string } }) {
+function Post({ post }: { post: IPost & { content: string, cover?: string, otime: string, mtime?: string } }) {
+	if (!post)
+		return <></>;
 	return (<>
 		<Layout removeContainer={true}  >
+			<div className='container'>
+			   { post.otime !== post.mtime &&
+				   <span className={style.time}>
+				   Last updated: {toLocaleString(post.mtime)}
+				   </span>
+			   }
+				<span className={style.time}>
+					{toLocaleString(post.otime)}
+				</span>
+			</div>
 			{<div className={style.imageBlock}
 				style={{
 					backgroundImage:
@@ -64,7 +76,6 @@ function Post({ post }: { post: Post & { content: string, cover?: string, otime:
 			<div className={`${style.spacer} ${post.cover ? style.background : ''}`}></div>
 			<section className={`${style.block} block`}>
 				<div className='container'>
-                    <TimeBlock mtime={post.mtime} otime={post.otime} />
 					<ReactMarkdown>{post.content}</ReactMarkdown>
 				</div>
 			</section>
@@ -76,8 +87,8 @@ function Post({ post }: { post: Post & { content: string, cover?: string, otime:
 }
 
 export async function getStaticProps({ params }: any) {
-    const postsInfo: Posts = PostsInfo;
-    const post: Post = postsInfo[params.post];
+	const postsInfo: IPosts = PostsInfo;
+	const post: IPost = postsInfo[params.post];
 	return {
 		props: {
 			post: {

pages/posts/index.tsx

@@ -12,22 +12,21 @@ function PostsPage() {
 }
 
 function NoPosts() {
-    return (<><div className='text center'>
+	return (<div className='text center'>
 		<div>**crickets**</div>
 		<div>No posts found...</div>
 		<div><Link href='/' className='link button green back'>Go Home</Link></div>
-    </div></>);
+	</div>);
 }
 
 function Posts() {
 	const posts = Object.entries(PostsInfo);
 	return (
-        <>
 			<table>
 				<tbody>
 					{
 						posts.map(([slug, post]: [string, any]) => {
-                            return <tr key={slug} style={{ alignItems: 'center' }}>
+							return (<tr key={slug} style={{ alignItems: 'center' }}>
 								<td style={{ display: 'inline-block', textAlign: 'right', fontSize: '0.9rem' }}>
 									<div style={{ fontStyle: 'italics', fontSize: '.8rem' }}>{
 										post.mtime && (post.mtime != post.otime) && `Updated ${date.toRelativeDate(new Date(post.mtime))}`
@@ -35,17 +34,16 @@ function Posts() {
 									<div>{date.toRelativeDate(new Date(post.otime))}</div>
 								</td>
 								<td style={{
-                                    flex: '1 1 60%',
-                                    alignItems: 'center',
 									fontFamily: `'EB Garamond', 'Garamond', 'Times New Roman', Times, serif`
+									, fontSize: '1.25rem'
 								}}>
 									<Link href={`/posts/${slug}`} style={{ textDecoration: 'none' }}>{post.title}</Link>
 								</td>
-                            </tr>
-                        })}
+							</tr>)
+						})
+					}
 				</tbody>
 			</table>
-        </>
 	)
 }
 

pages/sitemap.tsx

@@ -1,45 +1,40 @@
 import Link from 'next/link';
 import Layout from '../components/layout';
-import { Site } from '../lib/site';
+import { Sites } from '../lib/site';
 import SiteMap from '../public/sitemap.json';
 
-function traverseMap(head: Site, cwd = '', depth = 0) {
-    if (head.subpages === undefined)
-        return [];
+function Desc(props: any) {
+	return (
+		<dl style={props.style}>
+			<dt>{props.term}</dt>
+			<dd>{props.details}</dd>
+			{props.children}
+		</dl>
+	);
+}
+
+function traverseMap(head?: Sites, cwd = '', depth = 0) {
+	if (!head) return [];
 	let elements = [];
-    for (const [slug, info] of Object.entries(head.subpages)) {
+	for (const [slug, site] of Object.entries(head)) {
 		if (slug === 'sitemap')
 			continue;
-        if (slug.startsWith('http://')) {
-            elements.push(<>
-                <dt>{info.title}</dt>
-                <dd><Link href={slug}>{slug.substring(7)}</Link></dd>
-            </>);
-        }
-        else if (slug.startsWith('https://')) {
-            elements.push(<>
-                <dt>{info.title}</dt>
-                <dd><Link href={slug}>{slug.substring(8)}</Link></dd>
-            </>);
-        }
-        else {
+
+		let details;
+		let list;
+
 		const path = `${cwd}/${slug}`;
-            const children = (<><dl style={{marginLeft: '3rem'}}> {traverseMap(info, path, depth + 1)}</dl></>);
-            elements.push(<>
-                    <dt>{info.title}</dt>
-                    <dd><Link href={path}>paulw.xyz{path}</Link></dd>
-                     {children}
-            </>);
-        }
+		details = <Link href={path}>paulw.xyz{path}</Link>;
+		list = traverseMap(site.pages, path, depth + 1);
+
+		elements.push(<Desc style={{marginLeft: '3rem'}} key={site.title} term={site.title} details={details}>{list}</Desc>)
 	}
 	return elements;
 }
 
 function SiteMapPage() {
-
-
 	return <Layout>
-        <dl>{traverseMap(SiteMap)}</dl>
+		{traverseMap(SiteMap.pages)}
 	</Layout>;
 }
 

public/home.json

@@ -10,11 +10,5 @@
     },
     "sitemap": {
         "title": "Site Map"
-     },
-     "https://git.paulw.xyz": {
-         "title": "Git.PaulW.XYZ"
-     },
-     "https://social.paulw.xyz": {
-         "title": "Social.PaulW.XYZ"
     }
  }

public/notes.json

@@ -1 +1 @@
-{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"steam":{"title":"Steam Client","mtime":"2024-10-10T04:56:04.393Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-10-10T05:04:27.709Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-10-10T05:19:16.140Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-09-13T08:45:18.515Z"},"os":{"title":"Operating Systems","mtime":"2024-05-10T16:07:32.581Z"}}
+{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"steam":{"title":"Steam Client","mtime":"2024-12-28T17:07:10.689Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-12-28T17:00:55.719Z"},"os":{"title":"Operating Systems","mtime":"2024-12-06T18:53:52.620Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-12-28T17:10:01.709Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-12-06T19:02:37.710Z"}}

public/sitemap.json

@@ -1 +1 @@
-{"title":"PaulW.XYZ","subpages":{"posts":{"title":"Posts","subpages":{}},"notes":{"title":"Notes","subpages":{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"steam":{"title":"Steam Client","mtime":"2024-10-10T04:56:04.393Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-10-10T05:04:27.709Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-10-10T05:19:16.140Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-09-13T08:45:18.515Z"},"os":{"title":"Operating Systems","mtime":"2024-05-10T16:07:32.581Z"}}},"about":{"title":"About"},"sitemap":{"title":"Site Map"},"https://git.paulw.xyz":{"title":"Git.PaulW.XYZ"},"https://social.paulw.xyz":{"title":"Social.PaulW.XYZ"}}}
+{"title":"PaulW.XYZ","pages":{"posts":{"title":"Posts","pages":{}},"notes":{"title":"Notes","pages":{"mos-6502":{"title":"MOS 6502 Microprocessor","mtime":"2023-10-29T18:05:52.439Z"},"zilog-z80":{"title":"Zilog Z80 Microprocessor","mtime":"2023-10-29T18:07:08.579Z"},"browsers":{"title":"Web Browsers","mtime":"2024-09-13T08:47:57.942Z"},"steam":{"title":"Steam Client","mtime":"2024-12-28T17:07:10.689Z"},"lua":{"title":"Lua Programming Language","mtime":"2024-12-28T17:00:55.719Z"},"os":{"title":"Operating Systems","mtime":"2024-12-06T18:53:52.620Z"},"steam-deck":{"title":"Steam Deck","mtime":"2024-12-28T17:10:01.709Z"},"programming-resources":{"title":"Programming Resources","mtime":"2024-12-06T19:02:37.710Z"}}},"about":{"title":"About"},"sitemap":{"title":"Site Map"}}}

scripts/generate-metadata.js

@@ -122,12 +122,12 @@ async function generateSiteMap() {
 
     const sitemap = {
         title: 'PaulW.XYZ',
-        subpages: await readFilesMetadata('home')
+        pages: await readFilesMetadata('home')
     };
 
     const pages = ['posts', 'notes'];
     for (const page of pages) {
-        sitemap.subpages[page].subpages = await readFilesMetadata(page);
+        sitemap.pages[page].pages = await readFilesMetadata(page);
     }
 
     await writeFilesMetadata(jsonFilePath('sitemap'), sitemap);

shims.d.ts

@@ -1,8 +1,3 @@
-declare module '*.yaml' {
-    const record: Record<string, any>;
-    export default record;
-}
-
 declare module '*.md' {
     const rawmd: string;
     export default rawmd;

styles/global.css

@@ -235,9 +235,8 @@ code {
 }
 
 table {
-    display: flex;
-    flex-direction: column;
-    margin: 1rem 0;
+    margin: 1rem auto;
+	width:100%;
     overflow: hidden;
     border-radius: 0.5rem;
 }
@@ -258,11 +257,6 @@ table tr:last-of-type
     border-bottom-right-radius: 0.5rem;
 }
 
-table thead tr,
-table tbody tr {
-    display: flex;
-}
-
 table tbody tr:nth-of-type(2n) {
     background-color: var(--table-even-color);
 }
@@ -273,12 +267,10 @@ table tbody tr:nth-of-type(2n+1) {
 
 table thead tr th,
 table tbody tr td {
-    display: flex;
-    flex: 1;
     padding: .25rem 0.75rem;
 }
 
-li {
+ul li {
     list-style-type: square;
 }
 

styles/post.module.css

@@ -31,3 +31,11 @@
 .background.spacer {
     height: 25rem;
 }
+
+.time {
+    text-align: center;
+    display: block;
+    font-style: italic;
+    font-size: 1rem;
+    margin: 0.5rem 0.75rem;
+}

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es2017",
+    "target": "es2023",
     "lib": [
       "dom",
       "dom.iterable",
@@ -13,7 +13,7 @@
     "noEmit": true,
     "esModuleInterop": true,
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",