docs: implement styling

Author: Keinberger

docs/docusaurus.config.ts

@@ -1,4 +1,5 @@
 import type { Config } from "@docusaurus/types";
+import { themes as prismThemes } from "prism-react-renderer";
 
 // If your content lives in docs/src, set DOCS_PATH='src'; else '.'
 const DOCS_PATH =
@@ -21,11 +22,108 @@ const config: Config = {
           sidebarPath: "./sidebars.ts",
           remarkPlugins: [require("remark-math")],
           rehypePlugins: [require("rehype-katex")],
+          versions: {
+            current: {
+              label: `stable`,
+            },
+          },
         },
         blog: false,
         pages: false,
+        theme: {
+          customCss: "./styles.css",
+        },
+      },
+    ],
+  ],
+
+  plugins: [
+    [
+      "@cmfcmf/docusaurus-search-local",
+      {
+        // whether to index docs pages
+        indexDocs: true,
+
+        // whether to index blog pages
+        indexBlog: false,
+
+        // whether to index static pages
+        indexPages: false,
+
+        // language of your documentation, see next section
+        language: "en",
+
+        // setting this to "none" will prevent the default CSS to be included. The default CSS
+        // comes from autocomplete-theme-classic, which you can read more about here:
+        // https://www.algolia.com/doc/ui-libraries/autocomplete/api-reference/autocomplete-theme-classic/
+        style: undefined,
+
+        // lunr.js-specific settings
+        lunr: {
+          // When indexing your documents, their content is split into "tokens".
+          // Text entered into the search box is also tokenized.
+          // This setting configures the separator used to determine where to split the text into tokens.
+          // By default, it splits the text at whitespace and dashes.
+          //
+          // Note: Does not work for "ja" and "th" languages, since these use a different tokenizer.
+          tokenizerSeparator: /[\s\-]+/,
+          // https://lunrjs.com/guides/customising.html#similarity-tuning
+          //
+          // This parameter controls the importance given to the length of a document and its fields. This
+          // value must be between 0 and 1, and by default it has a value of 0.75. Reducing this value
+          // reduces the effect of different length documents on a term's importance to that document.
+          b: 0.75,
+          // This controls how quickly the boost given by a common word reaches saturation. Increasing it
+          // will slow down the rate of saturation and lower values result in quicker saturation. The
+          // default value is 1.2. If the collection of documents being indexed have high occurrences
+          // of words that are not covered by a stop word filter, these words can quickly dominate any
+          // similarity calculation. In these cases, this value can be reduced to get more balanced results.
+          k1: 1.2,
+          // By default, we rank pages where the search term appears in the title higher than pages where
+          // the search term appears in just the text. This is done by "boosting" title matches with a
+          // higher value than content matches. The concrete boosting behavior can be controlled by changing
+          // the following settings.
+          titleBoost: 5,
+          contentBoost: 1,
+          tagsBoost: 3,
+          parentCategoriesBoost: 2, // Only used when indexing is enabled for categories
+        },
       },
     ],
   ],
+
+  themeConfig:
+    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
+    {
+      colorMode: {
+        defaultMode: "light",
+        disableSwitch: true,
+      },
+      prism: {
+        theme: prismThemes.oneLight,
+        darkTheme: prismThemes.oneDark,
+        additionalLanguages: ["rust", "solidity", "toml", "yaml"],
+      },
+      navbar: {
+        logo: {
+          src: "img/logo.png",
+          alt: "Miden Logo",
+          height: 240,
+        },
+        title: "MIDEN",
+        items: [
+          {
+            type: "docsVersionDropdown",
+            position: "left",
+            dropdownActiveClassDisabled: true,
+          },
+          {
+            href: "https://github.com/0xMiden/",
+            label: "GitHub",
+            position: "right",
+          },
+        ],
+      },
+    },
 };
 export default config;