Add sample blog posts and fix rendering

- Add hello-world.md and second-post.md sample posts
- Fix index page: use set:html for links, add charset, import global.css
- Fix post page: add charset meta tag
- Fix remark plugin: use className array, handle leaf directives
- Update CSS: support left/right margin note classes
This commit is contained in:
Lewis Wynne 2026-01-23 00:47:27 +00:00
parent bb1b30fc2d
commit cd7914dc4e
6 changed files with 43 additions and 9 deletions

View file

@ -15,7 +15,7 @@ const { Content } = await render(post);
---
<!DOCTYPE html>
<html>
<head><title>{post.data.title}</title></head>
<head><meta charset="UTF-8"><title>{post.data.title}</title></head>
<body>
<article>
<h1>{post.data.title}</h1>

View file

@ -1,5 +1,6 @@
---
import { getCollection } from 'astro:content';
import '../styles/global.css';
const posts = await getCollection('posts');
const sorted = posts.sort((a, b) => b.data.date.getTime() - a.data.date.getTime());
@ -13,8 +14,8 @@ function formatDate(date: Date): string {
---
<!DOCTYPE html>
<html>
<head><title>Blog</title></head>
<head><meta charset="UTF-8"><title>Blog</title></head>
<body>
<pre>{sorted.map(post => `<a href="/${post.id}">${formatDate(post.data.date)}</a> ${post.data.title}`).join('\n')}</pre>
<pre set:html={sorted.map(post => `${formatDate(post.data.date)} <a href="/${post.id}">${post.data.title}</a>`).join('\n')} />
</body>
</html>