Home InfoSection.tsx

0% Statements 0/2

100% Branches 0/0

0% Functions 0/1

0% Lines 0/2

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { Flex, Heading, Text } from "@chakra-ui/react";
import type { FunctionComponent, ReactNode } from "react";
import { SECTION_PADDING } from "./constants";
import testIds from "./testIds";
 
export interface InfoSectionProps {
  title: string;
  description: ReactNode;
}
 
export const InfoSection: FunctionComponent<InfoSectionProps> = ({
  title,
  description,
  children,
}) => (
  <Flex
    color="textPrimary"
    data-testid={testIds.infoSection}
    direction="column"
    py={SECTION_PADDING.Y}
  >
    <Heading
      as="h3"
      data-testid={testIds.infoSectionHeading}
      fontSize="1.5rem"
      fontWeight="semibold"
      lineHeight="lg"
      mb={2}
    >
      {title}
    </Heading>
    <Flex direction="column" h="full" justify="space-between">
      <Text data-testid={testIds.infoSectionDescription} fontSize="lg" mb={4}>
        {description}
      </Text>
      {children}
    </Flex>
  </Flex>
);