This commit is contained in:
felipe 2025-03-15 21:15:37 -03:00
parent 0e6e08beb2
commit 5785c3847f
4 changed files with 41 additions and 29 deletions

View file

@ -33,13 +33,13 @@ export default function TrackList(props: Props) {
</div> </div>
<div className=''> <div className=''>
<div className='col'> <div className='col'>
<div className={clsx('border p-3 border-t-0', { 'border-t-2': discs.length === 1 })}> <div className={clsx('border rounded-sm p-3 border-t-0', { 'border-t-2': discs.length === 1 })}>
<table className='gap-y-4' cellPadding='6'> <table className='gap-y-4' cellPadding='6'>
<tbody> <tbody>
{discs.length > 0 && {discs.length > 0 &&
discs[current].body?.split('\n').map((track, i) => ( discs[current].body?.split('\n').map((track, i) => (
<tr key={i}> <tr key={i}>
<td>{i + 1} </td> <td className='pr-1'>{(i + 1).toString().padStart(2, '0')}.</td>
<td>{track}</td> <td>{track}</td>
</tr> </tr>
))} ))}

View file

@ -73,10 +73,10 @@ const { currentLocale } = Astro
<Image <Image
src={`https://cdn.sittingonclouds.net/album/${album?.id}.png`} src={`https://cdn.sittingonclouds.net/album/${album?.id}.png`}
alt={`${album?.title} cover`} alt={`${album?.title} cover`}
class='rounded-sm size-full object-contain h-96' class='rounded-sm size-full object-contain h-fit min-h-96 px-10'
quality='mid' quality='mid'
width={384} width={500}
height={384} height={500}
/> />
</div> </div>
</div> </div>
@ -100,21 +100,23 @@ const { currentLocale } = Astro
} }
{ {
(album?.artists.length ?? 0) > 0 && ( (album?.artistList.length ?? 0) > 0 && (
<tr> <tr>
<th>{m.artists()}</th> <th class="mr-2">{m.artists()}</th>
<td>{album?.artists.map(({ artist }) => artist.name).join(', ')}</td> <td>{album?.artistList.map(({ artist }) => artist.name).join(', ')}</td>
</tr> </tr>
) )
} }
<tr> <tr>
<th>{m.classification()}</th> <th class="mr-2">{m.classification()}</th>
<td> <td>
{ {
[ [
album?.categories.map(({ categoryName }) => (m as any)[`${categoryName}Osts`]()).join(' & '), album?.categoryList
album?.classifications.map(({ classificationName }) => classificationName).join(', ') .map(({ categoryName }) => (m as any)[`${categoryName}Osts`]())
.join(' & '),
album?.classificationList.map(({ classificationName }) => classificationName).join(', ')
] ]
.filter((f) => f !== '') .filter((f) => f !== '')
.join(' - ') .join(' - ')
@ -124,7 +126,7 @@ const { currentLocale } = Astro
{ {
album?.label && ( album?.label && (
<tr> <tr>
<th>{m.publishedBy()}</th> <th class="mr-2">{m.publishedBy()}</th>
<td> <td>
<a class='btn btn-link p-0' href={`/publisher/${album?.label}`}> <a class='btn btn-link p-0' href={`/publisher/${album?.label}`}>
{album?.label} {album?.label}
@ -134,11 +136,11 @@ const { currentLocale } = Astro
) )
} }
{ {
(album?.platforms.length ?? 0) > 0 && ( (album?.platformList.length ?? 0) > 0 && (
<tr> <tr>
<th>{m.platforms()}</th> <th class="mr-2">{m.platforms()}</th>
<td> <td>
{album?.platforms.map(({ platform }, i) => ( {album?.platformList.map(({ platform }, i) => (
<Fragment key={platform.id}> <Fragment key={platform.id}>
{id === '29' ? ( {id === '29' ? (
<span class='btn p-0' style={{ color: 'white' }}> <span class='btn p-0' style={{ color: 'white' }}>
@ -149,7 +151,7 @@ const { currentLocale } = Astro
{platform.name} {platform.name}
</a> </a>
)} )}
{i !== album?.platforms.length - 1 && ', '} {i !== album?.platformList.length - 1 && ', '}
</Fragment> </Fragment>
))} ))}
</td> </td>
@ -157,16 +159,16 @@ const { currentLocale } = Astro
) )
} }
{ {
(album?.games.length ?? 0) > 0 && ( (album?.gameList.length ?? 0) > 0 && (
<tr> <tr>
<th>{m.games()}</th> <th class="mr-2">{m.games()}</th>
<td> <td>
{album?.games.map(({ game }, i) => ( {album?.gameList.map(({ game }, i) => (
<Fragment key={game.slug}> <Fragment key={game.slug}>
<a class='btn btn-link p-0' href={`/game/${game.slug}`}> <a class='btn btn-link p-0' href={`/game/${game.slug}`}>
{game.name} {game.name}
</a> </a>
{i !== album?.games.length - 1 && ', '} {i !== album?.gameList.length - 1 && ', '}
</Fragment> </Fragment>
))} ))}
</td> </td>
@ -174,16 +176,16 @@ const { currentLocale } = Astro
) )
} }
{ {
(album?.animations.length ?? 0) > 0 && ( (album?.animList.length ?? 0) > 0 && (
<tr> <tr>
<th>{m.animations()}</th> <th class="mr-2">{m.animations()}</th>
<td> <td>
{album?.animations.map(({ animation }, i) => ( {album?.animList.map(({ animation }, i) => (
<Fragment key={id}> <Fragment key={id}>
<a class='btn btn-link p-0' href={`/anim/${id}`}> <a class='btn btn-link p-0' href={`/anim/${id}`}>
{animation.title} {animation.title}
</a> </a>
{i !== album?.animations.length - 1 && ', '} {i !== album?.animList.length - 1 && ', '}
</Fragment> </Fragment>
))} ))}
</td> </td>
@ -192,13 +194,23 @@ const { currentLocale } = Astro
} }
<tr> <tr>
<th>{m.avgRating()}</th> <th class="mr-2">{m.avgRating()}</th>
<td> <td>
<!-- <StarCounter album?.Id={album?.id} /> --> <!-- <StarCounter album?.Id={album?.id} /> -->
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
{
album?.vgmdb && (
<div class='mt-2 mb-3 ml-2 flex'>
<span class='text-lg'>{m.checkVGMDB()}:</span>
<a href={album?.vgmdb} class='ml-2' target='_blank' rel='noopener noreferrer'>
<Image width={100} height={30} alt={'VGMdb'} src={vgmdbLogo} />
</a>
</div>
)
}
<!-- <UserButtons id={album?.id} /> --> <!-- <UserButtons id={album?.id} /> -->
</div> </div>
</div> </div>

View file

@ -27,7 +27,7 @@ const lastAlbums = await prismaClient.albums.findMany({
<h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'> <h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'>
{m.recentReleases()} {m.recentReleases()}
</h1> </h1>
<div class='grid grid-cols-4 gap-x-1.5'> <div class='grid grid-cols-2 md:grid-cols-4 gap-x-1.5'>
{ {
recentAlbums.map((album) => ( recentAlbums.map((album) => (
<AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} /> <AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} />
@ -42,7 +42,7 @@ const lastAlbums = await prismaClient.albums.findMany({
<h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'> <h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'>
{m.lastAdded()} {m.lastAdded()}
</h1> </h1>
<div class='grid grid-cols-4 gap-x-1.5'> <div class='grid grid-cols-2 md:grid-cols-4 gap-x-1.5'>
{ {
lastAlbums.map((album) => ( lastAlbums.map((album) => (
<AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} /> <AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} />

View file

@ -39,7 +39,7 @@ const listProps = { fullPageList, page }
<h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'> <h1 class='uppercase font-medium tracking-wide text-5xl drop-shadow-2xl mt-5 mb-2 text-center'>
{m.lastAdded()} {m.lastAdded()}
</h1> </h1>
<div class='grid grid-cols-4 gap-x-1.5'> <div class='grid grid-cols-2 md:grid-cols-4 gap-x-1.5'>
{ {
lastAlbums.map((album) => ( lastAlbums.map((album) => (
<AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} /> <AlbumBox title={album.title} href={`/album/${album.id}`} image={`/album/${album.id}.png`} />