Add standalone AI/ML RSS feed viewer to custom public pages
Created a new file at /custom/public/rss.html that displays RSS feeds from major AI/ML sources, including OpenAI, DeepMind, Google AI Blog, AI Weekly, and Machine Learning Mastery. This viewer uses JavaScript with the rss2json.com API to fetch and render the latest five articles per feed. Styling matches CodexScrolls’ dark aesthetic, with responsive layout and clean separation per source. This page is accessible via https://codexscrolls.io/rss and can be expanded in the future to support feed filtering, tag-based navigation, or a self-hosted parser to remove reliance on third-party services.
This commit is contained in:
parent
53a17e6820
commit
3aff306893
|
@ -0,0 +1,98 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AI/ML Feeds – CodexScrolls</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<style>
|
||||
body {
|
||||
background: #0d0d0d;
|
||||
color: #e0e0e0;
|
||||
font-family: "Inter", sans-serif;
|
||||
margin: 2em;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #4c6fff;
|
||||
font-size: 2em;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
.feed-section {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #76a8ff;
|
||||
margin-bottom: 0.5em;
|
||||
border-bottom: 1px solid #222;
|
||||
padding-bottom: 0.3em;
|
||||
}
|
||||
|
||||
ul.feed-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
ul.feed-list li {
|
||||
margin: 0.4em 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #a2c5ff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #ff4c4c;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h1>AI/ML News Feeds</h1>
|
||||
|
||||
<div id="feeds-container"></div>
|
||||
|
||||
<script>
|
||||
const feeds = [
|
||||
{ title: "OpenAI", url: "https://openai.com/blog/rss" },
|
||||
{ title: "Google AI Blog", url: "https://ai.googleblog.com/feeds/posts/default" },
|
||||
{ title: "DeepMind", url: "https://www.deepmind.com/blog/rss.xml" },
|
||||
{ title: "AI Weekly", url: "https://aiweekly.co/feed" },
|
||||
{ title: "Machine Learning Mastery", url: "https://machinelearningmastery.com/blog/feed/" }
|
||||
];
|
||||
|
||||
const container = document.getElementById('feeds-container');
|
||||
|
||||
feeds.forEach(feed => {
|
||||
const section = document.createElement('div');
|
||||
section.className = 'feed-section';
|
||||
section.innerHTML = `<h2>${feed.title}</h2><ul class="feed-list" id="list-${feed.title.replace(/\s+/g, '')}"><li>Loading...</li></ul>`;
|
||||
container.appendChild(section);
|
||||
|
||||
fetch(`https://api.rss2json.com/v1/api.json?rss_url=${encodeURIComponent(feed.url)}`)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
const list = document.getElementById(`list-${feed.title.replace(/\s+/g, '')}`);
|
||||
list.innerHTML = '';
|
||||
data.items.slice(0, 5).forEach(item => {
|
||||
const li = document.createElement('li');
|
||||
li.innerHTML = `<a href="${item.link}" target="_blank">${item.title}</a>`;
|
||||
list.appendChild(li);
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
const list = document.getElementById(`list-${feed.title.replace(/\s+/g, '')}`);
|
||||
list.innerHTML = `<li class="error">Failed to load feed.</li>`;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue