@@ -21,7 +21,10 @@
? ? ( $art -> user -> username ? ? null )
? ? 'Skinbase'
));
$category = trim (( string ) ( $art -> category_name ? ? $art -> category ? ? 'General ' ));
$category = trim (( string ) ( $art -> category_name ? ? $art -> category ? ? '' ));
$avatarUserId = $art -> user -> id ? ? $art -> user_id ? ? null ;
$avatarHash = $art -> user -> profile -> avatar_hash ? ? $art -> avatar_hash ? ? null ;
$avatar_url = \App\Support\AvatarUrl :: forUser (( int ) ( $avatarUserId ? ? 0 ), $avatarHash , 40 );
$license = trim (( string ) ( $art -> license ? ? 'Standard' ));
$resolution = trim (( string ) ( $art -> resolution ? ? (( isset ( $art -> width , $art -> height ) && $art -> width && $art -> height ) ? ( $art -> width . '× ' . $art -> height ) : '' )));
// Safe integer extractor: handle numeric, arrays, Collections, or relations
@@ -36,7 +39,7 @@
};
$likes = $safeInt ( $art -> likes ? ? $art -> favourites ? ? 0 );
$download s = $safeInt ( $art -> downloads ? ? $art -> downloaded ? ? 0 );
$comment s = $safeInt ( $art -> comments_count ? ? $art -> comment_count ? ? $art -> comments ? ? 0 );
$img_src = ( string ) ( $art -> thumb ? ? $art -> thumbnail_url ? ? '/images/placeholder.jpg' );
$img_srcset = ( string ) ( $art -> thumb_srcset ? ? $art -> thumbnail_srcset ? ? $img_src );
@@ -87,7 +90,7 @@
< img
src = " { { $img_src }} "
srcset = " { { $img_srcset }} "
sizes = " (max-width: 768px) 50vw, (max-width: 1280px) 33vw, 25 vw "
sizes = " (max-width: 768px) 50vw, (max-width: 1280px) 33vw, 20 vw "
loading = " lazy "
decoding = " async "
alt = " { { e( $title ) }} "
@@ -101,14 +104,20 @@
< div class = " pointer-events-none absolute inset-x-0 bottom-0 z-20 bg-gradient-to-t from-black/80 via-black/40 to-transparent p-3 backdrop-blur-[2px] opacity-100 transition-opacity duration-200 md:opacity-0 md:group-hover:opacity-100 md:group-focus-visible:opacity-100 " >
< div class = " truncate text-sm font-semibold text-white " > {{ $title }} </ div >
< div class = " mt-1 flex items-center justify-between gap-3 text-xs text-white/80 " >
< span class = " truncate" > by {{ $author }} </ span >
< span class = " shrink-0 " > ❤ {{ $likes }} · ⬇ {{ $downloads }} </ span >
< span class = " truncate flex items-center gap-2 " >
< img src = " { { $avatar_url }} " alt = " Avatar of { { e( $author ) }} " class = " w-6 h-6 rounded-full object-cover " >
< span class = " truncate " > by {{ $author }} </ span >
</ span >
< span class = " shrink-0 " > ❤ {{ $likes }} · 💬 {{ $comments }} </ span >
</ div >
< div class = " mt-1 text-[11px] text-white/70 " >
@ if ( $resolution !== '' )
{{ $resolution }} •
@ endif
{{ $category }} • {{ $license }}
@ php
$meta_parts = [];
if ( ! empty ( $resolution )) $meta_parts [] = $resolution ;
if ( ! empty ( $category )) $meta_parts [] = $category ;
if ( ! empty ( $license )) $meta_parts [] = $license ;
@ endphp
{{ implode ( ' • ' , $meta_parts ) }}
</ div >
</ div >