This commit is contained in:
Sabda Yagra 2025-06-18 13:59:33 +07:00
parent 89c42c0f24
commit c64c6c3685
7 changed files with 42 additions and 23 deletions

View File

@ -702,7 +702,10 @@ const FilterPage = () => {
{/* <img src={video?.thumbnailLink} className="h-60 object-cover items-center justify-center cursor-pointer rounded-lg place-self-center" /> */}
<div className="img-container h-60 bg-[#e9e9e9] cursor-pointer rounded-lg">
<ImageBlurry
src={video?.thumbnailLink}
src={
video?.smallThumbnailLink ||
video?.thumbnailLink
}
alt={video?.title}
style={{
objectFit: "contain",

View File

@ -81,7 +81,7 @@ const ContentCategory = (props: { group?: string; type: string }) => {
alt="category"
width={2560}
height={1440}
src={category?.thumbnailLink}
src={category?.smallThumbnailLink}
className="w-full lg:h-[300px] h-40 object-cover group-hover:scale-110 transition-transform duration-300"
/>

View File

@ -150,7 +150,7 @@ const HeroModal = ({
</button>
<Image
src={list?.thumbnailLink}
src={list?.smallThumbnailLink}
alt="gambar-utama"
width={1920}
height={1080}
@ -364,7 +364,7 @@ const HeroNew = (props: { group?: string }) => {
<div className="relative h-[310px] lg:h-[700px]">
{/* Gambar */}
<Image
src={list?.thumbnailLink}
src={list?.smallThumbnailLink}
alt="gambar"
fill
className="object-cover w-full h-full"

View File

@ -153,7 +153,7 @@ const NewContent = (props: { group: string; type: string }) => {
<div onClick={() => router.push(prefixPath + `/image/detail/${image?.slug}`)} className="cursor-pointer relative group overflow-hidden bg-white rounded-xl shadow-md hover:shadow-lg transition-shadow duration-300">
{/* Image with motion effect */}
<motion.div className="w-full h-48 lg:h-60" whileHover={{ scale: 0.95 }} transition={{ duration: 0.3 }}>
<Image placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`} width={2560} height={1440} alt="image" src={image?.thumbnailLink} className="w-full h-full object-cover" />
<Image placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`} width={2560} height={1440} alt="image" src={image?.smallThumbnailLink} className="w-full h-full object-cover" />
</motion.div>
{/* Badge category */}
@ -258,7 +258,7 @@ const NewContent = (props: { group: string; type: string }) => {
<div onClick={() => router.push(prefixPath + `/video/detail/${video?.slug}`)} className="cursor-pointer relative group overflow-hidden bg-white rounded-xl shadow-md hover:shadow-lg transition-shadow duration-300">
{/* Image with motion effect */}
<motion.div className="w-full h-48 lg:h-60" whileHover={{ scale: 0.95 }} transition={{ duration: 0.3 }}>
<Image placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`} alt="video" width={2560} height={1440} src={video?.thumbnailLink} className="w-full h-full object-cover" />
<Image placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(700, 475))}`} alt="video" width={2560} height={1440} src={video?.smallThumbnailLink} className="w-full h-full object-cover" />
</motion.div>
{/* Badge category */}

View File

@ -131,7 +131,7 @@ const ScrollableContent = () => {
: `${locale}/audio/detail/${item?.slug}`
}
>
<Image src={item?.thumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
<Image src={item?.smallThumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
<div className="absolute top-2 right-2 bg-[#c03724] rounded-full p-1 shadow">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g fill="none">
@ -252,7 +252,7 @@ const ScrollableContent = () => {
: `${locale}/audio/detail/${item?.slug}`
}
>
<Image src={item?.thumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
<Image src={item?.smallThumbnailLink} alt={item?.title} layout="fill" objectFit="cover" />
<div className="absolute top-2 right-2 bg-[#c03724] rounded-full p-1 shadow">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g fill="none">

View File

@ -39,18 +39,21 @@ import $ from "jquery";
import { useTranslations } from "next-intl";
import { postActivityLog } from "@/service/content/content";
const formWaveSurferOptions = (ref: any) => ({
container: ref,
waveColor: "#eee",
progressColor: "OrangeRed",
cursorColor: "OrangeRed",
barWidth: 3,
barRadius: 3,
responsive: true,
height: 150,
normalize: true,
partialRender: true,
});
const formWaveSurferOptions = (container: HTMLElement | null) => {
if (!container) throw new Error("Waveform container is null");
return {
container,
waveColor: "#E0E0E0",
progressColor: "#FFC831",
cursorColor: "#000",
barWidth: 2,
barRadius: 2,
responsive: true,
height: 80,
normalize: true,
partialRender: true,
};
};
const DetailAudio = () => {
const [selectedSize, setSelectedSize] = useState<string>("L");
@ -1209,7 +1212,7 @@ const DetailAudio = () => {
</div>
{/* Konten Serupa */}
<div className="px-4">
<div className="px-4 lg:px-20">
<NewContent group="mabes" type={"similar"} />
</div>
</div>

View File

@ -452,13 +452,26 @@ const DetailDocument = () => {
<div className="rounded-md overflow-hidden md:flex">
{/* Bagian Kiri */}
<div className="md:w-3/4">
<div className="relative">
{/* <div className="relative">
<img
src={detailDataDocument?.files[selectedDocument]?.url}
alt="Main"
className="rounded-lg w-auto h-fit"
/>
<div className="absolute top-4 left-4"></div>
</div> */}
<div className="bg-[#e0c350] flex items-center justify-center h-[170px] text-white">
<svg
xmlns="http://www.w3.org/2000/svg"
width="150"
height="150"
viewBox="0 0 16 16"
>
<path
fill="currentColor"
d="M5 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V5.414a1.5 1.5 0 0 0-.44-1.06L9.647 1.439A1.5 1.5 0 0 0 8.586 1zM4 3a1 1 0 0 1 1-1h3v2.5A1.5 1.5 0 0 0 9.5 6H12v7a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1zm7.793 2H9.5a.5.5 0 0 1-.5-.5V2.207zM7 7.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5M7.5 9a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1zM7 11.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5M5.5 8a.5.5 0 1 0 0-1a.5.5 0 0 0 0 1M6 9.5a.5.5 0 1 1-1 0a.5.5 0 0 1 1 0M5.5 12a.5.5 0 1 0 0-1a.5.5 0 0 0 0 1"
/>
</svg>
</div>
{/* Footer Informasi */}
@ -1038,7 +1051,7 @@ const DetailDocument = () => {
</div>
{/* Konten Serupa */}
<div className="">
<div className="px-4 lg:px-20">
<NewContent group="mabes" type={"similar"} />
</div>
</div>