diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-07-30 13:25:14 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-07-30 13:25:14 +0700 |
| commit | de27df05af1f23d70099d36d11e07f35faff26c6 (patch) | |
| tree | ddf86f325ca95b6be19e4375acfc1cc4ec2547cd /src/core/components/elements | |
| parent | 593c508bb87451a985a5aec7e9d7bde45b18074b (diff) | |
<iman> update mobile view
Diffstat (limited to 'src/core/components/elements')
| -rw-r--r-- | src/core/components/elements/Navbar/NavbarMobile.jsx | 4 | ||||
| -rw-r--r-- | src/core/components/elements/Navbar/TopBanner.jsx | 29 |
2 files changed, 16 insertions, 17 deletions
diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx index bcf45e0a..90314671 100644 --- a/src/core/components/elements/Navbar/NavbarMobile.jsx +++ b/src/core/components/elements/Navbar/NavbarMobile.jsx @@ -11,7 +11,7 @@ import Image from 'next/image'; import { useEffect, useState } from 'react'; import MobileView from '../../views/MobileView'; import Link from '../Link/Link'; -// import TopBanner from './TopBanner'; +import TopBanner from './TopBanner'; const Search = dynamic(() => import('./Search')); @@ -39,7 +39,7 @@ const NavbarMobile = () => { return ( <MobileView> - {/* <TopBanner /> */} + <TopBanner /> <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='/'> diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index 83ef8c7a..df47e87d 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -1,12 +1,12 @@ import Image from 'next/image'; -import { useQuery } from 'react-query'; - +import { useQuery } from 'react-query';import useDevice from '@/core/hooks/useDevice' import odooApi from '@/core/api/odooApi'; import SmoothRender from '~/components/ui/smooth-render'; import Link from '../Link/Link'; import { background } from '@chakra-ui/react'; const TopBanner = () => { + const { isDesktop, isMobile } = useDevice() const topBanner = useQuery({ queryKey: 'topBanner', queryFn: async () => await odooApi('GET', '/api/v1/banner?type=top-banner'), @@ -20,22 +20,21 @@ const TopBanner = () => { return ( <SmoothRender isLoaded={hasData} - height='36px' + // height='36px' duration='700ms' delay='300ms' - > - <Link - href={data?.url} - className="block" - style={{ - backgroundImage: `url('${data?.image}')`, - backgroundPosition: 'center', - backgroundSize: 'cover', - height: '36px', - }} + className='h-auto' > - </Link> - </SmoothRender> + <Link + href={data?.url} + className="block bg-cover bg-center h-3 md:h-6 lg:h-[36px]" + style={{ + backgroundImage: `url('${data?.image}')`, + }} + > + </Link> + + </SmoothRender> ); }; |
