denshooter/portfolio
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use native img tag for game covers, add fallback icon, improve text contrast
All checks were successful
CI / CD / test-build (push) Successful in 10m15s
Details
CI / CD / deploy-dev (push) Successful in 1m33s
Details
CI / CD / deploy-production (push) Has been skipped
Details

Browse Source
This commit is contained in:
denshooter
2026-04-23 23:33:48 +02:00
parent 38ae39440e
commit e0acf31677
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
app/components/ActivityFeed.tsx
View File

@@ -171,14 +171,19 @@ export default function ActivityFeed({
<span className="text-[10px] font-black uppercase tracking-widest text-indigo-600 dark:text-indigo-300">{t("gaming")}</span>
</div>
<div className="flex gap-4">
{data.gaming.image && (
<div className="w-12 h-12 rounded-xl overflow-hidden shrink-0 shadow-lg relative">
<Image src={data.gaming.image} alt={data.gaming.name} fill className="object-cover" sizes="48px" unoptimized />
{data.gaming.image ? (
<div className="w-12 h-12 rounded-xl overflow-hidden shrink-0 shadow-lg relative bg-indigo-500/10">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={data.gaming.image} alt={data.gaming.name} className="w-full h-full object-cover" />
</div>
) : (
<div className="w-12 h-12 rounded-xl shrink-0 bg-indigo-500/20 dark:bg-indigo-400/20 flex items-center justify-center">
<Gamepad2 size={20} className="text-indigo-500 dark:text-indigo-300" />
</div>
)}
<div className="min-w-0 flex flex-col justify-center">
<p className="font-bold text-stone-900 dark:text-white text-base truncate">{data.gaming.name}</p>
<p className="text-xs text-stone-600 dark:text-stone-300 truncate">
<p className="font-bold text-indigo-700 dark:text-white text-base truncate">{data.gaming.name}</p>
<p className="text-xs text-indigo-600/70 dark:text-indigo-200/80 truncate">
{getSafeGamingText(data.gaming.details, data.gaming.state, t("inGame"))}
</p>
</div>