fix: image satker

components/landing-page/division.tsx

@@ -8,7 +8,7 @@ import { usePathname } from "next/navigation";
 import Image from "next/image";
 
 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: "BAHARKAM POLRI", slug: "baharkam", logo: "/logo/satker/BAHARKAM.png" },
   { name: "BARESKRIM POLRI", slug: "bareskrim", logo: "/logo/satker/BARESKRIM.png" },

components/landing-page/dynamic-logo-satker.tsx

@@ -8,5 +8,15 @@ export const DynamicLogoSatker = () => {
   const satker = pathname?.split("/")[3];
   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>;
 };

components/main/image-detail.tsx

@@ -514,7 +514,7 @@ const DetailImage = (data: any) => {
   return (
     <>
       <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 */}
           <div className="">
             {/* Gambar Besar */}
@@ -523,18 +523,19 @@ const DetailImage = (data: any) => {
                 <Skeleton className="rounded-lg h-[300px] w-screen lg:h-[600px] lg:w-[900px]" />
               </div>
             ) : (
-              <div className="relative">
-                <Image
-  placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`}
-  width={2560}
-  height={1440}
-  src={detailDataImage?.files[selectedImage]?.url}
-  alt="Main"
-  className="rounded-lg w-fit max-h-screen object-contain"
-/>
+              <div className="relative self-end ml-auto">
+  <Image
+    placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`}
+    width={2560}
+    height={1440}
+    src={detailDataImage?.files[selectedImage]?.url}
+    alt="Main"
+    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 */}
@@ -615,7 +616,7 @@ const DetailImage = (data: any) => {
           </div>
 
           {/* 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 ? (
               <a
                 onClick={() => handleDeleteWishlist()}