girineko/YesPlayMusic
1
0
Fork 0
mirror of https://github.com/GiriNeko/YesPlayMusic.git synced 2025-12-17 21:58:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: updates

Browse source
This commit is contained in:
qier222 2022-03-17 19:30:43 +08:00
parent d96bd2a547
commit e3486ab550
No known key found for this signature in database
GPG key ID: 9C85007ED905F14D
23 changed files with 331 additions and 261 deletions
Download patch file Download diff file Expand all files Collapse all files

26
packages/renderer/src/components/TracksAlbum.tsx
View file

@ -34,7 +34,7 @@ const PlayOrPauseButtonInTrack = memo(
)}
>
<SvgIcon
className="h-3.5 w-3.5 text-brand-500"
className='h-3.5 w-3.5 text-brand-500'
name={isPlaying && isHighlight ? 'pause' : 'play'}
/>
</div>
@ -74,10 +74,10 @@ const Track = memo(
)}
>
{/* Track name and number */}
<div className="col-span-6 grid grid-cols-[2rem_auto] pr-8">
<div className='col-span-6 grid grid-cols-[2rem_auto] pr-8'>
{/* Track number */}
{isSkeleton ? (
<Skeleton className="h-6.5 w-6.5 -translate-x-1"></Skeleton>
<Skeleton className='h-6.5 w-6.5 -translate-x-1'></Skeleton>
) : (
!isHighlight && (
<div
@ -101,9 +101,9 @@ const Track = memo(
)}
{/* Track name */}
<div className="flex">
<div className='flex'>
{isSkeleton ? (
<Skeleton className="text-lg">
<Skeleton className='text-lg'>
PLACEHOLDER123456789012345
</Skeleton>
) : (
@ -120,7 +120,7 @@ const Track = memo(
</div>
{/* Artists */}
<div className="col-span-4 flex items-center">
<div className='col-span-4 flex items-center'>
{isSkeleton ? (
<Skeleton>PLACEHOLDER1234</Skeleton>
) : (
@ -136,7 +136,7 @@ const Track = memo(
</div>
{/* Actions & Track duration */}
<div className="col-span-2 flex items-center justify-end">
<div className='col-span-2 flex items-center justify-end'>
{/* Like button */}
{!isSkeleton && (
<button
@ -150,7 +150,7 @@ const Track = memo(
>
<SvgIcon
name={isLiked ? 'heart' : 'heart-outline'}
className="h-4 w-4 "
className='h-4 w-4 '
/>
</button>
)}
@ -209,15 +209,15 @@ const TracksAlbum = ({
)
return (
<div className="grid w-full">
<div className='grid w-full'>
{/* Tracks table header */}
<div className="mx-4 mt-10 mb-2 grid grid-cols-12 border-b border-gray-100 py-2.5 text-sm text-gray-400 dark:border-gray-800 dark:text-gray-500">
<div className="col-span-6 grid grid-cols-[2rem_auto]">
<div className='mx-4 mt-10 mb-2 grid grid-cols-12 border-b border-gray-100 py-2.5 text-sm text-gray-400 dark:border-gray-800 dark:text-gray-500'>
<div className='col-span-6 grid grid-cols-[2rem_auto]'>
<div>#</div>
<div>TITLE</div>
</div>
<div className="col-span-4">ARTIST</div>
<div className="col-span-2 justify-self-end">TIME</div>
<div className='col-span-4'>ARTIST</div>
<div className='col-span-2 justify-self-end'>TIME</div>
</div>
{/* Tracks */}