summaryrefslogtreecommitdiff
path: root/src/core/components/elements
diff options
context:
space:
mode:
Diffstat (limited to 'src/core/components/elements')
-rw-r--r--src/core/components/elements/Footer/BasicFooter.jsx127
-rw-r--r--src/core/components/elements/Footer/SimpleFooter.jsx2
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx117
3 files changed, 174 insertions, 72 deletions
diff --git a/src/core/components/elements/Footer/BasicFooter.jsx b/src/core/components/elements/Footer/BasicFooter.jsx
index 28a3764c..6129143d 100644
--- a/src/core/components/elements/Footer/BasicFooter.jsx
+++ b/src/core/components/elements/Footer/BasicFooter.jsx
@@ -41,6 +41,8 @@ const BasicFooter = () => {
<Form />
<CustomerGuide />
<Payments />
+ <Shippings />
+ <Secures />
</div>
<div className='w-full mt-8 leading-5 text-caption-2 text-gray_r-12/80'>
@@ -53,7 +55,7 @@ const BasicFooter = () => {
<DesktopView>
<footer className='bg-gray_r-3 py-6'>
<div className='container mx-auto flex flex-wrap justify-between'>
- <div className='w-3/12'>
+ <div className='w-4/12'>
<NextImage
src={IndoteknikLogo}
alt='Logo Indoteknik'
@@ -64,27 +66,40 @@ const BasicFooter = () => {
PT. Indoteknik Dotcom Gemilang
</div>
<InformationCenter />
+ <div className='h-4' />
+ <OfficeLocation />
+ <div className='h-4' />
+ <OpenHours />
</div>
- <CustomerGuide />
- <Form />
- <AboutUs />
+
+ <div className='w-2/12'>
+ <CustomerGuide />
+ <div className='h-6' />
+ <Form />
+ </div>
+
+ <div className='w-2/12'>
+ <AboutUs />
+ </div>
+
<div className='w-3/12'>
- <div className='grid grid-cols-1 gap-y-4'>
- <OfficeLocation />
- {/* <WarehouseLocation /> */}
- <OpenHours />
+ <div className='grid grid-cols-1 gap-y-6'>
<Payments />
+ <Shippings />
+ <Secures />
</div>
</div>
+
<hr className='w-full my-4 border-gray_r-7' />
+
<div className='w-full flex justify-between items-center'>
<div className='text-caption-1'>
Copyright © 2007 - {new Date().getFullYear()}, PT. Indoteknik
Dotcom Gemilang
</div>
- <div>
+ {/* <div>
<SocialMedias />
- </div>
+ </div> */}
</div>
</div>
</footer>
@@ -256,7 +271,7 @@ const InformationCenter = () => (
<li className='text-gray_r-12/80 flex items-center'>
<DevicePhoneMobileIcon className='w-[18px] mr-2' />
<a href={whatsappUrl()} target='_blank' rel='noreferrer'>
- 0812-8080-622
+ 0817-1718-1922
</a>
</li>
</ul>
@@ -286,7 +301,7 @@ const SocialMedias = () => (
<a
target='_blank'
rel='noreferrer'
- href='https://www.youtube.com/@indoteknikb2bindustriale-c778'
+ href='https://www.youtube.com/@indoteknikcom'
>
<NextImage
src='/images/socials/youtube.webp'
@@ -369,57 +384,43 @@ const SocialMedias = () => (
const Payments = () => (
<div>
- <div className={headerClassName}>Pembayaran</div>
- <div className='flex flex-wrap gap-2'>
- <NextImage
- src='/images/payments/bca.png'
- alt='Bank BCA Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/bni.png'
- alt='Bank BNI Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/bri.png'
- alt='Bank BRI Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/gopay.png'
- alt='Gopay Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/mandiri.png'
- alt='Bank Mandiri Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/mastercard.png'
- alt='Mastercard Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/permata.png'
- alt='Bank Permata Logo'
- width={48}
- height={24}
- />
- <NextImage
- src='/images/payments/visa.png'
- alt='Visa Logo'
- width={48}
- height={24}
- />
- </div>
+ <div className={headerClassName}>Metode Pembayaran</div>
+ <NextImage
+ src='/images/footer/payment-method-new.png'
+ alt='Metode Pembayaran - Indoteknik'
+ width={512}
+ height={512}
+ quality={100}
+ className='w-full'
+ />
+ </div>
+);
+
+const Shippings = () => (
+ <div>
+ <div className={headerClassName}>Jasa Pengiriman</div>
+ <NextImage
+ src='/images/footer/shippings.png'
+ alt='Jasa Pengiriman - Indoteknik'
+ width={512}
+ height={512}
+ quality={100}
+ className='w-full'
+ />
+ </div>
+);
+
+const Secures = () => (
+ <div>
+ <div className={headerClassName}>Keamanan Belanja</div>
+ <NextImage
+ src='/images/footer/secures.png'
+ alt='Keamanan Belanja - Indoteknik'
+ width={512}
+ height={512}
+ quality={100}
+ className='w-full'
+ />
</div>
);
diff --git a/src/core/components/elements/Footer/SimpleFooter.jsx b/src/core/components/elements/Footer/SimpleFooter.jsx
index 26f7f786..371b1652 100644
--- a/src/core/components/elements/Footer/SimpleFooter.jsx
+++ b/src/core/components/elements/Footer/SimpleFooter.jsx
@@ -22,7 +22,7 @@ const SimpleFooter = () => (
<li className='text-gray_r-12/80 flex items-center'>
<DevicePhoneMobileIcon className='w-[18px] mr-2' />
<a href={whatsappUrl()} target='_blank' rel='noreferrer'>
- 0812-8080-622
+ 081717181922
</a>
</li>
</ul>
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index e11ad214..308f2623 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -18,6 +18,7 @@ import { useEffect, useState } from 'react';
import DesktopView from '../../views/DesktopView';
import Link from '../Link/Link';
import NavbarUserDropdown from './NavbarUserDropdown';
+import NextImage from 'next/image';
const Search = dynamic(() => import('./Search'), { ssr: false });
const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false });
@@ -69,12 +70,17 @@ const NavbarDesktop = () => {
return (
<DesktopView>
<TopBanner />
- <div className='py-3 bg-warning-400' id='desktop-nav-top'>
+ <div className='py-2 bg-warning-400' id='desktop-nav-top'>
<div className='container mx-auto flex justify-between'>
- <Link href='/tentang-kami' className='!text-gray_r-12'>
- Tentang Indoteknik.com
- </Link>
+ <div className='flex items-start gap-5'>
+ <div>
+ <SocialMedias />
+ </div>
+ </div>
<div className='flex gap-x-6'>
+ <Link href='/tentang-kami' className='!text-gray_r-12'>
+ Tentang Indoteknik.com
+ </Link>
<Link href='/my/pembayaran-tempo' className='!text-gray_r-12'>
Pembayaran Tempo
</Link>
@@ -136,7 +142,7 @@ const NavbarDesktop = () => {
/>
<div>
<div className='font-semibold'>Whatsapp</div>
- 0812 8080 622 (Chat)
+ 0817 1718 1922 (Chat)
</div>
</a>
</div>
@@ -166,7 +172,9 @@ const NavbarDesktop = () => {
<div className='w-6/12 flex px-1 divide-x divide-gray_r-6'>
<Link
href='/shop/brands'
- className={`${router.asPath === '/shop/brands' && 'bg-gray_r-3'} p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
+ className={`${
+ router.asPath === '/shop/brands' && 'bg-gray_r-3'
+ } p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
target='_blank'
rel='noreferrer'
>
@@ -174,7 +182,10 @@ const NavbarDesktop = () => {
</Link>
<Link
href='/shop/search?orderBy=stock'
- className={`${router.asPath === '/shop/search?orderBy=stock' && 'bg-gray_r-3'} p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
+ className={`${
+ router.asPath === '/shop/search?orderBy=stock' &&
+ 'bg-gray_r-3'
+ } p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
target='_blank'
rel='noreferrer'
>
@@ -190,7 +201,9 @@ const NavbarDesktop = () => {
</Link>
<Link
href='/video'
- className={`${router.asPath === '/video' && 'bg-gray_r-3'} p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
+ className={`${
+ router.asPath === '/video' && 'bg-gray_r-3'
+ } p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition`}
target='_blank'
rel='noreferrer'
>
@@ -234,4 +247,92 @@ const NavbarDesktop = () => {
);
};
+const SocialMedias = () => (
+ <div>
+ {/* <div className={headerClassName + 'block md:hidden'}>Temukan Kami</div> */}
+ <div className='flex flex-wrap gap-3 items-start'>
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://www.youtube.com/@indoteknikcom'
+ >
+ <NextImage
+ src='/images/socials/youtube.webp'
+ alt='Youtube - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://www.tiktok.com/@indoteknikcom'
+ >
+ <NextImage
+ src='/images/socials/tiktok.png'
+ alt='TikTok - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ {/* <a target='_blank' rel='noreferrer' href={whatsappUrl(null)}>
+ <NextImage
+ src='/images/socials/Whatsapp.png'
+ alt='Whatsapp - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a> */}
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://www.facebook.com/indoteknikcom'
+ >
+ <NextImage
+ src='/images/socials/Facebook.png'
+ alt='Facebook - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://www.instagram.com/indoteknikcom/'
+ >
+ <NextImage
+ src='/images/socials/Instagram.png'
+ alt='Instagram - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://www.linkedin.com/company/pt-indoteknik-dotcom-gemilang/'
+ >
+ <NextImage
+ src='/images/socials/Linkedin.png'
+ alt='Linkedin - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ <a
+ target='_blank'
+ rel='noreferrer'
+ href='https://goo.gl/maps/GF8EmDjpQTHZPsJ1A'
+ >
+ <NextImage
+ src='/images/socials/g_maps.png'
+ alt='Maps - Indoteknik.com'
+ width={24}
+ height={24}
+ />
+ </a>
+ </div>
+ </div>
+);
+
export default NavbarDesktop;