YNU-560: Add Whitepaper link to the docs

docusaurus.config.ts

@@ -1,5 +1,5 @@
-import {themes as prismThemes} from 'prism-react-renderer';
-import type {Config} from '@docusaurus/types';
+import { themes as prismThemes } from 'prism-react-renderer';
+import type { Config } from '@docusaurus/types';
 import type * as Preset from '@docusaurus/preset-classic';
 
 // This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
@@ -128,6 +128,11 @@ const config: Config = {
           label: 'Guides',
           position: 'left',
         },
+        {
+          to: '/whitepaper',
+          label: 'Whitepaper',
+          position: 'left',
+        },
         {
           href: 'https://github.com/layer-3',
           position: 'right',
@@ -170,8 +175,8 @@ const config: Config = {
               to: '/docs/guides',
             },
             {
-              label: 'API Reference',
-              to: '/docs/api-reference',
+              label: 'Whitepaper',
+              to: '/whitepaper',
             },
           ],
         },
@@ -207,19 +212,19 @@ const config: Config = {
       defaultLanguage: 'javascript',
       magicComments: [
         {
-            className: 'git-diff-remove',
-            line: 'remove-next-line',
-            block: { start: 'remove-start', end: 'remove-end' },
+          className: 'git-diff-remove',
+          line: 'remove-next-line',
+          block: { start: 'remove-start', end: 'remove-end' },
         },
         {
-            className: 'git-diff-add',
-            line: 'add-next-line',
-            block: { start: 'add-start', end: 'add-end' },
+          className: 'git-diff-add',
+          line: 'add-next-line',
+          block: { start: 'add-start', end: 'add-end' },
         },
         {
-            className: 'theme-code-block-highlighted-line',
-            line: 'highlight-next-line',
-            block: { start: 'highlight-start', end: 'highlight-end' },
+          className: 'theme-code-block-highlighted-line',
+          line: 'highlight-next-line',
+          block: { start: 'highlight-start', end: 'highlight-end' },
         },
       ],
     },

src/pages/whitepaper.tsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import Layout from '@theme/Layout';
+import Link from '@docusaurus/Link';
+
+export default function Whitepaper(): JSX.Element {
+  return (
+    <Layout
+      title="Whitepaper"
+      description="Download the Yellow Network Whitepaper">
+      <main className="container margin-vert--xl">
+        <div className="row">
+          <div className="col col--8 col--offset-2 text--center">
+            <h1 className="hero__title margin-bottom--lg">Yellow Network Whitepaper</h1>
+            <p className="hero__subtitle margin-bottom--xl">
+              Understand the risks, utilities, and compliance framework of the Yellow token.
+            </p>
+
+            <div className="card shadow--md padding--lg">
+              <div className="card__header">
+                <h3>Yellow MiCA Whitepaper</h3>
+              </div>
+              <div className="card__body">
+                <p>
+                  Our whitepaper provides a comprehensive overview of the Yellow Network protocol, 
+                  tokenomics, and regulatory compliance under MiCA.
+                </p>
+              </div>
+              <div className="card__footer">
+                <Link
+                  className="button button--primary button--lg"
+                  to="/assets/YELLOW_MiCA_White_Paper_v.1.2.pdf"
+                  target="_blank"
+                  download>
+                  Download PDF
+                </Link>
+              </div>
+            </div>
+          </div>
+        </div>
+      </main>
+    </Layout>
+  );
+}