fix css of skin library item

This commit is contained in:
Pig Fang 2020-07-04 17:54:05 +08:00
parent e786fff10d
commit 62ac0f5f9c
No known key found for this signature in database
GPG Key ID: A8198F548DADA9E2

View File

@ -1,5 +1,4 @@
/** @jsx jsx */
import { jsx } from '@emotion/core'
import React from 'react'
import styled from '@emotion/styled'
import { t } from '@/scripts/i18n'
import * as cssUtils from '@/styles/utils'
@ -36,9 +35,13 @@ interface ButtonLikeProps {
liked: boolean
}
const ButtonLike = styled.a<ButtonLikeProps>`
color: ${(props) => (props.liked ? '#dc3545' : '#6c757d')};
&:hover {
color: ${(props) => (props.liked ? '#dc3545' : '#343a40')};
${cssUtils.pointerCursor}
i, span {
color: ${(props) => (props.liked ? '#dc3545' : '#6c757d')};
&:hover {
color: ${(props) => (props.liked ? '#dc3545' : '#343a40')};
}
}
`
@ -102,12 +105,11 @@ const Item: React.FC<Props> = (props) => {
</div>
<ButtonLike
liked={props.liked}
css={cssUtils.pointerCursor}
tabIndex={-1}
onClick={handleHeartClick}
>
<i className="fas fa-heart mr-1"></i>
{item.likes}
<span>{item.likes}</span>
</ButtonLike>
</div>
</div>