import type { JSXElement } from 'solid-js'
import '../styles/Padding.sass'

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

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