feat(rss feed): made xslt feed modular and added custom feeds

facebook · Sep 3, 2023 · 3b02024 · 3b02024
1 parent 25dff7b
commit 3b02024
Show file tree

Hide file tree

Showing 18 changed files with 2,250 additions and 298 deletions.
diff --git a/.cspell.json b/.cspell.json
@@ -31,6 +31,7 @@
     "website/docusaurus.config.localized.json",
     "*.xyz",
     "*.docx",
+    "*.xslt",
     "*.gitignore",
     "versioned_docs",
     "*.min.*",

diff --git a/packages/docusaurus-plugin-content-blog/assets/atom-feed.stylesheet.css b/packages/docusaurus-plugin-content-blog/assets/atom-feed.stylesheet.css
@@ -0,0 +1,72 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+main {
+  flex: 1 0 auto;
+  width: 100%;
+  margin: 4rem auto;
+  padding: 1.5 rem;
+  max-width: 800px;
+  /* stylelint-disable-next-line font-family-name-quotes */
+  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell;
+}
+
+.info {
+  display: block;
+  margin: 3rem 0;
+  padding: 2rem 3rem;
+  border: 1px solid dodgerblue;
+  border-left-width: 0.5rem;
+  border-radius: 0.4rem;
+  background-color: #edf5ff;
+}
+
+.rss-icon {
+  height: 3.8rem;
+  width: 3.8rem;
+  margin-right: 1rem;
+}
+
+.flex {
+  display: flex;
+}
+
+.items-start {
+  align-items: flex-start;
+}
+
+.pb-7 {
+  padding-bottom: 3rem;
+}
+
+a {
+  color: #005aff;
+  text-decoration: none;
+}
+
+h1 {
+  text-wrap: balance;
+  font-size: 3.8rem;
+  line-height: 1;
+  font-weight: 800;
+  margin-bottom: 4rem;
+}
+
+h2 {
+  font-size: 3rem;
+  line-height: 1.2;
+  font-weight: 700;
+  margin-bottom: 3rem;
+}
+
+h2:not(:first-child) {
+  margin-top: 5.8rem;
+}
+
+.italic {
+  font-style: italic;
+}
diff --git a/packages/docusaurus-plugin-content-blog/assets/atom-feed.xslt b/packages/docusaurus-plugin-content-blog/assets/atom-feed.xslt
@@ -0,0 +1,65 @@
+<?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" />
+
+  <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>
+        <link rel="stylesheet" href="atom-feed.stylesheet.css" />
+      </head>
+      <body>
+        <main>
+          <div class="description">
+            <div class="info">
+              <strong>This is an Atom feed</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. </div>
+            <h1 class="flex items-start">
+              <div class="rss-icon">
+                <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg"
+                  xmlns:xlink="http://www.w3.org/1999/xlink"
+                  viewBox="0 0 455.731 455.731" xml:space="preserve">
+                  <g>
+                    <rect x="0" y="0" style="fill:#F78422;" width="455.731" height="455.731"/>
+                    <g>
+                      <path style="fill:#FFFFFF;" d="M296.208,159.16C234.445,97.397,152.266,63.382,64.81,63.382v64.348
+                        c70.268,0,136.288,27.321,185.898,76.931c49.609,49.61,76.931,115.63,76.931,185.898h64.348
+                        C391.986,303.103,357.971,220.923,296.208,159.16z"/>
+                      <path style="fill:#FFFFFF;" d="M64.143,172.273v64.348c84.881,0,153.938,69.056,153.938,153.939h64.348
+                        C282.429,270.196,184.507,172.273,64.143,172.273z"/>
+                      <circle style="fill:#FFFFFF;" cx="109.833" cy="346.26" r="46.088"/>
+                    </g>
+                  </g>
+                </svg>
+              </div>
+  Atom Feed Preview </h1>
+            <h2>
+              <xsl:value-of select="atom:feed/atom:title" />
+            </h2>
+            <p>Description: <xsl:value-of select="atom:feed/atom:subtitle" /></p>
+          </div>
+          <h2>Recent Posts</h2>
+          <div class="postsList">
+            <xsl:for-each select="atom:feed/atom:entry">
+              <div class="pb-7">
+                <a href="{atom:link[@rel='alternate']/@href}">
+                  <xsl:value-of select="atom:title" />
+                </a>
+                <div class="text-2 text-offset"> Published on <xsl:value-of
+                    select="substring(atom:updated, 0, 17)" />
+                </div>
+                <div class="text-2 text-offset italic">
+                  <xsl:value-of select="atom:summary" />
+                </div>
+              </div>
+            </xsl:for-each>
+          </div>
+        </main>
+      </body>
+    </html>
+  </xsl:template>
+
+</xsl:stylesheet>
diff --git a/packages/docusaurus-plugin-content-blog/assets/rss-feed.stylesheet.css b/packages/docusaurus-plugin-content-blog/assets/rss-feed.stylesheet.css
@@ -0,0 +1,72 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+main {
+  flex: 1 0 auto;
+  width: 100%;
+  margin: 4rem auto;
+  padding: 1.5 rem;
+  max-width: 800px;
+  /* stylelint-disable-next-line font-family-name-quotes */
+  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell;
+}
+
+.info {
+  display: block;
+  margin: 3rem 0;
+  padding: 2rem 3rem;
+  border: 1px solid dodgerblue;
+  border-left-width: 0.5rem;
+  border-radius: 0.4rem;
+  background-color: #edf5ff;
+}
+
+.rss-icon {
+  height: 3.8rem;
+  width: 3.8rem;
+  margin-right: 1rem;
+}
+
+.flex {
+  display: flex;
+}
+
+.items-start {
+  align-items: flex-start;
+}
+
+.pb-7 {
+  padding-bottom: 3rem;
+}
+
+a {
+  color: #005aff;
+  text-decoration: none;
+}
+
+h1 {
+  text-wrap: balance;
+  font-size: 3.8rem;
+  line-height: 1;
+  font-weight: 800;
+  margin-bottom: 4rem;
+}
+
+h2 {
+  font-size: 3rem;
+  line-height: 1.2;
+  font-weight: 700;
+  margin-bottom: 3rem;
+}
+
+h2:not(:first-child) {
+  margin-top: 5.8rem;
+}
+
+.italic {
+  font-style: italic;
+}
diff --git a/packages/docusaurus-plugin-content-blog/assets/rss-feed.xslt b/packages/docusaurus-plugin-content-blog/assets/rss-feed.xslt
@@ -0,0 +1,66 @@
+<?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" />
+
+<xsl:template match="/">
+    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
+      <head>
+        <title>RSS Feed | <xsl:value-of select="rss/channel/title" /></title>
+        <link rel="stylesheet" href="rss-feed.stylesheet.css" />
+      </head>
+      <body>
+        <main>
+          <div class="description">
+            <div class="info">
+              <strong>This is an RSS feed</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. </div>
+            <h1 class="flex items-start">
+              <div class="rss-icon">
+                <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg"
+                  xmlns:xlink="http://www.w3.org/1999/xlink"
+                  viewBox="0 0 455.731 455.731" xml:space="preserve">
+<g>
+	<rect x="0" y="0" style="fill:#F78422;" width="455.731" height="455.731"/>
+	<g>
+		<path style="fill:#FFFFFF;" d="M296.208,159.16C234.445,97.397,152.266,63.382,64.81,63.382v64.348
+			c70.268,0,136.288,27.321,185.898,76.931c49.609,49.61,76.931,115.63,76.931,185.898h64.348
+			C391.986,303.103,357.971,220.923,296.208,159.16z"/>
+		<path style="fill:#FFFFFF;" d="M64.143,172.273v64.348c84.881,0,153.938,69.056,153.938,153.939h64.348
+			C282.429,270.196,184.507,172.273,64.143,172.273z"/>
+		<circle style="fill:#FFFFFF;" cx="109.833" cy="346.26" r="46.088"/>
+	</g>
+</g>
+</svg>
+              </div>
+  RSS Feed Preview </h1>
+            <h2>
+              <xsl:value-of select="rss/channel/title" />
+            </h2>
+            <p>Description: <xsl:value-of select="rss/channel/description" /></p>
+          </div>
+          <h2>Recent Posts</h2>
+          <div class="postsList">
+            <xsl:for-each select="rss/channel/item">
+              <div class="pb-7">
+                <a href="{link}">
+                  <xsl:value-of select="title" />
+                </a>
+                <div class="text-2 text-offset"> Published on <xsl:value-of
+                    select="substring(pubDate,0,17)" />
+                </div>
+                <div class="text-2 text-offset italic">
+                  <xsl:value-of
+                    select="description" />
+                </div>
+              </div>
+            </xsl:for-each>
+          </div>
+        </main>
+      </body>
+    </html>
+  </xsl:template>
+
+</xsl:stylesheet>
diff --git a/...n-content-blog/src/__tests__/__fixtures__/website/build-snap/blog/rss-feed.stylesheet.css b/...n-content-blog/src/__tests__/__fixtures__/website/build-snap/blog/rss-feed.stylesheet.css