Use only one button with link to the atom feed in the nav bar and on the blog posts page. Use the icons without text.

Author: HaudinFlorence

docusaurus.config.ts

@@ -63,15 +63,7 @@ const config: Config = {
     //image: 'img/docusaurus-social-card.jpg',
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     headTags: [
-      {
-        tagName: 'link',
-        attributes: {
-          rel: 'alternate',
-          type: 'application/rss+xml',
-          title: 'RSS Feed',
-          href: '/rss.xml',
-        },
-      },
+
       {
         tagName: 'link',
         attributes: {
@@ -157,19 +149,13 @@ const config: Config = {
           className: "mastodon-icon",
         },
 
-        {
-          to: "rss.xml",
-          title: "RSS",
-          position: "right",
-          target: "_blank",
-          className: "rss-circle-icon",
-        },
+  
         {
           to: "atom.xml",
           title: "Atom",
           position: "right",
           target: "_blank",
-          className: "atom-circle-icon",
+          className: "rss-circle-icon",
         },
       ],
     },

src/components/blog/index.tsx

@@ -2,8 +2,7 @@ import styles from "./styles.module.css";
 import React, { useState } from "react";
 import BlogpostCard from "./BlogpostCard";
 import { blogpostsDetails } from "./blogpostsDetails";
-import RSSOrange from "/img/icons/RSS_orange_with_text.svg";
-import AtomOrange from "/img/icons/Atom_orange_with_text.svg";
+import AtomOrange from "/img/icons/RSSOrange.svg";
 
 export default function BlogsComponent() {
   const numberOfBlogs = blogpostsDetails.length;
@@ -33,11 +32,6 @@ export default function BlogsComponent() {
               <h1 className="padding-none margin-none">
                 Featured Posts by QuantStack Contributors
               </h1>
-            <div style={{padding:"0 10px"}}>
-              <a href={"/rss.xml"}>
-                <RSSOrange width={"42px"} height={"42px"} />
-              </a>
-              </div>
             <div style={{padding:"0 10px"}}>
               <a href={"/atom.xml"}>
                 <AtomOrange width={"42px"} height={"42px"} />

src/css/custom.css

@@ -591,20 +591,32 @@ a.menu__link:active {
 }
 
 .rss-circle-icon:before {
-  background: url(@site/static/img/socialmedias/RSS_with_text.svg);
+  background: url(@site/static/img/socialmedias/RSS.svg);
   content: "";
   display: flex;
   height: 36px;
   width: 36px;
   background-repeat: no-repeat;
 }
 
+.rss-circle-icon-with-text:hover {
+  opacity: 0.6;
+}
+
+.rss-circle-icon-with-text:before {
+  background: url(@site/static/img/socialmedias/RSS_with_text.svg);
+  content: "";
+  display: flex;
+  height: 36px;
+  width: 36px;
+  background-repeat: no-repeat;
+}
 
-.atom-circle-icon:hover {
+.atom-circle-icon-with-text:hover {
   opacity: 0.6;
 }
 
-.atom-circle-icon:before {
+.atom-circle-icon-with-text:before {
   background: url(@site/static/img/socialmedias/Atom_with_text.svg);
   content: "";
   display: flex;

static/atom.xml

@@ -2,7 +2,7 @@
 <feed xmlns="http://www.w3.org/2005/Atom">
     <id>https://quantstack.net/</id>
     <title>Recent blog posts featured by QuantStack team</title>
-    <updated>2025-07-29T21:03:57.890Z</updated>
+    <updated>2025-07-29T21:14:51.498Z</updated>
     <generator>https://github.com/jpmonette/feed</generator>
     <author>
         <name>QuantStack Team</name>

static/atom_all.xml

@@ -2,7 +2,7 @@
 <feed xmlns="http://www.w3.org/2005/Atom">
     <id/>
     <title>All blog posts featured by QuantStack team</title>
-    <updated>2025-07-29T21:03:57.905Z</updated>
+    <updated>2025-07-29T21:14:51.503Z</updated>
     <generator>https://github.com/jpmonette/feed</generator>
     <subtitle>Atom feed for QuantStack website blog page</subtitle>
     <entry>