Merge pull request #1 from swedishfrenchpress/index_homepage_edits

Cashu TS Homepage Edits

docusaurus.config.js

@@ -0,0 +1,32 @@
+module.exports = {
+  stylesheets: [
+    {
+      href: 'https://fonts.googleapis.com/css2?family=Jersey+20&display=swap',
+      rel: 'stylesheet',
+    },
+  ],
+  themeConfig: {
+    colorMode: {
+      defaultMode: 'dark',
+      respectPrefersColorScheme: true,
+      darkMode: {
+        cssVars: {
+          'background-color': 'hsla(260,40%,5%,1)',
+          '--ifm-background-color': 'hsla(260,40%,5%,1)',
+          '--ifm-background-surface-color': 'hsla(260,35%,8%,1)',
+          '--ifm-navbar-background-color': 'hsla(260,40%,5%,0.8)',
+          '--ifm-color-primary': '#c084fc',
+          '--ifm-color-primary-dark': '#a855f7',
+          '--ifm-color-primary-darker': '#9333ea',
+          '--ifm-color-primary-darkest': '#7e22ce',
+          '--ifm-color-primary-light': '#d8b4fe',
+          '--ifm-color-primary-lighter': '#e9d5ff',
+          '--ifm-color-primary-lightest': '#f3e8ff',
+          '--ifm-toc-border-color': 'rgba(147,51,234,0.3)',
+          '--ifm-color-content': '#f9fafb',
+          '--ifm-color-content-secondary': '#a1a1aa',
+        }
+      }
+    }
+  }
+}; 

docusaurus.config.ts

@@ -51,27 +51,28 @@ const config: Config = {
     // Replace with your project's social card
     image: "img/docusaurus-social-card.jpg",
     navbar: {
-      title: "Cashu-TS",
+      title: "Cashu TS",
+      logo: {
+        alt: "Cashu-TS Logo",
+        src: "img/tslogo.png",
+      },
       items: [
         {
           type: "docSidebar",
           sidebarId: "tutorialSidebar",
           position: "left",
           label: "Docs",
         },
+        {
+          href: 'https://github.com/cashubtc/cashu-ts',
+          label: 'GitHub',
+          position: 'right',
+        },
       ],
-      logo: {
-        alt: "Site Logo",
-        src: "img/tslogo.png",
-        target: "_self",
-        width: 32,
-        height: 32,
-        className: "custom-navbar-logo-class",
-      },
     },
     announcementBar: {
       id: "wip",
-      content: "These docs are a WORK IN PROGRESS.",
+      content: "We’re actively building these docs—check back for updates.",
       backgroundColor: "#18181b",
       textColor: "#fafafa",
       isCloseable: false,

package.json

@@ -21,7 +21,8 @@
     "clsx": "^2.0.0",
     "prism-react-renderer": "^2.3.0",
     "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react-dom": "^18.0.0",
+    "simplex-noise": "^4.0.3"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "3.6.3",

src/css/custom.css

@@ -1,13 +1,10 @@
+@import url('https://fonts.googleapis.com/css2?family=Jersey+20&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Azeret+Mono:ital,wght@0,100..900;1,100..900&display=swap');
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
-/**
- * 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. */
 :root {
   --ifm-color-primary: #9333ea;
@@ -19,6 +16,10 @@
   --ifm-color-primary-lightest: #c084fc;
   --ifm-code-font-size: 95%;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
+  --ifm-navbar-background-color: #ffffff;
+  --ifm-navbar-link-color: #581c87;
+  --ifm-navbar-link-hover-color: #9333ea;
+  --ifm-navbar-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
@@ -31,4 +32,51 @@
   --ifm-color-primary-lighter: #e879f9;
   --ifm-color-primary-lightest: #e879f9;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
+  --ifm-navbar-background-color: #1e1b4b;
+  --ifm-navbar-link-color: #FFFFFF;
+  --ifm-navbar-link-hover-color: #c026d3;
+}
+
+/* Keep any non-navbar related utility classes you need */
+
+/* Add custom navbar styling */
+.navbar {
+  border-bottom: 1px solid rgba(147, 51, 234, 0.1);
+  padding: 0;
+}
+
+/* Container for the entire navbar */
+.navbar__inner {
+  width: 100%;
+  margin: 0 auto;
+  padding: 0;
+}
+
+/* Main content wrapper to match page content */
+.container {
+  max-width: var(--ifm-container-width) !important;
+  margin: 0 auto;
+  padding: 0 var(--ifm-spacing-horizontal);
+}
+
+/* Ensure navbar items are properly spaced */
+.navbar__items {
+  margin: 0 auto;
+  max-width: var(--ifm-container-width);
+  padding: 0 var(--ifm-spacing-horizontal);
+  width: 100%;
+}
+
+[data-theme="dark"] .navbar {
+  border-bottom: 1px solid rgba(232, 121, 249, 0.1);
+}
+
+.navbar__link {
+  font-weight: 500;
+  transition: color 0.2s ease;
+}
+
+.navbar__link--active {
+  font-weight: 600;
+  color: var(--ifm-color-primary);
 }