summaryrefslogtreecommitdiff
path: root/feed.xslt.xml
diff options
context:
space:
mode:
authormayx <mayx@outlook.com>2025-04-23 18:11:09 +0200
committermayx <mayx@outlook.com>2025-04-23 18:11:09 +0200
commit16fd0ffd59139d43469726af3322990563088d17 (patch)
treebd1fc4e0af4b4cad9e906881e737d4c75ef14726 /feed.xslt.xml
parent028f8b73474ca5d71ec81cb37a828cdfcc21c620 (diff)
Update file feed.xslt.xml
Diffstat (limited to 'feed.xslt.xml')
-rw-r--r--feed.xslt.xml151
1 files changed, 77 insertions, 74 deletions
diff --git a/feed.xslt.xml b/feed.xslt.xml
index 6ebf1e1..f4ff968 100644
--- a/feed.xslt.xml
+++ b/feed.xslt.xml
@@ -1,89 +1,92 @@
<?xml version="1.0" encoding="utf-8"?>
-<xsl:stylesheet version="3.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
- xmlns:atom="http://www.w3.org/2005/Atom">
- <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
+<!--
+
+# Pretty Atom Feed
+
+Based on "Pretty RSS Feed": https://github.com/genmon/aboutfeeds/issues/26
+
+Styles an Atom feed, making it friendly for humans viewers, and adds a link
+to aboutfeeds.com for new user onboarding. See it in action:
+
+https://nicolas-hoizey.com/feeds/all.xml
+
+-->
+<xsl:stylesheet
+ version="3.0"
+ xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+ xmlns:atom="http://www.w3.org/2005/Atom">
+ <xsl:output method="html" version="4.0" encoding="UTF-8" indent="yes"/>
<xsl:template match="/">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
- <title>
- Atom Feed |
- <xsl:value-of select="/atom:feed/atom:title"/>
- </title>
<meta charset="utf-8"/>
- <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
+ <title><xsl:value-of select="atom:feed/atom:title"/></title>
+ <style type="text/css">*{box-sizing:border-box}body{background-color:#fff;color:#24292e;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";line-height:1.5}a{color:#0366d6;text-decoration:none}a:hover{text-decoration:underline}.container{max-width:40rem;margin:1rem auto;padding:1rem}nav{margin-top:2rem;margin-bottom:2rem}p{margin-top:0;margin-bottom:1rem}h1,h2,h3{margin-top:0;margin-bottom:1rem;font-weight:600;line-height:1.25}h1{padding-bottom:.3em;font-size:2em}h1 svg{padding-right:.25rem;vertical-align:text-bottom;width:1.2em;height:1.2em}h2{margin-top:1.5rem;padding-bottom:.3em;font-size:1.5em;border-bottom:1px solid #eaecef}h3{font-size:1.25em;margin-bottom:0}.about{background-color:#fff5b1;margin:.25rem -.25rem;padding:.25rem}header{padding-top:2rem;padding-bottom:2rem}.item{padding-bottom:2rem}.gray{color:#586069}</style>
</head>
- <body class="feed-preview">
- <p>
- <strong>This is an Atom feed (similar to RSS)</strong>. Subscribe by copying
- the URL from the address bar into your newsreader. Visit <a
- href="https://aboutfeeds.com">About Feeds
- </a> to learn more and get started. It's free.
+ <body>
+ <nav class="container">
+ <p class="about">
+ <strong>This is a web feed,</strong> also known as an RSS or Atom feed.<br /><strong>Subscribe</strong> by copying the URL from the address bar into your newsreader.
</p>
- <h1 class="flex items-start">
- <!-- https://commons.wikimedia.org/wiki/File:Feed-icon.svg -->
- <svg xmlns="http://www.w3.org/2000/svg" version="1.1"
- class="mr-5"
- style="flex-shrink: 0; width: 1em; height: 1em;"
- viewBox="0 0 256 256">
- <defs>
- <linearGradient x1="0.085" y1="0.085" x2="0.915" y2="0.915"
- id="RSSg">
- <stop offset="0.0" stop-color="#E3702D"/>
- <stop offset="0.1071" stop-color="#EA7D31"/>
- <stop offset="0.3503" stop-color="#F69537"/>
- <stop offset="0.5" stop-color="#FB9E3A"/>
- <stop offset="0.7016" stop-color="#EA7C31"/>
- <stop offset="0.8866" stop-color="#DE642B"/>
- <stop offset="1.0" stop-color="#D95B29"/>
- </linearGradient>
- </defs>
- <rect width="256" height="256" rx="55" ry="55" x="0" y="0"
- fill="#CC5D15"/>
- <rect width="246" height="246" rx="50" ry="50" x="5" y="5"
- fill="#F49C52"/>
- <rect width="236" height="236" rx="47" ry="47" x="10" y="10"
- fill="url(#RSSg)"/>
- <circle cx="68" cy="189" r="24" fill="#FFF"/>
- <path
- d="M160 213h-34a82 82 0 0 0 -82 -82v-34a116 116 0 0 1 116 116z"
- fill="#FFF"/>
- <path
- d="M184 213A140 140 0 0 0 44 73 V 38a175 175 0 0 1 175 175z"
- fill="#FFF"/>
- </svg>
- Feed Preview
- </h1>
- <h2>Feed from <xsl:value-of select="/atom:feed/atom:title"/></h2>
- <p>
- <xsl:value-of select="/atom:feed/atom:subtitle"/>
+ <p class="gray">
+ Visit <a href="https://aboutfeeds.com">About Feeds</a> to get started with newsreaders and subscribing. It’s free.
</p>
- <a>
- <xsl:attribute name="href">
- <xsl:value-of select="/atom:feed/atom:link[2]/@href"/>
- </xsl:attribute>
- Visit Website &#x2192;
- </a>
- <hr />
- <h3>Recent posts</h3>
- <xsl:for-each select="/atom:feed/atom:entry">
- <h4>
- <xsl:value-of select="substring(atom:published, 0, 11)" />
- »
- <a>
- <xsl:attribute name="href">
- <xsl:value-of select="atom:link/@href"/>
- </xsl:attribute>
- <xsl:value-of select="atom:title"/>
- </a>
- </h4>
- <p><xsl:value-of select="atom:summary"/></p>
- </xsl:for-each>
- <hr />
+ </nav>
+ <div class="container">
+ <header>
+ <h1>
+ <svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 256 256">
+ <defs>
+ <linearGradient x1="0.085" y1="0.085" x2="0.915" y2="0.915" id="RSSg">
+ <stop offset="0.0" stop-color="#E3702D"/><stop offset="0.1071" stop-color="#EA7D31"/>
+ <stop offset="0.3503" stop-color="#F69537"/><stop offset="0.5" stop-color="#FB9E3A"/>
+ <stop offset="0.7016" stop-color="#EA7C31"/><stop offset="0.8866" stop-color="#DE642B"/>
+ <stop offset="1.0" stop-color="#D95B29"/>
+ </linearGradient>
+ </defs>
+ <rect width="256" height="256" rx="55" ry="55" x="0" y="0" fill="#CC5D15"/>
+ <rect width="246" height="246" rx="50" ry="50" x="5" y="5" fill="#F49C52"/>
+ <rect width="236" height="236" rx="47" ry="47" x="10" y="10" fill="url(#RSSg)"/>
+ <circle cx="68" cy="189" r="24" fill="#FFF"/>
+ <path d="M160 213h-34a82 82 0 0 0 -82 -82v-34a116 116 0 0 1 116 116z" fill="#FFF"/>
+ <path d="M184 213A140 140 0 0 0 44 73 V 38a175 175 0 0 1 175 175z" fill="#FFF"/>
+ </svg>
+ Web Feed Preview
+ </h1>
+ <h2><xsl:value-of select="atom:feed/atom:title"/></h2>
+ <p><xsl:value-of select="atom:feed/atom:description"/></p>
+ <p>This preview only shows titles, but the actual feed contains the full content.</p>
+ <a>
+ <xsl:attribute name="href">
+ <xsl:value-of select="/atom:feed/atom:link[not(@rel)]/@href"/>
+ </xsl:attribute>
+ Visit Website &#x2192;
+ </a>
+ </header>
+ <h2>Recent Items</h2>
+ <xsl:apply-templates select="atom:feed/atom:entry" />
<footer>
- <small><p>Made with ❤ by Mayx</p></small>
+ <small><p>Made with ❤ by Mayx</p></small>
</footer>
+ </div>
</body>
</html>
</xsl:template>
+ <xsl:template match="atom:feed/atom:entry">
+ <div class="item">
+ <h3>
+ <a>
+ <xsl:attribute name="href">
+ <xsl:value-of select="atom:link/@href"/>
+ </xsl:attribute>
+ <xsl:value-of select="atom:title"/>
+ </a>
+ </h3>
+ <small class="gray">
+ Published at <xsl:value-of select="substring(atom:published, 0, 11)" />
+ </small>
+ <p><xsl:value-of select="atom:summary"/></p>
+ </div>
+ </xsl:template>
</xsl:stylesheet> \ No newline at end of file