You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
40 lines
715 B
40 lines
715 B
import { useState } from 'react'
|
|
|
|
import styled from 'styled-components/macro'
|
|
|
|
type LogoImgProps = {
|
|
isLogoError: boolean,
|
|
}
|
|
export const LogoImg = styled.img<LogoImgProps>`
|
|
height: 25px;
|
|
width: 25px;
|
|
margin-right: 15px;
|
|
display: ${({ isLogoError }) => (isLogoError ? 'none' : '')};
|
|
filter: grayscale(1);
|
|
|
|
:hover {
|
|
filter: none;
|
|
}
|
|
`
|
|
|
|
type Props = {
|
|
src: string,
|
|
}
|
|
|
|
export const TeamLogoImg = ({
|
|
src,
|
|
}: Props) => {
|
|
const [isLogoError, setIsImgError] = useState(true)
|
|
|
|
const onError = () => setIsImgError(true)
|
|
const onLoad = () => setIsImgError(false)
|
|
|
|
return (
|
|
<LogoImg
|
|
src={src}
|
|
onError={onError}
|
|
onLoad={onLoad}
|
|
isLogoError={isLogoError}
|
|
/>
|
|
)
|
|
}
|
|
|