export default function Index()

in src/pages/index.js [15:52]
38 lines of code
3 McCabe index (conditional complexity)

export default function Index() {
  return (
    <Layout>
      <Hero />
      <Box bg="blue.1" color="black" px={4} py={12}>
        <Box className="container-xl" px={2}>
          <Heading fontSize={6} textAlign="center" lineHeight={1}>
            Everything in one system
          </Heading>
          <Text as="p" textAlign="center" mb={8}>
            Check out our most popular tools to use in your next project
          </Text>
          <Flex flexWrap="wrap" mr={[0, 0, -gutter]}>
            <Promo title="CSS framework" image={CSSImage} href="/css">
              Utility-centric and BEM-style components to give you the building blocks for any web project.
            </Promo>
            <Promo title="React components" image={ComponentsImage} href="/components">
              Presentational UI components with encapsulated styles and constraint-based theme props.
            </Promo>
            <Promo title="ViewComponents" image={ViewComponentsImage} href="/view-components">
              Build component-driven UI in Rails with ViewComponents.
            </Promo>
            <Promo title="Octicons" image={OcticonsImage} href="/octicons">
              Your project. GitHub’s icons. Available in Ruby and JavaScript implementations.
            </Promo>
            <Promo title="Interface guidelines" image={GuidelinesImage} href="/design">
              Principles, standards, and usage guidelines for designing GitHub interfaces.
            </Promo>
            <Promo title="Figma components" image={FigmaImage} href="/design/tools/figma">
              Design layouts, flows, wireframes, and make prototypes with Primer components in Figma.
            </Promo>
          </Flex>
        </Box>
      </Box>
      <Footer />
    </Layout>
  )
}