Skip to main content

Header

The Header component is the main navigation bar for the website.

Usage​

import Header from "@/components/website-layout/Header";

function Layout({ children }) {
  return (
    <>
      <Header />
      <main>{children}</main>
    </>
  );
}

Props​

  • hidePricing: Boolean to hide the pricing link (default: false)
  • hideFAQ: Boolean to hide the FAQ link (default: false)

Functionality​

  • Displays the website logo and name
  • Provides navigation links (Pricing, FAQ)
  • Includes a login button
  • Implements a responsive design with a mobile menu
  • Supports theme toggling (light/dark mode)

Customization​

The component uses Tailwind CSS for styling and Framer Motion for animations. You can customize the appearance by modifying the CSS classes or updating the animation configurations.