Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(blog): add feed XSLT options to render beautiful RSS and Atom feeds #9252

Merged
merged 41 commits into from
Aug 2, 2024
Merged
Show file tree
Hide file tree
Changes from 21 commits
Commits
Show all changes
41 commits
Select commit Hold shift + click to select a range
b62999a
feat(rss feed): added xslt for rss feed
Xebec19 Aug 23, 2023
a67a71f
Merge branch 'facebook:main' into main
Xebec19 Aug 25, 2023
25dff7b
Merge branch 'facebook:main' into main
Xebec19 Sep 3, 2023
3b02024
feat(rss feed): made xslt feed modular and added custom feeds
Xebec19 Sep 3, 2023
e5e066a
type
OzakIOne Jul 24, 2024
d9a69b7
await
OzakIOne Jul 24, 2024
034bb82
object params
OzakIOne Jul 24, 2024
3745125
refactor options, refactor build / assets
OzakIOne Jul 25, 2024
1daded2
refactor assets location
OzakIOne Jul 25, 2024
c79902b
more refactor
OzakIOne Jul 25, 2024
5454916
refactor
OzakIOne Jul 25, 2024
64538d5
Merge branch 'main' into Xebec19/main
OzakIOne Jul 26, 2024
e611d06
fix tests
OzakIOne Jul 26, 2024
76d198b
fix custom test
OzakIOne Jul 26, 2024
d59b38c
fix test
OzakIOne Jul 26, 2024
268906a
fix test
OzakIOne Jul 26, 2024
be1f67c
feat: refactor in switch
OzakIOne Jul 29, 2024
1f65318
format & dogfood
OzakIOne Jul 29, 2024
1653ed2
remove unused file
OzakIOne Jul 29, 2024
7096aff
refactor options to object
OzakIOne Jul 30, 2024
dcc797f
fix tests
OzakIOne Jul 30, 2024
298dd54
Merge branch 'main' into Xebec19/main
slorber Aug 1, 2024
b25cb9f
rename XslParams to FeedXSLTOptions
slorber Aug 1, 2024
2500197
type problem
slorber Aug 1, 2024
66f5b11
add proper feed xslt options + unit tests
slorber Aug 2, 2024
06a7b21
Merge branch 'main' into Xebec19/main
slorber Aug 2, 2024
d46a073
fix blog feed tests
slorber Aug 2, 2024
f2e0629
Add xslt options to init templates
slorber Aug 2, 2024
952da63
move xsl assets around
slorber Aug 2, 2024
988214d
use .xsl extension (more common) instead of .xslt
slorber Aug 2, 2024
6092f1d
use .xsl extension (more common) instead of .xslt
slorber Aug 2, 2024
5f1dc94
use .xsl extension (more common) instead of .xslt
slorber Aug 2, 2024
81e80fd
refactor feed xslt impl
slorber Aug 2, 2024
03647e2
capture blog tree snapshot
slorber Aug 2, 2024
7d2c181
add extra comment + missing build snap files
slorber Aug 2, 2024
d1a99ab
cspell ignore .xsl
slorber Aug 2, 2024
8c9e374
add xslt to project words
slorber Aug 2, 2024
c421e3b
fix bad spelling
slorber Aug 2, 2024
cbb91f9
Polish Blog feed default XSL/CSS
slorber Aug 2, 2024
221e695
add docs for FeedXSLTOptions
slorber Aug 2, 2024
3e55314
update test snapshots
slorber Aug 2, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .cspell.json
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@
"website/_dogfooding/_pages tests/diagrams.mdx",
"*.xyz",
"*.docx",
"*.xslt",
"*.gitignore",
"versioned_docs",
"*.min.*",
Expand Down
76 changes: 76 additions & 0 deletions packages/docusaurus-plugin-content-blog/assets/atom.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
/**
* 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.
*/

* {
color: #0d1137;
}

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;
}
65 changes: 65 additions & 0 deletions packages/docusaurus-plugin-content-blog/assets/atom.xslt
Original file line number Diff line number Diff line change
@@ -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.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>
72 changes: 72 additions & 0 deletions packages/docusaurus-plugin-content-blog/assets/rss.css
Original file line number Diff line number Diff line change
@@ -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;
}
66 changes: 66 additions & 0 deletions packages/docusaurus-plugin-content-blog/assets/rss.xslt
Original file line number Diff line number Diff line change
@@ -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.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>

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading