Add Docsearch with credentials (#73) (#75)

* Add Docsearch with credentials

* Add algolia search and update font thickness

* Update text styling based on Rita's feedback

docusaurus.config.js

@@ -150,6 +150,13 @@ const config = {
         ],
 
       },
+      algolia: {
+        appId: 'D8OVOP2W00',
+        apiKey: 'e8ca930ec49db40b3701611a31f1010e',
+        indexName: "umentation-lisk",
+        contextualSearch: false,
+        debug: false,
+      },
       prism: {
         theme: prismThemes.github,
         darkTheme: prismThemes.oceanicNext,

package.json

@@ -14,6 +14,8 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
+    "@docsearch/css": "^3.5.2",
+    "@docsearch/react": "^3.5.2",
     "@docusaurus/core": "3.0.1",
     "@docusaurus/preset-classic": "3.0.1",
     "@mdx-js/react": "^3.0.0",

src/css/custom.css

@@ -22,7 +22,7 @@
   --ifm-color-primary-light: #4e88fc;
   --ifm-color-primary-lighter: #5c92fd;
   --ifm-color-primary-lightest: #89b0fd;
-  --ifm-font-family-base: 'Gilroy';
+  --ifm-font-family-base: 'Gilroy-Medium';
   --ifm-heading-font-family: 'Gilroy-Medium';
   --ifm-breadcrumb-item-background-active: rgba(64, 112, 244, 0.10);
   --ifm-tabs-color-active-border: rgba(64, 112, 244, 1);
@@ -71,7 +71,8 @@ a {
   display: inline-block;
   scroll-margin-top: var(--ifm-navbar-height);
 }
-  html[data-theme='dark'] .alert a {
+
+html[data-theme='dark'] .alert a {
   text-decoration-color: var(--ifm-color-primary);
 }
 

src/css/fonts.css

@@ -8,6 +8,11 @@
     src: url('/static/font/Gilroy-Bold.ttf') format('truetype');
 }
 
+@font-face {
+    font-family: "Gilroy-Black";
+    src: url('/static/font/Gilroy-Black.ttf') format('truetype');
+}
+
 @font-face {
     font-family: "Gilroy-BlackItalic";
     src: url('/static/font/Gilroy-BlackItalic.ttf') format('truetype');

src/css/sidebar.css

@@ -1,7 +1,7 @@
 /* Sidebar https://docusaurus.io/docs/next/styling-layout#theme-class-names */
 
 .theme-doc-sidebar-item-category-level-1>.menu__list-item-collapsible>.menu__link {
-  font-family: 'Gilroy-ExtraBold';
+  font-family: 'Gilroy-Bold';
   font-size: large;
   line-height: 2.5;
   text-overflow: ellipsis;