category, brand, product popular, product category in desktop home page

1 files changed, 48 insertions, 0 deletions

diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx
new file mode 100644
index 00000000..3998875b
--- /dev/null
+++ b/src/core/components/elements/Navbar/NavbarMobile.jsx
@@ -0,0 +1,48 @@
+import Image from 'next/image'
+import MobileView from '../../views/MobileView'
+import Link from '../Link/Link'
+import { Bars3Icon, HeartIcon, ShoppingCartIcon } from '@heroicons/react/24/outline'
+import useSidebar from '@/core/hooks/useSidebar'
+import dynamic from 'next/dynamic'
+import IndoteknikLogo from '@/images/logo.png'
+
+const Search = dynamic(() => import('./Search'))
+
+const NavbarMobile = () => {
+  const { Sidebar, open } = useSidebar()
+
+  return (
+    <MobileView>
+      <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'>
+            <Link href='/my/wishlist'>
+              <HeartIcon className='w-6 text-gray_r-12' />
+            </Link>
+            <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}
+    </MobileView>
+  )
+}
+
+export default NavbarMobile