docs: redesigned documentation (#2539)

* docs: redesigned navigation bar (#2478)

* docs: redesigned homepage (#2480)

* docs: redesigned homepage

* fixed link

* docs: redesigned notes (#2491)

* docs: Applied Typography redesign rules (#2516)

* changes to typography

* small changes and fixes

* docs: redesigned table of content (#2518)

* redesigning toc

* finalized table of content design

* docs: redesigned code blocks (#2519)

* docs: redesigned code blocks

* removed unused package

* docs: redesigned survey and content footer (#2522)

* fixes to inline code

* redesigned doc footer

* docs: redesigned footer (#2523)

* docs: changed dark mode colors (#2524)

* docs: redesigned sidebar (#2535)

* docs: redesigned search modal (#2537)

* docs: resolved loose ends (#2538)

* added spacing for tabs

* docs: added no-zoom class for deploy images

* fix to tooltip design for inline code

www/docs/src/theme/DocSidebar/Desktop/index.js

@@ -6,6 +6,7 @@ import CollapseButton from '@theme/DocSidebar/Desktop/CollapseButton';
 import Content from '@theme/DocSidebar/Desktop/Content';
 import styles from './styles.module.css';
 import DocSidebarItem from '@theme/DocSidebarItem';
+import SearchBar from '../../SearchBar'
 
 function DocSidebarDesktop({path, sidebar, onCollapse, isHidden}) {
   const {
@@ -24,16 +25,21 @@ function DocSidebarDesktop({path, sidebar, onCollapse, isHidden}) {
         isHidden && styles.sidebarHidden,
       )}>
       {hideOnScroll && <Logo tabIndex={-1} className={styles.sidebarLogo} />}
+      <div className={styles.sidebarSearchContainer}>
+        <SearchBar />
+      </div>
       <Content path={path} sidebar={sidebar} />
-      <ul className={
-        clsx(
-          styles.sidebarFooterList
-        )
-      }>
-        {sidebarFooter.map((item, index) => (
-          <DocSidebarItem key={index} item={item} index={index} level={1} />
-        ))}
-      </ul>
+      {sidebarFooter.length > 0 && (
+        <ul className={
+          clsx(
+            styles.sidebarFooterList
+          )
+        }>
+          {sidebarFooter.map((item, index) => (
+            <DocSidebarItem key={index} item={item} index={index} level={1} />
+          ))}
+        </ul>
+      )}
       {hideable && <CollapseButton onClick={onCollapse} />}
     </div>
   );

www/docs/src/theme/DocSidebar/Desktop/styles.module.css

@@ -51,4 +51,8 @@
 
 .sidebarFooterList li a {
   padding-left: 1.8em !important;
+}
+
+.sidebarSearchContainer {
+  margin: 24px 16px 24px;
 }