2022-05-05 14:19:44 -04:00
<?xml version="1.0" encoding="utf-8"?>
<!--
# Pretty Feed
Styles an RSS/Atom feed, making it friendly for humans viewers, and adds a link
to aboutfeeds.com for new user onboarding. See it in action:
https://interconnected.org/home/feed
## How to use
1. Download this XML stylesheet from the following URL and host it on your own
domain (this is a limitation of XSL in browsers):
https://github.com/genmon/aboutfeeds/blob/main/tools/pretty-feed-v3.xsl
2. Include the XSL at the top of the RSS/Atom feed, like:
```
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="/PATH-TO-YOUR-STYLES/pretty-feed-v3.xsl" type="text/xsl"?>
```
3. Serve the feed with the following HTTP headers:
```
Content-Type: application/xml; charset=utf-8 # not application/rss+xml
x-content-type-options: nosniff
```
(These headers are required to style feeds for users with Safari on iOS/Mac.)
## Limitations
- Styling the feed *prevents* the browser from automatically opening a
newsreader application. This is a trade off, but it's a benefit to new users
who won't have a newsreader installed, and they are saved from seeing or
downloaded obscure XML content. For existing newsreader users, they will know
to copy-and-paste the feed URL, and they get the benefit of an in-browser feed
preview.
- Feed styling, for all browsers, is only available to site owners who control
their own platform. The need to add both XML and HTTP headers makes this a
limited solution.
## Credits
pretty-feed is based on work by lepture.com:
https://lepture.com/en/2019/rss-style-with-xsl
This current version is maintained by aboutfeeds.com:
https://github.com/genmon/aboutfeeds
This theme has been slightly modified by Brandon Rozek
## Feedback
This file is in BETA. Please test and contribute to the discussion:
https://github.com/genmon/aboutfeeds/issues/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 >
2022-05-05 20:44:48 -04:00
<title > <xsl:value-of select= "/rss/channel/title" /> RSS Feed</title>
2022-05-05 14:19:44 -04:00
<meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" />
<meta name= "viewport" content= "width=device-width, initial-scale=1, maximum-scale=1" />
2022-05-05 20:44:48 -04:00
<style type= "text/css" > /*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}[hidden],template{display:none!important}a{background-color:transparent}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}*{box-sizing:border-box}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:14px;line-height:1.5;color:#24292e;background-color:#fff}a{color:#0366d6;text-decoration:none}a:hover{text-decoration:underline}b,strong{font-weight:600}.rule,hr{height:0;margin:15px 0;overflow:hidden;background:0 0;border:0;border-bottom:1px solid #dfe2e5}.rule::before,hr::before{display:table;content:""}.rule::after,hr::after{display:table;clear:both;content:""}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}button{cursor:pointer;border-radius:0}[hidden][hidden]{display:none!important}details summary{cursor:pointer}details:not([open])>* :not(summary){display:none!important}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0}h1{font-size:32px;font-weight:600}h2{font-size:24px;font-weight:600}h3{font-size:20px;font-weight:600}h4{font-size:16px;font-weight:600}h5{font-size:14px;font-weight:600}h6{font-size:12px;font-weight:600}p{margin-top:0;margin-bottom:10px}small{font-size:90%}blockquote{margin:0}ol,ul{padding-left:0;margin-top:0;margin-bottom:0}ol ol,ul ol{list-style-type:lower-roman}ol ol ol,ol ul ol,ul ol ol,ul ul ol{list-style-type:lower-alpha}dd{margin-left:0}code,tt{font-family:SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:12px}pre{margin-top:0;margin-bottom:0;font-family:SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:12px}.octicon{vertical-align:text-bottom}.anim-fade-in{animation-name:fade-in;animation-duration:1s;animation-timing-function:ease-in-out}.anim-fade-in.fast{animation-duration:.3s}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}.anim-fade-out{animatio
2022-05-05 14:19:44 -04:00
</head>
<body class= "bg-white" >
<nav class= "container-md px-3 py-2 mt-2 mt-md-5 mb-5 markdown-body" >
2022-05-05 20:44:48 -04:00
<p class= "bg-blue-light bd-blue-left bd-round ml-n1 mb-1" >
2022-05-05 14:19:44 -04:00
<strong > This is a web feed,</strong> also known as an RSS feed. <strong > Subscribe</strong> by copying the URL from the address bar into your newsreader.
</p>
<p class= "text-gray" >
Visit <a href= "https://aboutfeeds.com" > About Feeds</a> to get started with newsreaders and subscribing. It’
</p>
</nav>
<div class= "container-md px-3 py-3 markdown-body" >
<header class= "py-5" >
<div class= "head inner" >
<xsl:if test= "/rss/channel/image" >
<a class= "head_logo" >
<xsl:attribute name= "href" >
<xsl:value-of select= "/rss/channel/link" />
</xsl:attribute>
<img >
<xsl:attribute name= "src" >
2023-01-20 12:32:11 -05:00
<xsl:value-of select= "/rss/channel/image/url" />
2022-05-05 14:19:44 -04:00
</xsl:attribute>
<xsl:attribute name= "title" >
<xsl:value-of select= "/rss/channel/title" />
</xsl:attribute>
</img>
</a>
</xsl:if>
<div class= "head_main" >
<h1 > <xsl:value-of select= "/rss/channel/title" /> </h1>
<p > <xsl:value-of select= "/rss/channel/description" /> </p>
<a class= "head_link" target= "_blank" >
<xsl:attribute name= "href" >
<xsl:value-of select= "/rss/channel/link" />
</xsl:attribute>
Visit Website →
</a>
</div>
</div>
</header>
<h2 > Recent Items</h2>
<xsl:for-each select= "/rss/channel/item" >
<div class= "pb-5" >
<h3 class= "mb-0" >
<a target= "_blank" >
<xsl:attribute name= "href" >
<xsl:value-of select= "link" />
</xsl:attribute>
<xsl:value-of select= "title" />
</a>
</h3>
<small class= "text-gray" >
Published: <xsl:value-of select= "pubDate" />
</small>
</div>
</xsl:for-each>
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
