moonstream/frontend/src/components/TrustedBadge.js

55 wiersze
1.3 KiB
JavaScript

import { React } from "react";
import { Flex, Image, Link, LinkBox, LinkOverlay } from "@chakra-ui/react";
const TrustedBadge = ({
name,
caseURL,
ImgURL,
scale,
isGrayScale,
boxURL,
}) => {
const _scale = scale ?? 1;
return (
<LinkBox m={2}>
<LinkOverlay href={boxURL} isExternal>
<Flex
m={1}
justifyContent="center"
alignItems="center"
alignSelf="center"
wrap="nowrap"
p={8}
direction="column"
>
<Image
sx={isGrayScale && { filter: "grayscale(100%)" }}
h={[
`${2.25 * _scale}rem`,
null,
`${3 * _scale}rem`,
`${3 * _scale}rem`,
`${4 * _scale}rem`,
`${6 * _scale}rem`,
]}
src={ImgURL}
alt={name}
></Image>
{caseURL && (
// <RouterLink href={caseURL} passHref scroll={true}>
<Link
fontSize={["sm", null, "md", "lg"]}
textColor="orange.900"
href={caseURL}
>
{`Read more >`}
</Link>
// </RouterLink>
)}
</Flex>
</LinkOverlay>
</LinkBox>
);
};
export default TrustedBadge;