Files
payload/examples/form-builder/next-pages/components/VerticalPadding/index.tsx
2023-10-09 14:03:39 -04:00

29 lines
586 B
TypeScript

import React from 'react'
import classes from './index.module.scss'
export type VerticalPaddingOptions = 'large' | 'medium' | 'small' | 'none'
type Props = {
top?: VerticalPaddingOptions
bottom?: VerticalPaddingOptions
children: React.ReactNode
className?: string
}
export const VerticalPadding: React.FC<Props> = ({
top = 'medium',
bottom = 'medium',
className,
children,
}) => {
return (
<div
className={[className, classes[`top-${top}`], classes[`bottom-${bottom}`]]
.filter(Boolean)
.join(' ')}
>
{children}
</div>
)
}