moritz
/
portfolio-webpage
mirror of https://github.com/moritz-hoelting/portfolio-webpage.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

redesign: style rss feed

This commit is contained in:
Moritz Hölting 2026-03-18 13:26:17 +01:00
parent 4080f8b3b3
commit df43ac617b
2 changed files with 113 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
public/rss-style.xsl Normal file
View File

@ -0,0 +1,108 @@
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="UTF-8" />
<xsl:template match="/">
<html>
<head>
<style>
@font-face {
font-family: "DepartureMono";
src: url("/fonts/DepartureMono-Regular.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "FiraCode";
src: url("/fonts/FiraCode-Regular.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "FiraCode";
src: url("/fonts/FiraCode-Bold.woff") format("woff");
font-weight: 700;
font-style: normal;
font-display: swap;
}
body {
font-family: "FiraCode", monospace;
background: #1a1a1a;
color: #ccc;
image-rendering: pixelated;
max-width: 768px;
margin-inline: auto;
}
* {
box-sizing: border-box;
}
h1, h2 {
font-family: "DepartureMono", monospace;
}
#backContainer {
margin-block: 1rem;
}
#backButton {
color: #ccc;
text-decoration: none;
padding: 0.5rem 1rem;
background: #555;
border-radius: calc(infinity * 1px);;
}
.item {
border: 2px solid #ccc;
padding: 1rem;
margin-bottom: 1rem;
}
.item > h2 > a {
color: #ccc;
text-decoration: none;
}
.item > .pills {
display: flex;
flex-wrap: wrap;
flex-direction: row;
gap: 1rem;
}
.item > .pills > * {
color: #ccc;
text-decoration: none;
text-transform: capitalize;
background: #555;
padding: 0.5rem 1rem;
border-radius: calc(infinity * 1px);;
}
h1, h2 {
margin: 0 0 1rem 0;
}
</style>
</head>
<body>
<h1><xsl:value-of select="rss/channel/title" /></h1>
<div id="backContainer">
<a id="backButton" href="/">Back to the main page</a>
</div>
<xsl:for-each select="rss/channel/item">
<div class="item">
<h2><a href="{link}"><xsl:value-of select="title" /></a></h2>
<div class="pills">
<a class="type" href="/{entryType}/"><xsl:value-of select="entryType" /></a>
<span class="date"><xsl:value-of select="pubDate" /></span>
</div>
<p><xsl:value-of select="description" /></p>
</div>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

7
src/pages/rss.xml.ts
View File

@ -27,14 +27,17 @@ export async function GET(context: Context) {
);
return rss({
title: SITE.TITLE,
title: `${SITE.TITLE} - ${SITE.AUTHOR}`,
description: SITE.DESCRIPTION,
site: context.site,
stylesheet: "/rss-style.xsl",
items: items.map(({ item, pre }) => ({
title: item.data.title,
description: item.data.summary,
author: SITE.AUTHOR,
pubDate: item.data.date,
link: `/${pre}/${item.id}/`,
link: `/${item.collection}/${item.id}/`,
customData: `<entryType>${item.collection}</entryType>`,
})),
});
}