docs(website): apply mobile navbar design (wix#3922)

website/src/css/_navbar.scss

@@ -22,3 +22,53 @@
   padding: 5px;
   font-weight: 300;
 }
+/*===========*/
+
+/* Restyle logo & hamburger button */
+
+.navbar {
+  height: 70px;
+
+  &__items {
+    &--right {
+      position: relative;
+    }
+  }
+
+  &__logo {
+    height: 26px;
+    margin: 0 10px 0 8px;
+  }
+
+  &__toggle {
+    width: 40px;
+    height: 40px;
+    background-color: var(--detox-color-a3);
+    border-radius: 10px;
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+@media (max-width: 768px) {
+  .navbar__toggle {
+    position: absolute;
+    margin: 0;
+    top: 15px;
+    right: 25px;
+  }
+}
+
+/* Restyle search button */
+
+@media (max-width: 768px) {
+  button.DocSearch-Button {
+    background-color: var(--detox-color-a3);
+    height: 40px;
+    border-radius: 10px;
+    padding: 0 10px;
+  }
+  .DocSearch-Search-Icon {
+    opacity: 0.6;
+  }
+}

website/src/theme/Icon/Menu/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+export default function IconMenu({ width = 19, height = 12, className, ...restProps }) {
+  return (
+    <svg className={className} width={width} height={height} viewBox="0 0 19 12" fill="currentColor" aria-hidden="true" {...restProps}>
+      <rect x="0.5" y="5.5" width="18" height="1" rx="0.5" stroke="currentColor" strokeLinecap="round" />
+      <rect x="0.5" y="10.5" width="18" height="1" rx="0.5" stroke="currentColor" strokeLinecap="round" />
+      <rect x="0.5" y="0.5" width="18" height="1" rx="0.5" stroke="currentColor" strokeLinecap="round" />
+    </svg>
+  );
+}

website/src/theme/Navbar/Search/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import Search from '@theme-original/Navbar/Search';
+import styles from './styles.module.scss';
+
+export default function SearchWrapper(props) {
+  return (
+    <>
+      <Search className={styles.searchWrapper} {...props} />
+    </>
+  );
+}

website/src/theme/Navbar/Search/styles.module.scss

@@ -0,0 +1,5 @@
+@media (max-width: 768px) {
+  .searchWrapper {
+    right: 64px;
+  }
+}