diff options
| author | trisusilo48 <tri.susilo@altama.co.id> | 2024-09-09 10:01:12 +0700 |
|---|---|---|
| committer | trisusilo48 <tri.susilo@altama.co.id> | 2024-09-09 10:01:12 +0700 |
| commit | afd84f86d2f26a3e0347dab7552060717030df19 (patch) | |
| tree | d63d095e16a6dd052fb7d6858e78c1aac1115794 /src/core/components/elements/Navbar/TopBanner.jsx | |
| parent | f8133c76306d9f70e01ac510c74dcfabe7f79b37 (diff) | |
| parent | 495b327ba0a45b17f4f0156f846ebe8bddbcd075 (diff) | |
Merge branch 'release' into CR/product_detail
# Conflicts:
# src-migrate/modules/product-detail/components/ProductDetail.tsx
Diffstat (limited to 'src/core/components/elements/Navbar/TopBanner.jsx')
| -rw-r--r-- | src/core/components/elements/Navbar/TopBanner.jsx | 35 |
1 files changed, 18 insertions, 17 deletions
diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index 7bc8fb6a..f438ae67 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -1,19 +1,20 @@ 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'; import { useEffect } from 'react'; -const TopBanner = ({ onLoad }) => { +const TopBanner = ({ onLoad = () => {} }) => { + const { isDesktop, isMobile } = useDevice() const topBanner = useQuery({ queryKey: 'topBanner', queryFn: async () => await odooApi('GET', '/api/v1/banner?type=top-banner'), refetchOnWindowFocus: false, }); - const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent'; + // const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent'; const hasData = topBanner.data?.length > 0; const data = topBanner.data?.[0] || null; @@ -26,21 +27,21 @@ const TopBanner = ({ onLoad }) => { return ( <SmoothRender isLoaded={hasData} - height='36px' + // height='36px' duration='700ms' delay='300ms' - style={{ backgroundColor }} - > - <Link href={data?.url}> - <Image - src={data?.image} - alt={data?.name} - width={1440} - height={40} - className='object-cover object-center h-full mx-auto' - /> - </Link> - </SmoothRender> + className='h-auto' + > + <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> ); }; |
