summaryrefslogtreecommitdiff
path: root/src/core/components/elements/Navbar/TopBanner.jsx
diff options
context:
space:
mode:
authortrisusilo48 <tri.susilo@altama.co.id>2024-09-09 10:01:12 +0700
committertrisusilo48 <tri.susilo@altama.co.id>2024-09-09 10:01:12 +0700
commitafd84f86d2f26a3e0347dab7552060717030df19 (patch)
treed63d095e16a6dd052fb7d6858e78c1aac1115794 /src/core/components/elements/Navbar/TopBanner.jsx
parentf8133c76306d9f70e01ac510c74dcfabe7f79b37 (diff)
parent495b327ba0a45b17f4f0156f846ebe8bddbcd075 (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.jsx35
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>
);
};