change navbar

1 files changed, 36 insertions, 0 deletions

diff --git a/src/core/components/elements/Navbar/Navbar.jsx b/src/core/components/elements/Navbar/Navbar.jsx
new file mode 100644
index 00000000..e7f447eb
--- /dev/null
+++ b/src/core/components/elements/Navbar/Navbar.jsx
@@ -0,0 +1,36 @@
+import Image from "next/image"
+import IndoteknikLogo from "@/images/logo.png"
+import { Bars3Icon, HeartIcon, ShoppingCartIcon } from "@heroicons/react/24/outline"
+import Link from "../Link/Link"
+import Search from "./Search"
+import useSidebar from "@/core/hooks/useSidebar"
+
+const Navbar = () => {
+  const { Sidebar, open } = useSidebar()
+  return (
+    <>
+      <nav className="px-4 py-2 pb-3 sticky top-0 z-50 bg-white shadow">
+        <div className="flex justify-between items-center mb-2">
+          <Link href="/">
+            <Image src={IndoteknikLogo} alt="Indoteknik Logo" width={120} height={40} />
+          </Link>
+          <div className="flex gap-x-3">
+            <button type="button">
+              <HeartIcon className="w-6 text-gray_r-12" />
+            </button>
+            <Link href="/shop/cart">
+              <ShoppingCartIcon className="w-6 text-gray_r-12" />
+            </Link>
+            <button type="button" onClick={open}>
+              <Bars3Icon className="w-6 text-gray_r-12" />
+            </button>
+          </div>
+        </div>
+        <Search />
+      </nav>
+      { Sidebar }
+    </>
+  )
+}
+
+export default Navbar
\ No newline at end of file