add extremely janky blog system
This commit is contained in:
parent
81672f11b7
commit
486daadaf8
9 changed files with 160 additions and 6 deletions
|
@ -13,7 +13,7 @@ body {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
header, section, main {
|
||||
header, section, main, article {
|
||||
padding: 16px max(calc(50vw - 300px), 16px);
|
||||
}
|
||||
|
||||
|
@ -101,7 +101,6 @@ kbd {
|
|||
box-shadow: 1px 1px #2f2f2f;
|
||||
}
|
||||
|
||||
|
||||
article h1, article h2, article h3, article h4 {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
|
18
blog/feed.xml
Normal file
18
blog/feed.xml
Normal file
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="UTF-8" ?>
|
||||
<?xml-stylesheet type="text/xsl" href="/blog/feed.xsl" ?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<atom:link href="https://celery.eu.org/rss.xml" rel="self" type="application/rss+xml" />
|
||||
<title>celery rss</title>
|
||||
<link>https://celery.eu.org/blog/feed.xml</link>
|
||||
<description>rss feed for celery.eu.org</description>
|
||||
<item>
|
||||
<title>Hello, world!</title>
|
||||
<guid>hello.md</guid>
|
||||
<link>https://celery.eu.org/blog/hello.md</link>
|
||||
<content type="html"><h1>Hello, world!</h1>
|
||||
<p>This is a test blog entry for my new blog system.</p>
|
||||
</content>
|
||||
<updated>2024-10-09T21:36:44.914Z</updated>
|
||||
</item></channel>
|
||||
</rss>
|
|
@ -31,11 +31,11 @@
|
|||
<xsl:value-of select="description" />
|
||||
</p>
|
||||
<footer>
|
||||
Published <time>
|
||||
updated <time>
|
||||
<xsl:attribute name="datetime">
|
||||
<xsl:value-of select="pubDate" />
|
||||
<xsl:value-of select="updated" />
|
||||
</xsl:attribute>
|
||||
<xsl:value-of select="pubDate" />
|
||||
<xsl:value-of select="updated" />
|
||||
</time>
|
||||
</footer>
|
||||
</article>
|
93
blog/genfeed.ts
Normal file
93
blog/genfeed.ts
Normal file
|
@ -0,0 +1,93 @@
|
|||
import { Marked } from "npm:marked@11.1.1";
|
||||
import hljs from "npm:highlight.js@11.5.1";
|
||||
import { markedHighlight } from "npm:marked-highlight@2.1.0";
|
||||
|
||||
const marked = new Marked(
|
||||
markedHighlight({
|
||||
langPrefix: 'hljs language-',
|
||||
highlight(code: string, lang: string) {
|
||||
const language = hljs.getLanguage(lang) ? lang : 'plaintext';
|
||||
return hljs.highlight(code, { language }).value;
|
||||
},
|
||||
})
|
||||
)
|
||||
|
||||
type Item = {
|
||||
path: string,
|
||||
title: string,
|
||||
content: string,
|
||||
mtime: Date,
|
||||
}
|
||||
|
||||
const renderMarkdown = (item: Item) => `
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>${item.title}</title>
|
||||
<meta charset="utf8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel=alternate title="feed" type=application/atom+xml href="/blog/feed.rss">
|
||||
<link rel="stylesheet" href="/assets/style2.css" />
|
||||
<link rel="stylesheet" href="/assets/code.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>${item.title}</h1>
|
||||
</header>
|
||||
<article>
|
||||
${marked.parse(item.content.split("\n").slice(2).join("\n"))}
|
||||
</article>
|
||||
</body>
|
||||
</html>`.trim();
|
||||
|
||||
const renderIndex = (entries: Array<Item>) => {
|
||||
const a = [...entries];
|
||||
a.sort((a, b) => +b.mtime - +a.mtime);
|
||||
return renderMarkdown({
|
||||
title: "index",
|
||||
mtime: new Date(),
|
||||
path: "/index.html",
|
||||
content: "\n\n" + a.map(i => `- [${i.title}](${i.path})`).join("\n"),
|
||||
});
|
||||
}
|
||||
|
||||
const renderItem = (item: Item) => `
|
||||
<item>
|
||||
<title>${item.title}</title>
|
||||
<guid>${item.path}</guid>
|
||||
<link>https://celery.eu.org/blog/${item.path}</link>
|
||||
<content type="html">${marked.parse(item.content)}</content>
|
||||
<updated>${item.mtime.toISOString()}</updated>
|
||||
</item>
|
||||
`.trim();
|
||||
|
||||
const renderFeed = (entries: Array<Item>) => `
|
||||
<?xml version="1.0" encoding="UTF-8" ?>
|
||||
<?xml-stylesheet type="text/xsl" href="/blog/feed.xsl" ?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<atom:link href="https://celery.eu.org/rss.xml" rel="self" type="application/rss+xml" />
|
||||
<title>celery rss</title>
|
||||
<link>https://celery.eu.org/blog/feed.xml</link>
|
||||
<description>rss feed for celery.eu.org</description>
|
||||
${entries.map(renderItem)}</channel>
|
||||
</rss>
|
||||
`.trim();
|
||||
|
||||
const fileNames = [...Deno.readDirSync(".")].filter(i => i.name.endsWith(".md") && i.isFile).map(i => i.name);
|
||||
const files: Array<Item> = fileNames.map(i => {
|
||||
const stat = Deno.statSync(i);
|
||||
const text = Deno.readTextFileSync(i);
|
||||
return {
|
||||
title: text.split("\n")[0].slice("# ".length),
|
||||
mtime: stat.mtime!,
|
||||
content: text,
|
||||
path: i,
|
||||
}
|
||||
});
|
||||
|
||||
Deno.writeTextFileSync("feed.xml", renderFeed(files));
|
||||
Deno.writeTextFileSync("index.html", renderIndex(files));
|
||||
for (const file of files) {
|
||||
Deno.writeTextFileSync(file.path.replace(/\.md$/, ".html"), renderMarkdown(file));
|
||||
}
|
20
blog/hello.html
Normal file
20
blog/hello.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Hello, world!</title>
|
||||
<meta charset="utf8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel=alternate title="feed" type=application/atom+xml href="/blog/feed.rss">
|
||||
<link rel="stylesheet" href="/assets/style2.css" />
|
||||
<link rel="stylesheet" href="/assets/code.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>Hello, world!</h1>
|
||||
</header>
|
||||
<article>
|
||||
<p>This is a test blog entry for my new blog system.</p>
|
||||
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
3
blog/hello.md
Normal file
3
blog/hello.md
Normal file
|
@ -0,0 +1,3 @@
|
|||
# Hello, world!
|
||||
|
||||
This is a test blog entry for my new blog system.
|
22
blog/index.html
Normal file
22
blog/index.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>index</title>
|
||||
<meta charset="utf8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel=alternate title="feed" type=application/atom+xml href="/blog/feed.rss">
|
||||
<link rel="stylesheet" href="/assets/style2.css" />
|
||||
<link rel="stylesheet" href="/assets/code.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>index</h1>
|
||||
</header>
|
||||
<article>
|
||||
<ul>
|
||||
<li><a href="hello.md">Hello, world!</a></li>
|
||||
</ul>
|
||||
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
1
rss.css
1
rss.css
|
@ -1 +0,0 @@
|
|||
|
Loading…
Reference in a new issue