From 2b9b8b62de3b573539adbd859e75df4eaa7bf197 Mon Sep 17 00:00:00 2001
From: Rukh-Khan <khanrukhsar1890@gmail.com>
Date: Tue, 31 Dec 2024 21:46:41 +0530
Subject: [PATCH] refactor: admin-doc to hasura docs style

---
 docs/docusaurus.config.ts                    | 195 ++++++---
 docs/src/css/custom.css                      | 429 ++++++++++++++++++-
 docs/src/pages/index.tsx                     |  10 +-
 docs/static/img/icons/facebook.svg           |   3 +
 docs/static/img/icons/favicon_palisadoes.ico | Bin 0 -> 870 bytes
 docs/static/img/icons/github-dark.svg        |   1 +
 docs/static/img/icons/github.svg             |   1 +
 docs/static/img/icons/instagram.svg          |   3 +
 docs/static/img/icons/opportunities.svg      |   6 +
 docs/static/img/icons/slack.svg              |   3 +
 docs/static/img/icons/source.svg             |   4 +
 docs/static/img/icons/team.svg               |   3 +
 docs/static/img/icons/twitter.svg            |   1 +
 docs/static/img/icons/youtube-white.svg      |   3 +
 docs/static/img/icons/youtube.svg            |   1 +
 15 files changed, 566 insertions(+), 97 deletions(-)
 create mode 100644 docs/static/img/icons/facebook.svg
 create mode 100644 docs/static/img/icons/favicon_palisadoes.ico
 create mode 100644 docs/static/img/icons/github-dark.svg
 create mode 100644 docs/static/img/icons/github.svg
 create mode 100644 docs/static/img/icons/instagram.svg
 create mode 100644 docs/static/img/icons/opportunities.svg
 create mode 100644 docs/static/img/icons/slack.svg
 create mode 100644 docs/static/img/icons/source.svg
 create mode 100644 docs/static/img/icons/team.svg
 create mode 100644 docs/static/img/icons/twitter.svg
 create mode 100644 docs/static/img/icons/youtube-white.svg
 create mode 100644 docs/static/img/icons/youtube.svg

diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts
index fe6e79534b..b698d2b488 100644
--- a/docs/docusaurus.config.ts
+++ b/docs/docusaurus.config.ts
@@ -6,8 +6,8 @@ import type * as Preset from '@docusaurus/preset-classic';
 
 const config: Config = {
   title: 'Talawa-Admin Documentation',
-  tagline: 'Start your open source journey here',
-  favicon: 'img/favicon.ico',
+  tagline: 'Complete guides and references for building with Talawa',
+  favicon: 'img/icons/favicon_palisadoes.ico',
 
   url: 'https://docs-admin.talawa.io',
   baseUrl: '/',
@@ -45,75 +45,132 @@ const config: Config = {
     ],
   ],
 
-  themeConfig: {
-    // Replace with your project's social card
-    image: 'img/docusaurus-social-card.jpg',
-    navbar: {
-      title: 'My Site',
-      logo: {
-        alt: 'My Site Logo',
-        src: 'img/logo.svg',
-      },
-      items: [
-        {
-          type: 'docSidebar',
-          sidebarId: 'tutorialSidebar',
-          position: 'left',
-          label: 'Tutorial',
-        },
-        {
-          href: 'https://github.com/facebook/docusaurus',
-          label: 'GitHub',
-          position: 'right',
-        },
-      ],
-    },
-    footer: {
-      style: 'dark',
-      links: [
-        {
-          title: 'Docs',
-          items: [
-            {
-              label: 'Tutorial',
-              to: '/docs/intro',
-            },
-          ],
+  themeConfig:
+    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
+    ({
+      docs: {
+        sidebar: {
+          hideable: false,
         },
-        {
-          title: 'Community',
-          items: [
-            {
-              label: 'Stack Overflow',
-              href: 'https://stackoverflow.com/questions/tagged/docusaurus',
-            },
-            {
-              label: 'Discord',
-              href: 'https://discordapp.com/invite/docusaurus',
-            },
-            {
-              label: 'X',
-              href: 'https://x.com/docusaurus',
-            },
-          ],
-        },
-        {
-          title: 'More',
-          items: [
-            {
-              label: 'GitHub',
-              href: 'https://github.com/facebook/docusaurus',
-            },
-          ],
+      },
+      navbar: {
+        title: "Talawa Admin Documentation",
+        logo: {
+          alt: "Talawa Logo",
+          src: "img/icons/favicon_palisadoes.ico",
+          className: "LogoAnimation",
         },
-      ],
-      copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
-    },
-    prism: {
-      theme: prismThemes.github,
-      darkTheme: prismThemes.dracula,
-    },
-  } satisfies Preset.ThemeConfig,
+        items: [
+          {
+            type: "docSidebar",
+            sidebarId: "tutorialSidebar",
+            label: "General",
+            position: "left",
+          },
+          {
+			label: "Mobile Guide",
+			position: "left",
+			href: "https://docs-mobile.talawa.io/",
+			target: "_self",
+		  },
+		  {
+			label: "Admin Guide",
+			position: "left",
+			href: "https://docs-admin.talawa.io/",
+			target: "_self",
+		  },
+		  {
+			label: "API Guide",
+			position: "left",
+			href: "https://docs-api.talawa.io/",
+			target: "_self", 
+		  },
+		  
+          {
+            label: "Demo",
+            position: "left",
+            href: "http://admin-demo.talawa.io/",
+          },
+          {
+            to: "https://github.com/PalisadoesFoundation",
+            position: "right",
+            className: "header-github-link",
+            "aria-label": "GitHub repository",
+          },
+          {
+            to: "https://www.youtube.com/@PalisadoesOrganization",
+            position: "right",
+            className: "header-youtube-link",
+            "aria-label": "Palisadoes Youtube channel",
+          },
+        ],
+      },
+      colorMode: {
+        defaultMode: "light",
+        disableSwitch: false,
+        respectPrefersColorScheme: false,
+      },
+      footer: {
+        style: "dark",
+        links: [
+          {
+            title: "Community",
+            items: [
+              {
+                label: " Slack",
+                to: "https://github.com/PalisadoesFoundation",
+                className: "footer__icon footer__slack",
+              },
+              {
+                label: " News",
+                to: "https://www.palisadoes.org/news/",
+                className: "footer__icon footer__news",
+              },
+              {
+                label: " Contact Us",
+                to: "https://www.palisadoes.org/contact/",
+                className: "footer__icon footer__contact",
+              },
+            ],
+          },
+          {
+            title: "Social Media",
+            items: [
+              {
+                label: " Twitter",
+                to: "https://twitter.com/palisadoesorg?lang=en",
+                className: "footer__icon footer__twitter",
+              },
+              {
+                label: " Facebook",
+                to: "https://www.facebook.com/palisadoesproject/",
+                className: "footer__icon footer__facebook",
+              },
+              {
+                label: " Instagram",
+                to: "https://www.instagram.com/palisadoes/?hl=en",
+                className: "footer__icon footer__instagram",
+              },
+            ],
+          },
+          {
+            title: "Development",
+            items: [
+              {
+                label: " GitHub",
+                to: "https://github.com/PalisadoesFoundation",
+                className: "footer__icon footer__github",
+              },
+            ],
+          },
+        ],
+        copyright: `Copyright © ${new Date().getFullYear()} The Palisadoes Foundation, LLC. Built with Docusaurus.`,
+      },
+      prism: {
+        theme: prismThemes.github,
+        darkTheme: prismThemes.dracula,
+      },
+    }),
 };
 
 export default config;
diff --git a/docs/src/css/custom.css b/docs/src/css/custom.css
index 2bc6a4cfde..b1153f3432 100644
--- a/docs/src/css/custom.css
+++ b/docs/src/css/custom.css
@@ -2,29 +2,420 @@
  * Any CSS included here will be global. The classic template
  * bundles Infima by default. Infima is a CSS framework designed to
  * work well for content-centric websites.
+ * You can override the default Infima variables here. 
  */
 
-/* You can override the default Infima variables here. */
 :root {
-  --ifm-color-primary: #2e8555;
-  --ifm-color-primary-dark: #29784c;
-  --ifm-color-primary-darker: #277148;
-  --ifm-color-primary-darkest: #205d3b;
-  --ifm-color-primary-light: #33925d;
-  --ifm-color-primary-lighter: #359962;
-  --ifm-color-primary-lightest: #3cad6e;
+  --secondary-blue-900: #001c63;
+  --sidebar-bg-color: #f3f4f6;
+  --secondary-blue-500: #3970fd;
+  --primary-blue-600: #1e56e3;
+  --base-neutral-0: #ffffff;
+  --primary-neutral-800: #1f2a37;
+  --ifm-menu-color-active: #1e56e3;
+  --primary-neutral-600: #4d5761;
+  --ifm-breadcrumb-color-active: var(--primary-neutral-600);
+  --ifm-link-color: #1e56e3;
+  --ifm-button-background-color: #2e8555;
+  --ifm-button-background-color-dark: #205d3b;
+  --ifm-hover-overlay: rgba(0, 0, 0, 0.05);
+  --brand-color: black;
+  --next-prev-border-color: #e5e7eb;
+  --ifm-color-emphasis-100: #f4f8fb;
+  --ifm-color-emphasis-0: #fff;
+  --ifm-color-primary: #1e56e3;
+  --ifm-background-surface-color: var(--ifm-color-white);
+  --ifm-menu-color: var(--ifm-color-gray-600);
+  --ifm-toc-link-color: var(--ifm-color-gray-600);
   --ifm-code-font-size: 95%;
-  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
+  --ifm-toc-border-color: transparent;
+  --ifm-code-background: #e5ecff;
+  --ifm-code-color: #0087ff;
+  --ifm-color-content: #000e33;
+  --ifm-heading-line-height: 1.5;
+  --ifm-h1-font-size: 2.25rem;
+  --ifm-h2-font-size: 1.875rem;
+  --ifm-navbar-shadow: 0 1px 2px 0 #0000001a;
+  --ifm-navbar-search-input-background-color: var(--ifm-color-gray-100);
+  --ifm-navbar-search-input-color: var(--ifm-color-content);
+  --ifm-table-stripe-background: #efeff2;
+  --ifm-font-family-base: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu,
+    Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", Helvetica,
+    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  --ifm-font-family-monospace: "IBM Plex Mono", SFMono-Regular, Menlo, Monaco,
+    Consolas, "Liberation Mono", "Courier New", monospace;
 }
 
-/* For readability concerns, you should choose a lighter palette in dark mode. */
-[data-theme='dark'] {
-  --ifm-color-primary: #25c2a0;
-  --ifm-color-primary-dark: #21af90;
-  --ifm-color-primary-darker: #1fa588;
-  --ifm-color-primary-darkest: #1a8870;
-  --ifm-color-primary-light: #29d5b0;
-  --ifm-color-primary-lighter: #32d8b4;
-  --ifm-color-primary-lightest: #4fddbf;
-  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
+/* Dak mode css */
+
+html[data-theme="dark"] {
+  --ifm-background-color: #111927;
+  --ifm-background-surface-color: var(--ifm-background-color);
+  --ifm-menu-color: var(--ifm-color-gray-200);
+  --ifm-toc-link-color: var(--ifm-color-gray-200);
+  --ifm-code-background: #001b66;
+  --ifm-color-content: var(--ifm-color-white);
+  --ifm-navbar-search-input-background-color: #001b66;
+  --ifm-table-stripe-background: #001242;
+  --ifm-navbar-search-input-placeholder-color: var(--ifm-color-gray-200);
+  --ifm-navbar-search-input-icon: url('data:image/svg+xml;utf8,<svg fill="%23C9C9CC" alt="Search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" height="16px" width="16px"><path d="M6.02945,10.20327a4.17382,4.17382,0,1,1,4.17382-4.17382A4.15609,4.15609,0,0,1,6.02945,10.20327Zm9.69195,4.2199L10.8989,9.59979A5.88021,5.88021,0,0,0,12.058,6.02856,6.00467,6.00467,0,1,0,9.59979,10.8989l4.82338,4.82338a.89729.89729,0,0,0,1.29912,0,.89749.89749,0,0,0-.00087-1.29909Z" /></svg>');
+  
+  --ifm-hover-overlay: rgba(0, 0, 0, 0);
+  --ifm-color-primary: #1e56e3;
+  --secondary-blue-900: #c6d6ff;
+  --sidebar-bg-color: #161f36;
+  --primary-neutral-800: #c9c9cc;
+  --ifm-button-background-color: #25c2a0;
+  --ifm-button-background-color-dark: #2e8555;
+  --ifm-navbar-link-color: #9da4ae;
+  --brand-color: white;
+  --primary-neutral-600: #c4c4c4;
+  --next-prev-border-color: #293441;
+  --ifm-color-emphasis-100: #1d1e30;
+  --ifm-color-emphasis-0: #111f3b;
+}
+
+.docusaurus-highlight-code-line {
+  background-color: rgb(72, 77, 91);
+  display: block;
+  margin: 0 calc(-1 * var(--ifm-pre-padding));
+  padding: 0 var(--ifm-pre-padding);
+}
+
+.table-of-contents {
+  font-size: 0.75rem;
+}
+
+h1.docTitle_node_modules-\@docusaurus-theme-classic-src-theme-DocItem- {
+  font-size: var(--ifm-h1-font-size);
+  margin-bottom: 1.5rem;
+}
+
+.menu {
+  background-color: var(--sidebar-bg-color);
+}
+
+.menu__link,
+.menu * {
+  line-height: 1.5;
+  font-size: 0.7rem;
+  padding-left: 0.5rem;
+  padding-bottom: 0;
+  text-transform: uppercase;
+  font-weight: 700;
+  background: transparent !important;
+}
+
+.menu__list {
+  border-bottom: 1px solid var(--next-prev-border-color);
+}
+
+.menu__list ul {
+  margin-left: 15px;
+  margin-right: 15px;
+}
+
+.markdown > h2 {
+  --ifm-h2-font-size: 1.875rem;
+  margin-bottom: 0.8rem;
+  margin-top: calc(var(--ifm-h2-vertical-rhythm-top) * 0rem);
+}
+
+.markdown > h3 {
+  --ifm-h3-font-size: 1.5rem;
+  margin-bottom: 0.8rem;
+  margin-top: calc(var(--ifm-h3-vertical-rhythm-top) * 0rem);
+}
+
+.navbar {
+  background-color: var(--sidebar-bg-color);
+  box-shadow: var(--ifm-navbar-shadow);
+  padding: 24px 48px;
+  height: auto;
+}
+
+.navbar__item {
+  font-size: 1rem;
+}
+
+.navbar__link:hover,
+.navbar__link--active {
+  color: var(--primary-blue-600);
+  text-decoration: none;
+}
+
+.navbar__items--right > .navbar__item:not(:first-of-type) {
+  margin-left: 0.25px;
+}
+
+.dropdown__link:hover {
+  color: #2563eb;
+}
+
+.dropdown__link--active {
+  background-color: transparent;
+}
+
+.dropdown__link {
+  color: var(--ifm-navbar-link-color);
+}
+
+.header-github-link:hover {
+  opacity: 0.7;
+}
+
+.header-youtube-link:hover {
+  opacity: 0.7;
+}
+
+.youtube-button {
+  background: linear-gradient(90deg, #ff3600 0%, #ff8100 100%);
+  border: none;
+  border-radius: 4px;
+  padding: 7px 21px;
+  color: #fff;
+  font-weight: bold;
+  font-size: 14px;
+  text-decoration: none;
+  display: inline-flex;
+  margin-right: 2.75rem;
+}
+
+.github-button {
+  background: linear-gradient(90deg, #ff3600 0%, #ff8100 100%);
+  border: none;
+  border-radius: 4px;
+  padding: 7px 21px;
+  color: #fff;
+  font-weight: bold;
+  font-size: 14px;
+  text-decoration: none;
+  display: inline-flex;
+  margin-right: 2.75rem;
+}
+
+.github-button:hover {
+  color: #fff;
+  text-decoration: none;
+}
+
+.youtube-button:hover {
+  color: #fff;
+  text-decoration: none;
+}
+
+.header-github-link:before {
+  content: "";
+  width: 20px;
+  height: 20px;
+  display: flex;
+  background: url("/img/icons/github-dark.svg") no-repeat;
+  position: relative;
+  right: 8px;
+  top: 1.5px;
+}
+
+.header-twitter-link:before {
+  content: "";
+  width: 15px;
+  height: 15px;
+  display: flex;
+  background: url("/img/icons/twitter.svg") no-repeat 90% 100%;
+  position: relative;
+  right: 6px;
+  top: 2px;
+}
+
+.header-youtube-link:before {
+  content: "";
+  width: 25px;
+  height: 30px;
+  display: flex;
+  background: url("/img/icons/youtube.svg") no-repeat;
+  position: relative;
+  right: 8px;
+  top: 4.5px;
 }
+
+.footer--dark {
+  --ifm-footer-background-color: #111927;
+}
+
+.footer--dark li {
+  margin-bottom: 0;
+  line-height: normal;
+}
+
+.footer__icon {
+  margin: 0;
+  padding: 2px;
+  color: #fff; 
+  font-size: 1rem;
+}
+
+.footer__icon:before {
+  content: "";
+  display: inline-flex;
+  height: 16px;
+  width: 16px;
+  background-color: #fff;
+}
+
+.footer__icon:hover:before {
+  background-color: var(--ifm-navbar-link-hover-color);
+}
+
+.footer__github:before {
+  mask: url(/img/icons/github.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__slack:before {
+  mask: url(/img/icons/slack.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__facebook:before {
+  mask: url(/img/icons/facebook.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__instagram:before {
+  mask: url(/img/icons/instagram.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__twitter:before {
+  mask: url(/img/icons/twitter.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__news:before {
+  mask: url(/img/icons/source.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__contact:before {
+  mask: url(/img/icons/source.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__opportunities:before {
+  mask: url(/img/icons/opportunities.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+.footer__team:before {
+  mask: url(/img/icons/team.svg) no-repeat 100% 100%;
+  mask-size: cover;
+}
+
+html[data-theme="dark"] .header-github-link:before {
+  background: url(/img/icons/github.svg) no-repeat;
+}
+html[data-theme="dark"] .header-youtube-link:before {
+  background: url(/img/icons/youtube-white.svg) no-repeat;
+}
+
+@media (max-width: 996px) {
+  .navbar__item.github-button {
+    display: none;
+  }
+  .github-button {
+    margin: var(--ifm-menu-link-padding-vertical)
+      var(--ifm-menu-link-padding-horizontal);
+  }
+  .navbar__item.youtube-button {
+    display: none;
+  }
+  .youtube-button {
+    margin: var(--ifm-menu-link-padding-vertical)
+      var(--ifm-menu-link-padding-horizontal);
+  }
+  .center {
+    text-align: center;
+  }
+}
+
+@media (max-width: 1000px) {
+  .navbar__items--right > .navbar__item:not(:first-of-type) {
+    margin-left: 0.25rem;
+  }
+  .github-button {
+    margin-right: 0.5rem;
+  }
+  .youtube-button {
+    margin-right: 0.5rem;
+  }
+  .hero__title {
+    font-size: 2rem;
+  }
+}
+
+@media (max-width: 1149px) and (min-width: 1050px) {
+  .navbar__items--right > .navbar__item:not(:first-of-type) {
+    margin-left: 1.5rem;
+  }
+  .github-button {
+    margin-right: 0.5rem;
+  }
+  .youtube-button {
+    margin-right: 0.5rem;
+  }
+}
+
+@media (max-width: 1049px) and (min-width: 1001px) {
+  .navbar__items--right > .navbar__item:not(:first-of-type) {
+    margin-left: 0.5rem;
+  }
+  .github-button {
+    margin-right: 0.5rem;
+  }
+  .youtube-button {
+    margin-right: 0.5rem;
+  }
+}
+
+h1 {
+  font-size: 1.75rem;
+  font-weight: 700;
+}
+.Heading {
+  font-size: 1.5rem;
+  font-weight: 700;
+  text-align: center !important;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  color: var(--secondary-blue-900);
+  margin: 20px 0 !important;
+}
+
+p,
+textarea,
+li,
+.Heading div {
+  margin-bottom: 1.25rem;
+  color: var(--primary-neutral-800);
+  font-size: 0.9375rem;
+  line-height: 1.625rem;
+}
+
+a {
+  color: #2563eb;
+  text-decoration: none;
+}
+
+a:hover {
+  color: #86a7ef;
+}
+
+/* Hide external link svg on Navbar */
+.iconExternalLink_nPIU {
+  display: none !important;
+}
\ No newline at end of file
diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx
index 270b7f9af8..300781adf2 100644
--- a/docs/src/pages/index.tsx
+++ b/docs/src/pages/index.tsx
@@ -10,20 +10,12 @@ import styles from './index.module.css';
 function HomepageHeader() {
   const { siteConfig } = useDocusaurusContext();
   return (
-    <header className={clsx('hero hero--primary', styles.heroBanner)}>
+    <header className={styles.heroBanner}>
       <div className="container">
         <Heading as="h1" className="hero__title">
           {siteConfig.title}
         </Heading>
         <p className="hero__subtitle">{siteConfig.tagline}</p>
-        <div className={styles.buttons}>
-          <Link
-            className="button button--secondary button--lg"
-            to="/docs/intro"
-          >
-            Docusaurus Tutorial - 5min ⏱️
-          </Link>
-        </div>
       </div>
     </header>
   );
diff --git a/docs/static/img/icons/facebook.svg b/docs/static/img/icons/facebook.svg
new file mode 100644
index 0000000000..e8d1443db6
--- /dev/null
+++ b/docs/static/img/icons/facebook.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-facebook" viewBox="0 0 16 16">
+  <path d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/favicon_palisadoes.ico b/docs/static/img/icons/favicon_palisadoes.ico
new file mode 100644
index 0000000000000000000000000000000000000000..0675af2934d8d350d002845f0fb9d223e1ccd06e
GIT binary patch
literal 870
zcmV-s1DX7ZP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm0002B
z0002B0Xfjlp8x;@7)eAyR9J<@mQ83AK@@<$q`wK$#<qwkYKngcg~otKX-jgif~TD7
zJ*bEE9`PjXp_N<|!4;$+2=?YBfwYRyDxnnx71Y*J1wqoZ)ublf^{`VK%uIIL27I^7
zzMpU2y!Y~aj^nTsak7aa;35zaM+-m>nDoUaR(9kJ@aY0L*+dwyfI)>y5g7HwCMKH>
z;A9gK+*@{Q_`KqaO<1}BeoZ|~GdREl@l4GDaI%R}U_jTQkW|wEa0_myGU#Lzp=JRL
z?E(O{yJXJ*x^KTL(E(We-vGItIxUo1@Wm#y>~sLEQbo60UAh0NciAwER8s(MJUbM*
zJKL*0VrQ0ur60dq4+GZ?!wByQKsZP(ueOCA&Fx?J%EZi4u=M0@C?I}z;|{Rh0{~;f
z5%b>z`)*GkSbx17tWzqKTDUjcTdWDbC4+`xG@K*K{{mt7R7%}f{eArWS`gry<L6DO
zo&M*6vfrjtqFw~TrfEu_u~iW~gnRosvHg@^p4kj$oSMr9prya+3xATj>&6|;*QJ+{
z9SVbEvJYSTtG;reK5L&(Ry+Q*JHHkFt{H|gqy=CYMg+JfQ!WLa;^&jq4n+{&MJn|L
zvMth#sxnZN9lk$XX*iY(JvKl4Y*iK(v;a)goCCtZ!`k!ZBb#f59=lO|0NxE$g0`QH
znxi6c$uv!AH#FRc#JgFxpMx)kH#(|qdh6TKFRkShA6h$saUiAY08apb*yF1gDs4=!
zcS&!*h@x1#R{S4xm+zeRg7qB5g<kuXA~?9q%DC*qYREnn%_OC*rwt$+sJ7tod^|me
z+p^N41ya#WGQ2B*XeJp#z1tPHzUAZT6<}1M*Nvk6JOOCD36F}v2#85wN})Rv%_Noo
z2U37&COHI*C~T%gz&a>Z5MWGX)Ehu3S`C~@1LfoC1>mN_<`|0Slx5%|iq-;dia;tE
zL%l;v$9o+>KAyI4Z}M+tFXB;9qAp~uHxHbX*(e8*XdjF1HXP2!)44_fHMTinR|Hb|
wcv=bWISEAtNAmG>N+-Cm3FFp^<?&?v1-w5O;WG%6`v3p{07*qoM6N<$f^MCQ9RL6T

literal 0
HcmV?d00001

diff --git a/docs/static/img/icons/github-dark.svg b/docs/static/img/icons/github-dark.svg
new file mode 100644
index 0000000000..654102ae55
--- /dev/null
+++ b/docs/static/img/icons/github-dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/github.svg b/docs/static/img/icons/github.svg
new file mode 100644
index 0000000000..ab49f9955c
--- /dev/null
+++ b/docs/static/img/icons/github.svg
@@ -0,0 +1 @@
+<svg fill="white" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/instagram.svg b/docs/static/img/icons/instagram.svg
new file mode 100644
index 0000000000..0b5c5cef02
--- /dev/null
+++ b/docs/static/img/icons/instagram.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-instagram" viewBox="0 0 16 16">
+  <path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/opportunities.svg b/docs/static/img/icons/opportunities.svg
new file mode 100644
index 0000000000..85a807cee9
--- /dev/null
+++ b/docs/static/img/icons/opportunities.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-bullseye" viewBox="0 0 16 16">
+  <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
+  <path d="M8 13A5 5 0 1 1 8 3a5 5 0 0 1 0 10zm0 1A6 6 0 1 0 8 2a6 6 0 0 0 0 12z"/>
+  <path d="M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0 1a4 4 0 1 0 0-8 4 4 0 0 0 0 8z"/>
+  <path d="M9.5 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/slack.svg b/docs/static/img/icons/slack.svg
new file mode 100644
index 0000000000..f4aa6e6d66
--- /dev/null
+++ b/docs/static/img/icons/slack.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-slack" viewBox="0 0 16 16">
+  <path d="M3.362 10.11c0 .926-.756 1.681-1.681 1.681S0 11.036 0 10.111C0 9.186.756 8.43 1.68 8.43h1.682v1.68zm.846 0c0-.924.756-1.68 1.681-1.68s1.681.756 1.681 1.68v4.21c0 .924-.756 1.68-1.68 1.68a1.685 1.685 0 0 1-1.682-1.68v-4.21zM5.89 3.362c-.926 0-1.682-.756-1.682-1.681S4.964 0 5.89 0s1.68.756 1.68 1.68v1.682H5.89zm0 .846c.924 0 1.68.756 1.68 1.681S6.814 7.57 5.89 7.57H1.68C.757 7.57 0 6.814 0 5.89c0-.926.756-1.682 1.68-1.682h4.21zm6.749 1.682c0-.926.755-1.682 1.68-1.682.925 0 1.681.756 1.681 1.681s-.756 1.681-1.68 1.681h-1.681V5.89zm-.848 0c0 .924-.755 1.68-1.68 1.68A1.685 1.685 0 0 1 8.43 5.89V1.68C8.43.757 9.186 0 10.11 0c.926 0 1.681.756 1.681 1.68v4.21zm-1.681 6.748c.926 0 1.682.756 1.682 1.681S11.036 16 10.11 16s-1.681-.756-1.681-1.68v-1.682h1.68zm0-.847c-.924 0-1.68-.755-1.68-1.68 0-.925.756-1.681 1.68-1.681h4.21c.924 0 1.68.756 1.68 1.68 0 .926-.756 1.681-1.68 1.681h-4.21z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/source.svg b/docs/static/img/icons/source.svg
new file mode 100644
index 0000000000..1d93acb91a
--- /dev/null
+++ b/docs/static/img/icons/source.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-box-arrow-up-right" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z"/>
+  <path fill-rule="evenodd" d="M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/team.svg b/docs/static/img/icons/team.svg
new file mode 100644
index 0000000000..29dfc5b0ee
--- /dev/null
+++ b/docs/static/img/icons/team.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-people" viewBox="0 0 16 16">
+  <path d="M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8Zm-7.978-1A.261.261 0 0 1 7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002a.274.274 0 0 1-.014.002H7.022ZM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM6.936 9.28a5.88 5.88 0 0 0-1.23-.247A7.35 7.35 0 0 0 5 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816ZM4.92 10A5.493 5.493 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0Zm3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z"/>
+</svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/twitter.svg b/docs/static/img/icons/twitter.svg
new file mode 100644
index 0000000000..18eb8d3410
--- /dev/null
+++ b/docs/static/img/icons/twitter.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>
\ No newline at end of file
diff --git a/docs/static/img/icons/youtube-white.svg b/docs/static/img/icons/youtube-white.svg
new file mode 100644
index 0000000000..2cf08c84dc
--- /dev/null
+++ b/docs/static/img/icons/youtube-white.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" fill="#FFFFFF" width="22px" height="22px">
+  <path d="M 44.898438 14.5 C 44.5 12.300781 42.601563 10.699219 40.398438 10.199219 C 37.101563 9.5 31 9 24.398438 9 C 17.800781 9 11.601563 9.5 8.300781 10.199219 C 6.101563 10.699219 4.199219 12.199219 3.800781 14.5 C 3.398438 17 3 20.5 3 25 C 3 29.5 3.398438 33 3.898438 35.5 C 4.300781 37.699219 6.199219 39.300781 8.398438 39.800781 C 11.898438 40.5 17.898438 41 24.5 41 C 31.101563 41 37.101563 40.5 40.601563 39.800781 C 42.800781 39.300781 44.699219 37.800781 45.101563 35.5 C 45.5 33 46 29.398438 46.101563 25 C 45.898438 20.5 45.398438 17 44.898438 14.5 Z M 19 32 L 19 18 L 31.199219 25 Z"/>
+</svg>
diff --git a/docs/static/img/icons/youtube.svg b/docs/static/img/icons/youtube.svg
new file mode 100644
index 0000000000..97a61232b1
--- /dev/null
+++ b/docs/static/img/icons/youtube.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="22px" height="22px"><path d="M 44.898438 14.5 C 44.5 12.300781 42.601563 10.699219 40.398438 10.199219 C 37.101563 9.5 31 9 24.398438 9 C 17.800781 9 11.601563 9.5 8.300781 10.199219 C 6.101563 10.699219 4.199219 12.199219 3.800781 14.5 C 3.398438 17 3 20.5 3 25 C 3 29.5 3.398438 33 3.898438 35.5 C 4.300781 37.699219 6.199219 39.300781 8.398438 39.800781 C 11.898438 40.5 17.898438 41 24.5 41 C 31.101563 41 37.101563 40.5 40.601563 39.800781 C 42.800781 39.300781 44.699219 37.800781 45.101563 35.5 C 45.5 33 46 29.398438 46.101563 25 C 45.898438 20.5 45.398438 17 44.898438 14.5 Z M 19 32 L 19 18 L 31.199219 25 Z"/></svg>
\ No newline at end of file