feat: add RSS icon

JoseRFelix · Dec 6, 2021 · b01937f · b01937f · vercel · Dec 6, 2021
1 parent 7e9b059
commit b01937f
Show file tree

Hide file tree

Showing 12 changed files with 1,348 additions and 22 deletions.
diff --git a/assets/base.css → assets/css/base.css b/assets/base.css → assets/css/base.css
diff --git a/assets/components.css → assets/css/components.css b/assets/components.css → assets/css/components.css
diff --git a/assets/main.css → assets/css/main.css b/assets/main.css → assets/css/main.css
diff --git a/assets/svg/rss.svg b/assets/svg/rss.svg
diff --git a/components/common/Layout/Layout.js b/components/common/Layout/Layout.js
@@ -4,6 +4,9 @@ import Link from "next/link";
 import { useRouter } from "next/router";
 import { DarkModeSwitch } from "react-toggle-dark-mode";
 import { useTheme } from "next-themes";
+import Image from "next/image";
+
+import RSSIcon from "@assets/svg/rss.svg";
 
 export function Layout({ children }) {
   return (
@@ -49,11 +52,14 @@ const Header = () => {
         {isRoot ? <LargeTitle /> : <SmallTitle />}
       </div>
       {mounted && (
-        <DarkModeSwitch
-          checked={isDarkMode}
-          onChange={toggleDarkMode}
-          className={isRoot ? 28 : 24}
-        />
+        <div className="flex space-x-4">
+          <DarkModeSwitch checked={isDarkMode} onChange={toggleDarkMode} />
+          <Link href="/rss.xml" passHref>
+            <a target="__blank" rel="noreferrer noopener">
+              <RSSIcon className={isDarkMode ? "text-white" : "text-black"} />
+            </a>
+          </Link>
+        </div>
       )}
     </header>
   );

diff --git a/config/seo.json b/config/seo.json
@@ -7,7 +7,7 @@
       "link": "https://jfelix.info"
     },
     "description": "A blog created with Next.js and Tailwind.css",
-    "siteUrl": "https://nextjs-starter-blog-demo.netlify.app/",
+    "siteUrl": "https://nextjs-starter-blog-new-demo.vercel.app/",
     "language": "en-US",
     "social": {
       "twitter": "Jose_R_Felix"

diff --git a/next.config.js b/next.config.js
@@ -0,0 +1,10 @@
+module.exports = {
+  webpack(config) {
+    config.module.rules.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    });
+
+    return config;
+  },
+};
diff --git a/package.json b/package.json
@@ -12,6 +12,7 @@
     "start": "next start"
   },
   "dependencies": {
+    "@svgr/webpack": "^6.1.1",
     "clsx": "^1.1.1",
     "feed": "^4.2.2",
     "next": "12.0.7",

diff --git a/pages/_app.js b/pages/_app.js
@@ -1,6 +1,6 @@
 import { ThemeProvider } from "next-themes";
 
-import "@assets/main.css";
+import "@assets/css/main.css";
 
 import "typeface-open-sans";
 import "typeface-merriweather";

diff --git a/public/rss.xml b/public/rss.xml
@@ -2,16 +2,16 @@
 <rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/">
     <channel>
         <title>Next.js Starter Blog</title>
-        <link>https://nextjs-starter-blog-demo.netlify.app/</link>
+        <link>https://nextjs-starter-blog-new-demo.vercel.app/</link>
         <description>undefined</description>
-        <lastBuildDate>Mon, 06 Dec 2021 19:06:22 GMT</lastBuildDate>
+        <lastBuildDate>Mon, 06 Dec 2021 19:32:09 GMT</lastBuildDate>
         <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
         <generator>https://github.com/jpmonette/feed</generator>
         <language>en-US</language>
         <copyright>Copyright © 2021 Jose Felix</copyright>
         <item>
             <title><![CDATA[Long Post]]></title>
-            <link>https://nextjs-starter-blog-demo.netlify.app//posts/long-post</link>
+            <link>https://nextjs-starter-blog-new-demo.vercel.app/posts/long-post</link>
             <guid>long-post</guid>
             <pubDate>Tue, 28 Jul 2020 04:00:00 GMT</pubDate>
             <description><![CDATA[Who doesn't like a long post showcasing the different headings?]]></description>
@@ -121,7 +121,7 @@ for their projects again and again.]]></content:encoded>
         </item>
         <item>
             <title><![CDATA[Coding Post]]></title>
-            <link>https://nextjs-starter-blog-demo.netlify.app//posts/coding-post</link>
+            <link>https://nextjs-starter-blog-new-demo.vercel.app/posts/coding-post</link>
             <guid>coding-post</guid>
             <pubDate>Sun, 19 Apr 2020 04:00:00 GMT</pubDate>
             <description><![CDATA[Coding is such a blissful activity.]]></description>
@@ -137,7 +137,7 @@ export default CoolComponent;
         </item>
         <item>
             <title><![CDATA[Second post]]></title>
-            <link>https://nextjs-starter-blog-demo.netlify.app//posts/second-post</link>
+            <link>https://nextjs-starter-blog-new-demo.vercel.app/posts/second-post</link>
             <guid>second-post</guid>
             <pubDate>Fri, 17 Apr 2020 04:00:00 GMT</pubDate>
             <description><![CDATA[The second post is the least memorable.]]></description>
@@ -153,7 +153,7 @@ Normal text
         </item>
         <item>
             <title><![CDATA[First post]]></title>
-            <link>https://nextjs-starter-blog-demo.netlify.app//posts/first-post</link>
+            <link>https://nextjs-starter-blog-new-demo.vercel.app/posts/first-post</link>
             <guid>first-post</guid>
             <pubDate>Thu, 16 Apr 2020 04:00:00 GMT</pubDate>
             <description><![CDATA[The first post is the most memorable one.]]></description>

diff --git a/utils/rss.js b/utils/rss.js
@@ -31,7 +31,7 @@ export function generateRssPostsFeed() {
         description,
         date: new Date(date),
         id: slug,
-        link: `${siteUrl}/posts/${slug}`,
+        link: `${siteUrl}posts/${slug}`,
         content: content,
       });
     }