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="dasig-padding"
      style={{
        padding: `${props.top || 0}rem ${props.right}rem ${props.bottom || 0}rem ${props.left}rem`,
      }}
    >
      {props.children}
    </div>
  );
};