MythEclipse/imphnen-frontend-service
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Fix gacha image preview

Browse Source 
- Menggunakan pendekatan simpan gambar clipped langsung daripada mengatur secara dinamis menggunakan CSS object-position
This commit is contained in:
Hafid Nur
2025-03-27 15:00:04 +07:00
parent 0bcc8f7f6a
commit 7f9a106fca
3 changed files with 7 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/backoffice/public/gacha-clip.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

apps/backoffice/public/lanyard-id-card.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 6.0 MiB

apps/backoffice/src/app/dashboard/page.tsx
+7 -8
View File
@@ -55,7 +55,7 @@ export const Components: FC = (): ReactElement => {
{[1, 2, 3, 4, 5, 6].map((item) => ( {[1, 2, 3, 4, 5, 6].map((item) => (
<div <div
key={item} key={item}
className="bg-white max-h-[80px] overflow-clip rounded-lg shadow-sm flex justify-between items-center border border-neutral-100" className="bg-white max-h-[80px] overflow-clip rounded-lg shadow-sm flex justify-between border border-neutral-100"
> >
<div className="flex flex-col py-4 px-6 gap-4"> <div className="flex flex-col py-4 px-6 gap-4">
<div> <div>
@@ -85,13 +85,12 @@ export const Components: FC = (): ReactElement => {
</div> </div>
</div> </div>
<div className="w-60"> {/* Lebih baik gunakan gambar yang sudah di-clip dengan size height: 78px daripada hard-code object-position dan margin */}
<img <img
src="lanyard-id-card.png" src="gacha-clip.png"
alt="Lanyard IMPHNEN" alt="Lanyard IMPHNEN"
className="object-left-top" className="h-full"
/> />
</div>
</div> </div>
))} ))}
</div> </div>