Updated code after code review

README.md

@@ -72,7 +72,6 @@
 ✓ [Education Section](#education)  
 ✓ [Projects Section](#projects)  
 ✓ [Blog Posts Section](#blog-posts)  
-✓ [Custom footer](#custom-footer)
 
 To view a live example, **[click here](https://arifszn.github.io/gitprofile)**.
 
@@ -290,6 +289,17 @@ const config = {
     username: 'arifszn', // to hide blog section, keep it empty
     limit: 5, // How many posts to display. Max is 10.
   },
+  // Display a footer. Supports plain text or HTML. (Optional)
+  footer: {
+    `<p class="font-mono text-sm">
+      Made with <a
+        class="text-primary"
+        href="https://github.com/arifszn/gitprofile"
+        target="_blank"
+        rel="noreferrer"
+      >GitProfile</a>
+      and ❤️</p>`
+  },
   googleAnalytics: {
     id: '', // GA3 tracking id/GA4 tag id UA-XXXXXXXXX-X | G-XXXXXXXXXX
   },
@@ -618,48 +628,6 @@ const config = {
 
 The posts are fetched by [blog.js](https://github.com/arifszn/blog.js).
 
-
-### Custom footer (Optional)
-In the configuration file you can optionally 
-define a custom HTML footer for your page.
-
-If it's not defined, a default footer "Made with GitProfile and ❤️" will be used instead.
-   
-Examples:
-```js
-// gitprofile.config.js
-
-// This is an HTML footer
-const config = {
-  [...]
-  footer: `
-    <p class="font-mono text-sm">
-      Built by <a href="https://www.example.com" class="text-primary" target="_blank" rel="noreferrer">
-        John Doe
-      </a>
-      in <strong>2023</strong>
-      with ❤️ and 
-      <a
-        class="text-primary"
-        href="https://github.com/arifszn/gitprofile"
-        target="_blank"
-        rel="noreferrer"
-      >GitProfile</a>
-    </p>
-    `,
-```
-or:
-
-```js
-// gitprofile.config.js
-
-// This is a plain text footer
-const config = {
-  [...]
-  footer: 'Copyright 2002, John Doe'
-```
-
-
 ## 💖 Support
 
 <p>You can show your support by starring this project. ★</p>

gitprofile.config.js

@@ -83,10 +83,15 @@ const config = {
     },
   ],
 
-  // Optional custom footer. See README file, section "custom-footer", for details
-  /*
-  footer: '[...]',
-  */
+  // Optional custom footer
+  footer: `<p class="font-mono text-sm">
+    Made with <a
+      class="text-primary"
+      href="https://github.com/arifszn/gitprofile"
+      target="_blank"
+      rel="noreferrer"
+    >GitProfile</a> and ❤️
+    </p>`,
   // To hide the `My Projects` section, keep it empty.
   externalProjects: [
     {

src/components/footer/index.jsx

@@ -2,33 +2,16 @@ import PropTypes from 'prop-types';
 
 import { skeleton } from '../../helpers/utils';
 
-const DefaultFooter = () => {
-  return (
-    <a
-      href="https://github.com/arifszn/gitprofile"
-      target="_blank"
-      rel="noreferrer"
-    >
-      <div>
-        <p className="font-mono text-sm">
-          Made with <span className="text-primary">GitProfile</span> and ❤️
-        </p>
-      </div>
-    </a>
-  );
-};
-
 const Footer = ({ content, loading }) => {
-  let footerContent = null;
-  if (content) {
-    footerContent = <div dangerouslySetInnerHTML={{ __html: content }} />;
-  } else {
-    footerContent = <DefaultFooter />;
-  }
+  if (!content) return null;
 
   return (
     <div className="card-body">
-      {loading ? skeleton({ width: 'w-52', height: 'h-6' }) : footerContent}
+      {loading ? (
+        skeleton({ width: 'w-52', height: 'h-6' })
+      ) : (
+        <div dangerouslySetInnerHTML={{ __html: content }} />
+      )}
     </div>
   );
 };