import { type JSXElement } from 'solid-js'

interface Props {
  left: number
  right: number
  top: number
  bottom: number
  children: JSXElement
}

export default (props: Props) => {
  return <div style={{ padding: `${props.top || 0}rem ${props.right}rem ${props.bottom || 0}rem ${props.left}rem` }}>{props.children}</div>
}