Highlight Highlight.tsx

0% Statements 0/3

100% Branches 0/0

0% Functions 0/1

0% Lines 0/3

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { Stack, Image, Text, useColorModeValue } from "@chakra-ui/react";
import type { FunctionComponent } from "react";
 
interface HighlightProps {
  label: string;
  color?: string;
  icon?: string;
}
 
export const Highlight: FunctionComponent<HighlightProps> = ({
  label,
  color,
  icon,
}: HighlightProps) => {
  const brightness = useColorModeValue("none", "brightness(1.75)");
  return (
    <Stack align="center" direction="row" filter={brightness} spacing={2}>
      <Image alt={`${label} icon`} src={icon} w={4} />
      <Text color={color} fontWeight="bold">
        {label}
      </Text>
    </Stack>
  );
};