Function ArticleGridLayout

components/article/ArticleGridLayout.tsx:12–33

({ intro, topper, toc, children, className }: Props)

  className?: string
}
export const ArticleGridLayout = ({ intro, topper, toc, children, className }: Props) => {
  return (
    <Container className={className}>
      {topper && <Box gridArea="topper">{topper}</Box>}
      {toc && (
        <SidebarContent
          gridArea="sidebar"
          alignSelf="flex-start"
          className="border-bottom border-lg-0 pb-4 mb-5 pb-xl-0 mb-xl-0"
        >
          {toc}
        </SidebarContent>
      )}

      {intro && <Box gridArea="intro">{intro}</Box>}

      <Box gridArea="content" data-search="article-body">
        {children}
      </Box>
    </Container>
  )
}

const Container = styled(Box)`
  max-width: 720px;