feat: updates

This commit is contained in:
qier222 2022-07-11 11:06:41 +08:00
parent 0b4baa3eff
commit 222fb02355
No known key found for this signature in database
GPG key ID: 9C85007ED905F14D
77 changed files with 654 additions and 551 deletions

View file

@ -7,7 +7,7 @@ const ArtistInfo = ({ artist }: { artist?: Artist }) => {
<div className='text-28 font-semibold text-night-50 lg:text-32'>
{artist?.name}
</div>
<div className='mt-2.5 text-24 font-medium text-night-400 lg:mt-6'>
<div className='text-white-400 mt-2.5 text-24 font-medium lg:mt-6'>
Artist
</div>
<div className='mt-1 text-12 font-medium text-night-400'>

View file

@ -1,26 +0,0 @@
import { resizeImage } from '@/web/utils/common'
import { cx, css } from '@emotion/css'
import useIsMobile from '@/web/hooks/useIsMobile'
const BlurBackground = ({ cover }: { cover?: string }) => {
const isMobile = useIsMobile()
return isMobile || !cover ? (
<></>
) : (
<img
className={cx(
'absolute z-0 object-cover opacity-70',
css`
top: -400px;
left: -370px;
width: 1572px;
height: 528px;
filter: blur(256px) saturate(1.2);
`
)}
src={resizeImage(cover, 'sm')}
/>
)
}
export default BlurBackground

View file

@ -1,9 +1,8 @@
import { resizeImage } from '@/web/utils/common'
import { cx, css } from '@emotion/css'
import Image from '@/web/components/New/Image'
import { useMemo } from 'react'
import { breakpoint as bp } from '@/web/utils/const'
import BlurBackground from './BlurBackground'
import BlurBackground from '@/web/components/New/BlurBackground'
import ArtistInfo from './ArtistInfo'
import Actions from './Actions'
import LatestRelease from './LatestRelease'

View file

@ -37,11 +37,11 @@ const Album = () => {
`
)}
/>
<div className='ml-2 flex-shrink-1'>
<div className='font-medium line-clamp-1 text-16 text-night-100'>
<div className='flex-shrink-1 ml-2'>
<div className='line-clamp-1 text-16 font-medium text-night-100'>
{album.name}
</div>
<div className='mt-1 font-bold text-14 text-night-500'>
<div className='mt-1 text-14 font-bold text-night-500'>
{album.type}
{album.size > 1 ? `· ${album.size} Tracks` : ''}
</div>
@ -69,8 +69,8 @@ const Video = () => {
`
)}
/>
<div className='ml-2 flex-shrink-1'>
<div className='font-medium line-clamp-2 text-16 text-night-100'>
<div className='flex-shrink-1 ml-2'>
<div className='line-clamp-2 text-16 font-medium text-night-100'>
Swedish House Mafia & The Weeknd Live at C...
</div>
<div className='mt-1.5 text-12 font-medium text-night-500'>
@ -84,7 +84,7 @@ const Video = () => {
const LatestRelease = () => {
return (
<div className='mx-2.5 lg:mx-0'>
<div className='mb-3 font-bold mt-7 text-14 text-neutral-300'>
<div className='mb-3 mt-7 text-14 font-bold text-neutral-300'>
Latest Releases
</div>

View file

@ -1,5 +1,5 @@
import { resizeImage } from '@/web/utils/common'
import { player } from '@/web/store'
import player from '@/web/states/player'
import { State as PlayerState } from '@/web/utils/player'
import useTracks from '@/web/api/hooks/useTracks'
import { css, cx } from '@emotion/css'