1
0
mirror of synced 2026-01-06 06:02:35 -05:00
Files
docs/components/landing/LandingSection.tsx
2021-11-23 17:50:26 +00:00

31 lines
832 B
TypeScript

import cx from 'classnames'
type Props = {
title?: React.ReactNode
sectionLink?: string
children?: React.ReactNode
className?: string
description?: string
}
export const LandingSection = ({ title, children, className, sectionLink, description }: Props) => {
return (
<div className={cx('container-xl px-3 px-md-6 mt-6', className)} id={sectionLink}>
{title && (
<h2 className={cx('h1 color-fg-default', !description ? 'mb-3' : 'mb-4')}>
{sectionLink ? (
<a className="color-unset" href={`#${sectionLink}`}>
{title}
</a>
) : (
title
)}
</h2>
)}
{description && (
<div className="color-fg-muted f4" dangerouslySetInnerHTML={{ __html: description }} />
)}
{children}
</div>
)
}