import { GitHubLogoIcon } from "@radix-ui/react-icons";
import Navbar from "./navbar";
import Sidebar from "./sidebar";
import { ThemeButton } from "./theme-button";
import { Button } from "./ui/button";

const Header = () => {
  return (
    <header className="sticky top-0 flex h-16 items-center border-b shadow-md gap-4 bg-background/30 backdrop-blur px-4 md:px-6 z-30">
      <Navbar />
      <Sidebar />
      <div className="flex w-full md:w-auto justify-end gap-4 md:ml-auto md:gap-2 lg:gap-4">
        <Button variant="ghost" size="icon" className="rounded-full">
          <GitHubLogoIcon className="h-[1.2rem] w-[1.2rem]" />
        </Button>
        <ThemeButton />
      </div>
    </header>
  );
};

export default Header;