andrlik/feed.css

## feed.css
body {max-width: 960px;margin: 0 auto;padding: 24px 12px 48px 12px;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;color: #ffffff;background-color: #333333;background-attachment: fixed;background-size: cover;font-family: "PT Sans", 'Source Sans Pro', 'Verdana', sans-serif}.head {display: flex;flex: wrap;align-items: center;justify-content: start;margin-bottom: 48px; color: #242121;}.avatar {padding-right: 20px;}.description {flex-grow: 1;padding-left: 20px;border-left: 1px solid #E6E6E6; color: #ffffff;}.description a {color: #ffffff;}main { background-color: #ffffff; color: #242121; padding:4px 20px; border-radius:10px;}article {padding-bottom: 20px;border-bottom: 2px solid #E6E6E6;}h2 {margin-bottom: 36px;}h3 {font-size: 22px;} a { color: #D9411E;}footer {font-size: 16px;}.rss-logo {width: 30px;height: 30px;padding-right: 8px;}.aboutfeeds {font-size: 16px;background-color: #F5F5F5;margin: 20px 0 40px 0;padding: 4px 20px;color: #242121; border-radius:10px;}.about {margin-top: 40px;font-size: 16px;color: #242121;}.about img {padding-right: 8px;vertical-align: middle;}

## feed.xls
<?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" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd">
  <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
  <xsl:template match="/">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title><xsl:value-of select="feed/title"/> RSS Feed</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
        <meta charset="UTF-8"/>
        <link rel="stylesheet" href="/theme/stylesheet/fontcss.css"/>
        <link rel="stylesheet" href="/theme/stylesheet/feed.css"/>
      </head>
      <body>
        <header>
          <h1><svg class="rss-logo" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 256 256"><defs><linearGradient x1=".085" y1=".085" x2=".915" y2=".915" id="a"><stop offset="0" stop-color="#E3702D"/><stop offset=".107" stop-color="#EA7D31"/><stop offset=".35" stop-color="#F69537"/><stop offset=".5" stop-color="#FB9E3A"/><stop offset=".702" stop-color="#EA7C31"/><stop offset=".887" stop-color="#DE642B"/><stop offset="1" stop-color="#D95B29"/></linearGradient></defs><rect width="256" height="256" rx="55" ry="55" 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(#a)"/><circle cx="68" cy="189" r="24" fill="#FFF"/><path d="M160 213h-34a82 82 0 0 0-82-82V97a116 116 0 0 1 116 116z" fill="#FFF"/><path d="M184 213A140 140 0 0 0 44 73V38a175 175 0 0 1 175 175z" fill="#FFF"/></svg><xsl:value-of select="atom:feed/atom:title"/></h1>
          <div class="aboutfeeds">
            <p>This is a web feed, also known as an RSS feed. To know more read <a href="https://aboutfeeds.com/" target="_blank"><strong>About Feeds</strong> <small>↗︎</small></a> by Matt Webb.</p>
            <p><big>↘️ <strong>Subscribe</strong> by copying the URL into your RSS reader.</big></p>
          </div>
          <div class="head">
            <div class="avatar">
              <img src="/images/IMG_0002.jpg" height="100" width="100" alt="Avatar of Daniel Andrlik"/>
            </div>
            <div class="description">
              <p><xsl:value-of select="atom:feed/atom:subtitle"/></p>
              <p><a hreflang="en"><xsl:attribute name="href"><xsl:value-of select="atom:feed/atom:link/attribute::href"/></xsl:attribute>Visit Website &#x2192;</a></p>
            </div>
          </div>
        </header>
        <main>
        <p class="about"><img src="/favicon.png" alt="Ministry of Intrigue icon" width="24" height="24"/><a href="https://www.andrlik.org/about/">About Daniel Andrlik</a>.</p>
          <h2>📄 Recent Posts</h2>
          <xsl:for-each select="atom:feed/atom:entry">
            <article>
              <h3><a hreflang="en"><xsl:attribute name="href"><xsl:value-of select="atom:link/attribute::href"/></xsl:attribute><xsl:value-of select="atom:title"/></a></h3>
              <footer>Published: <time><xsl:value-of select="atom:published" /></time></footer>
            </article>
          </xsl:for-each>
        </main>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>
	<?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" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd">
	<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
	<xsl:template match="/">
	<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<title><xsl:value-of select="feed/title"/> RSS Feed</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta charset="UTF-8"/>
	<link rel="stylesheet" href="/theme/stylesheet/fontcss.css"/>
	<link rel="stylesheet" href="/theme/stylesheet/feed.css"/>
	</head>
	<body>
	<header>
	<h1><svg class="rss-logo" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 256 256"><defs><linearGradient x1=".085" y1=".085" x2=".915" y2=".915" id="a"><stop offset="0" stop-color="#E3702D"/><stop offset=".107" stop-color="#EA7D31"/><stop offset=".35" stop-color="#F69537"/><stop offset=".5" stop-color="#FB9E3A"/><stop offset=".702" stop-color="#EA7C31"/><stop offset=".887" stop-color="#DE642B"/><stop offset="1" stop-color="#D95B29"/></linearGradient></defs><rect width="256" height="256" rx="55" ry="55" 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(#a)"/><circle cx="68" cy="189" r="24" fill="#FFF"/><path d="M160 213h-34a82 82 0 0 0-82-82V97a116 116 0 0 1 116 116z" fill="#FFF"/><path d="M184 213A140 140 0 0 0 44 73V38a175 175 0 0 1 175 175z" fill="#FFF"/></svg><xsl:value-of select="atom:feed/atom:title"/></h1>
	<div class="aboutfeeds">
	<p>This is a web feed, also known as an RSS feed. To know more read <a href="https://aboutfeeds.com/" target="_blank"><strong>About Feeds</strong> <small>↗︎</small></a> by Matt Webb.</p>
	<p><big>↘️ <strong>Subscribe</strong> by copying the URL into your RSS reader.</big></p>
	</div>
	<div class="head">
	<div class="avatar">
	<img src="/images/IMG_0002.jpg" height="100" width="100" alt="Avatar of Daniel Andrlik"/>
	</div>
	<div class="description">
	<p><xsl:value-of select="atom:feed/atom:subtitle"/></p>
	<p><a hreflang="en"><xsl:attribute name="href"><xsl:value-of select="atom:feed/atom:link/attribute::href"/></xsl:attribute>Visit Website →</a></p>
	</div>
	</div>
	</header>
	<main>
	<p class="about"><img src="/favicon.png" alt="Ministry of Intrigue icon" width="24" height="24"/><a href="https://www.andrlik.org/about/">About Daniel Andrlik</a>.</p>
	<h2>📄 Recent Posts</h2>
	<xsl:for-each select="atom:feed/atom:entry">
	<article>
	<h3><a hreflang="en"><xsl:attribute name="href"><xsl:value-of select="atom:link/attribute::href"/></xsl:attribute><xsl:value-of select="atom:title"/></a></h3>
	<footer>Published: <time><xsl:value-of select="atom:published" /></time></footer>
	</article>
	</xsl:for-each>
	</main>
	</body>
	</html>
	</xsl:template>
	</xsl:stylesheet>