feat: merge navbar with banner (#117)

infinyon · Jul 19, 2024 · a8c9275 · a8c9275
1 parent 04718f8
commit a8c9275
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 57 deletions.
diff --git a/docusaurus.config.ts b/docusaurus.config.ts
@@ -115,8 +115,8 @@ const config: Config = {
     navbar: {
       logo: {
         alt: "InfinyOn Logo",
-        src: "img/fluvio-community-purple.png",
-        srcDark: "img/fluvio-community-blue.png",
+        src: "img/infinyon-gradient.png",
+        srcDark: "img/infinyon-white.png",
         style: {
           padding: '10px 0',
         }
@@ -161,11 +161,6 @@ const config: Config = {
           to: "news",
           label: "News",
         },
-        {
-          position: "right",
-          label: "FAQs",
-          to: "faqs",
-        },
         {
           type: "custom-Discord",
           position: "right",
@@ -186,6 +181,14 @@ const config: Config = {
               label: "Docs",
               href: "/docs",
             },
+            {
+              label: "FAQs",
+              href: "/faqs",
+            },
+            {
+              label: "News",
+              href: "/news",
+            },
           ],
         },
         {
@@ -199,11 +202,6 @@ const config: Config = {
               label: "Twitter",
               href: "https://twitter.com/infinyon",
             },
-          ],
-        },
-        {
-          title: "More",
-          items: [
             {
               label: "GitHub",
               href: FLUVIO_REPOSITORY_URL,

diff --git a/src/components/Layout/Header.tsx b/src/components/Layout/Header.tsx
diff --git a/src/theme/Navbar/Layout/index.tsx b/src/theme/Navbar/Layout/index.tsx
@@ -10,7 +10,6 @@ import NavbarMobileSidebar from '@theme/Navbar/MobileSidebar';
 import type {Props} from '@theme/Navbar/Layout';
 
 import styles from './styles.module.css';
-import Header from '@site/src/components/Layout/Header';
 
 function NavbarBackdrop(props: ComponentProps<'div'>) {
   return (
@@ -27,10 +26,9 @@ export default function NavbarLayout({children}: Props): JSX.Element {
     navbar: {hideOnScroll, style},
   } = useThemeConfig();
   const mobileSidebar = useNavbarMobileSidebar();
-  const {navbarRef, isNavbarVisible} = useHideableNavbar(hideOnScroll);
+  const { navbarRef, isNavbarVisible } = useHideableNavbar(hideOnScroll);
+
   return (
-    <>
-    <Header />
     <nav
       ref={navbarRef}
       aria-label={translate({
@@ -55,6 +53,5 @@ export default function NavbarLayout({children}: Props): JSX.Element {
       <NavbarBackdrop onClick={mobileSidebar.toggle} />
       <NavbarMobileSidebar />
     </nav>
-    </>
   );
 }
diff --git a/src/theme/Navbar/Logo/index.tsx b/src/theme/Navbar/Logo/index.tsx
@@ -0,0 +1,17 @@
+import React from "react";
+import Logo from "@theme/Logo";
+
+export default function NavbarLogo(): JSX.Element {
+  return (
+    <div className="flex items-center mr-4">
+      <Logo
+        className="navbar__brand mr-0"
+        imageClassName="navbar__logo"
+        titleClassName="navbar__title text--truncate"
+      />
+      <span className="text-red text-xs border border-solid py-0.5 px-1 rounded-md">
+        Docs
+      </span>
+    </div>
+  );
+}