From f553306c157cad5daab04085a2db7f671760712c Mon Sep 17 00:00:00 2001
From: Rama Priyanto <priyantorama12@gmail.com>
Date: Fri, 14 Feb 2025 10:05:52 +0700
Subject: [PATCH] update landing, list article

---
 components/layout/navbar/NavbarHumas.tsx | 124 +++++++++++------------
 components/main/detail/list-news.tsx     |   2 +-
 2 files changed, 63 insertions(+), 63 deletions(-)

diff --git a/components/layout/navbar/NavbarHumas.tsx b/components/layout/navbar/NavbarHumas.tsx
index 09a6c8e..593151e 100644
--- a/components/layout/navbar/NavbarHumas.tsx
+++ b/components/layout/navbar/NavbarHumas.tsx
@@ -193,11 +193,11 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at4.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at4.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">SP2HP</p>
-                      <p className="text-ellipsis text-[12px] font-light overflow-hidden">
+                      <p className="text-[12px] font-light overflow-hidden">
                         Pelayanan Surat Pemberitahuan Perkembangan Hasil
                         Penyidikan Online
                       </p>
@@ -205,8 +205,8 @@ export default function NavbarHumas(props: { size: string }) {
                   </div>
                 </DropdownItem>
                 <DropdownItem key="Formulir Permohonan Informasi">
-                  <div className="flex flex-row gap-2">
-                    <img src="pm2.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm2.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">
                         Formulir Permohonan Informasi
@@ -226,11 +226,11 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm3.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm3.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Pelayanan SIM</p>
-                      <p className="text-ellipsis text-[12px] font-light overflow-hidden">
+                      <p className="text-[12px] font-light overflow-hidden">
                         Pelayanan Untuk Pendaftaran SIM dan Perpanjangan SIM
                         Berbasis Online
                       </p>
@@ -241,8 +241,8 @@ export default function NavbarHumas(props: { size: string }) {
                   key={"erikkes"}
                   onPress={() => window.open("https://erikkes.id/", "_blank")}
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm4.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm4.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">
                         Pelayanan e-Rikkes SIM
@@ -258,8 +258,8 @@ export default function NavbarHumas(props: { size: string }) {
                   key={"eppsi"}
                   onPress={() => window.open("https://eppsi.id/", "_blank")}
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm5.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm5.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">
                         Pelayanan Test Psikologi SIM
@@ -279,8 +279,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm6.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm6.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">Pelayanan e-Avis</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -295,8 +295,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://samsatdigital.id/", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm7.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm7.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Pelayanan Samsat Digital
@@ -313,8 +313,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://skck.polri.go.id/", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm8.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm8.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">Pelayanan SKCK</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -332,8 +332,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm9.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm9.png" className="w-[50px] h-[50px] " />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Pelayanan Propam Presisi
@@ -351,8 +351,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://dumaspresisi.polri.go.id/", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm10.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm10.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Pelayanan Dumas Presisi{" "}
@@ -370,8 +370,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://bos.polri.go.id/login", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm11.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm11.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">Pelayanan Binmas </p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -390,8 +390,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm12.png" className="w-[35px]" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm12.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Clean & Clear Polri{" "}
@@ -701,8 +701,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at1.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at1.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Polri Super App</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -721,8 +721,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at2.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at2.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Media Hub</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -740,8 +740,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at3.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at3.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Polisiku</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -760,8 +760,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at4.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at4.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">SP2HP</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -779,8 +779,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at5.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at5.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Polri TV</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -798,8 +798,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at6.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at6.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Polri Radio</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -817,8 +817,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm6.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm6.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">e-Avis</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -831,8 +831,8 @@ export default function NavbarHumas(props: { size: string }) {
                   key="erikkes"
                   onPress={() => window.open("https://erikkes.id/", "_blank")}
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm4.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm4.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">e-Rikkes</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -847,8 +847,8 @@ export default function NavbarHumas(props: { size: string }) {
                   key="eppsi"
                   onPress={() => window.open("https://eppsi.id/", "_blank")}
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm5.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm5.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">e-PPSI</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -863,8 +863,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://bos.polri.go.id/login", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm11.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm11.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">BOS </p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -883,8 +883,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm7.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm7.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">Signal</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -899,8 +899,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://skck.polri.go.id/", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm8.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm8.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">SKCK Online</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -918,8 +918,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm9.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm9.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">Propam Presisi</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
@@ -938,8 +938,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at14.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at14.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Monitoring Presisi
@@ -957,8 +957,8 @@ export default function NavbarHumas(props: { size: string }) {
                     window.open("https://penerimaan.polri.go.id/", "_blank")
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at15.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at15.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         SDM - Penerimaan POLRI
@@ -978,8 +978,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="at16.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="at16.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Whistle Blowing System{" "}
@@ -1019,8 +1019,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm12.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm12.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col">
                       <p className="text-[16px] font-bold">
                         Clean and Clear POLRI{" "}
@@ -1040,8 +1040,8 @@ export default function NavbarHumas(props: { size: string }) {
                     )
                   }
                 >
-                  <div className="flex flex-row gap-2">
-                    <img src="pm3.png" />
+                  <div className="flex flex-row gap-2 items-center">
+                    <img src="pm3.png" className="w-[50px] h-[50px]" />
                     <div className="flex flex-col  ">
                       <p className="text-[16px] font-bold">Sinar</p>
                       <p className="text-ellipsis text-[12px] font-light overflow-hidden">
diff --git a/components/main/detail/list-news.tsx b/components/main/detail/list-news.tsx
index 7c6edf1..c4ee979 100644
--- a/components/main/detail/list-news.tsx
+++ b/components/main/detail/list-news.tsx
@@ -99,7 +99,7 @@ export default function ListNews() {
               </div>
               <div className="p-2 lg:p-5 bg-[#f0f0f0] rounded-b-md">
                 <div className="font-semibold text-lg">{news?.title}</div>
-                <div className="flex flex-row items-center py-1 text-xs gap-2">
+                <div className="flex flex-row items-center py-1 text-[10px] gap-2">
                   <div className="flex flex-row items-center gap-1">
                     <CalendarIcon size={18} />
                     <p>{formatMonthString(news?.updatedAt)}</p>