

/** @jsx jsx */
import * as React from "react";
import css from "@styled-system/css";
import { jsx } from "@emotion/core";

// Wrap
export interface WrapProps {
    children?: React.ReactNode;
}

const Wrap: React.FC<WrapProps> = ({
    children
}): React.ReactElement => {
    return (
        <div 
          css={ 
            css({  
            height: 4,
            flex: `1 1 auto`,
            bottom: 0,
            right: 0,
            left: 0,
            display: 'flex',
            padding: '10px',
            bg: 'soft'
          })}>
            {children && children}
        </div>
    );
};

export default Wrap;

