github button

Author: rjewett459

docusaurus.config.js

@@ -38,22 +38,36 @@ module.exports = {
         src: 'img/spid_icon_dark.png',
       },
       items: [
-        {
-          type: 'doc',
-          docId: 'intro',
-          position: 'left',
-          label: 'Docs',
-        },
-        {
-          href: 'https://github.com/SPID-Protocol-project/spidprotocol-docs',
-          label: 'GitHub',
-          position: 'right',
-        },
-        {
-          type: 'search',
-          position: 'right',
-        },
-      ],
+  {
+    type: 'doc',
+    docId: 'intro',
+    position: 'left',
+    label: 'Docs',
+  },
+  {
+  type: 'html',
+  position: 'right',
+  value: `
+    <div style="display: flex; align-items: center; gap: 8px;">
+      <a href="https://github.com/SPID-Protocol-project/spidprotocol-docs" target="_blank" rel="noopener noreferrer">
+        <img src="https://img.shields.io/github/v/release/SPID-Protocol-project/spidprotocol-docs?label=version&color=brightgreen" alt="version" />
+      </a>
+      <a href="https://github.com/SPID-Protocol-project/spidprotocol-docs/stargazers" target="_blank" rel="noopener noreferrer">
+        <img src="https://img.shields.io/github/stars/SPID-Protocol-project/spidprotocol-docs?style=social" alt="stars" />
+      </a>
+      <a href="https://github.com/SPID-Protocol-project/spidprotocol-docs/network/members" target="_blank" rel="noopener noreferrer">
+        <img src="https://img.shields.io/github/forks/SPID-Protocol-project/spidprotocol-docs?style=social" alt="forks" />
+      </a>
+    </div>
+  `,
+},
+
+  {
+    type: 'search',
+    position: 'right',
+  },
+],
+
       style: 'dark',
     },
 

src/pages/index.js

@@ -12,35 +12,6 @@ export default function Home() {
         </div>
       </header>
 
-      {/* GitHub Badge Section */}
-      <div className="github-badge" style={{ margin: '1rem 2rem' }}>
-        <a
-          className="github-link"
-          href="https://github.com/SPID-Protocol-project/spidprotocol-docs"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <svg
-            height="20"
-            viewBox="0 0 16 16"
-            version="1.1"
-            width="20"
-            aria-hidden="true"
-          >
-            <path
-              fill="currentColor"
-              d="M8 0C3.58 0 0 3.58 0 8a8 8 0 005.47 7.59c.4.07.55-.17.55-.38v-1.33C4.13 14.91 3.63 13.91 3.63 13.91c-.36-.91-.88-1.15-.88-1.15-.72-.5.06-.49.06-.49.79.06 1.2.82 1.2.82.71 1.21 1.87.86 2.33.66.07-.52.28-.86.5-1.06-2.67-.3-5.47-1.34-5.47-5.96 0-1.31.47-2.38 1.24-3.22-.13-.3-.54-1.52.12-3.18 0 0 1.01-.32 3.3 1.23a11.5 11.5 0 016 0c2.29-1.55 3.3-1.23 3.3-1.23.66 1.66.25 2.88.12 3.18.77.84 1.24 1.91 1.24 3.22 0 4.63-2.8 5.66-5.47 5.96.29.25.54.74.54 1.49v2.21c0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"
-            />
-          </svg>
-          <span className="github-title" style={{ marginLeft: '8px' }}>SPID Protocol</span>
-        </a>
-        <ul className="github-meta">
-          <li>v0.0.1</li>
-          <li>⭐ 10</li>
-          <li>🍴 2</li>
-        </ul>
-      </div>
-
       <main className={styles.main}>
         <section className={styles.section}>
           <h2>What is SPID?</h2>