fix: image satker

This commit is contained in:
Sabda Yagra 2025-06-05 18:13:32 +07:00
parent cc9a1a7d55
commit f51469942e
3 changed files with 26 additions and 15 deletions

View File

@ -8,7 +8,7 @@ import { usePathname } from "next/navigation";
import Image from "next/image"; import Image from "next/image";
const regions = [ const regions = [
{ name: "ITWASUM POLRI", slug: "itwasum", logo: "/logo/satker/ITWASUM.png" }, { name: "ITWASUM POLRI", slug: "itwasum", logo: "/logo/satker/itwasum.png" },
{ name: "BAINTELKAM POLRI", slug: "baintelkam", logo: "/logo/satker/BAINTELKAM.png" }, { name: "BAINTELKAM POLRI", slug: "baintelkam", logo: "/logo/satker/BAINTELKAM.png" },
{ name: "BAHARKAM POLRI", slug: "baharkam", logo: "/logo/satker/BAHARKAM.png" }, { name: "BAHARKAM POLRI", slug: "baharkam", logo: "/logo/satker/BAHARKAM.png" },
{ name: "BARESKRIM POLRI", slug: "bareskrim", logo: "/logo/satker/BARESKRIM.png" }, { name: "BARESKRIM POLRI", slug: "bareskrim", logo: "/logo/satker/BARESKRIM.png" },

View File

@ -8,5 +8,15 @@ export const DynamicLogoSatker = () => {
const satker = pathname?.split("/")[3]; const satker = pathname?.split("/")[3];
console.log("satker", satker) console.log("satker", satker)
return <div className="p-2">{pathname?.includes("/satker") && <Image src={`/logo/satker/${satker}.png`} alt="Logo" width={1920} height={1080} className="object-contain h-[150px] w-[50px]" />}</div>; return <div className="p-2">
{pathname?.includes("/satker") && (
<img
src={`/logo/satker/${satker}.png`}
alt="Logo"
width={1920}
height={1080}
className="object-contain h-[150px] w-[50px]"
/>
)}
</div>;
}; };

View File

@ -514,7 +514,7 @@ const DetailImage = (data: any) => {
return ( return (
<> <>
<div className="w-full max-w-screen-xl mx-auto px-4 py-4"> <div className="w-full max-w-screen-xl mx-auto px-4 py-4">
<div className="rounded-md overflow-hidden md:flex"> <div className="rounded-md overflow-hidden md:flex flex-row justify-center">
{/* Bagian Kiri */} {/* Bagian Kiri */}
<div className=""> <div className="">
{/* Gambar Besar */} {/* Gambar Besar */}
@ -523,18 +523,19 @@ const DetailImage = (data: any) => {
<Skeleton className="rounded-lg h-[300px] w-screen lg:h-[600px] lg:w-[900px]" /> <Skeleton className="rounded-lg h-[300px] w-screen lg:h-[600px] lg:w-[900px]" />
</div> </div>
) : ( ) : (
<div className="relative"> <div className="relative self-end ml-auto">
<Image <Image
placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`} placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`}
width={2560} width={2560}
height={1440} height={1440}
src={detailDataImage?.files[selectedImage]?.url} src={detailDataImage?.files[selectedImage]?.url}
alt="Main" alt="Main"
className="rounded-lg w-fit max-h-screen object-contain" className="rounded-md w-full h-[670px] object-contain"
/> />
<div className="absolute top-4 right-4"></div>
</div>
<div className="absolute top-4 left-4"></div>
</div>
)} )}
{/* Gambar bawah Kecil */} {/* Gambar bawah Kecil */}
@ -615,7 +616,7 @@ const DetailImage = (data: any) => {
</div> </div>
{/* Bagian Kanan */} {/* Bagian Kanan */}
<div className="md:w-1/4 p-4 bg-[#f7f7f7] dark:bg-slate-600 h-fit rounded-lg mx-4"> <div className="p-4 bg-[#f7f7f7] dark:bg-slate-600 h-fit rounded-lg mx-4">
{isSaved ? ( {isSaved ? (
<a <a
onClick={() => handleDeleteWishlist()} onClick={() => handleDeleteWishlist()}