import React, { HTMLAttributes } from 'react';
import styled from 'styled-components';

const PaperCardItem = styled.div`
  border-radius: 10px;
  border: 1px solid rgba(56, 124, 68, 0.2) !important;
  background: #fff;
  box-shadow: 4px 6px 10px 0px rgba(56, 124, 68, 0.15);
`;

interface PaperCardItemProps extends HTMLAttributes<HTMLDivElement> {
  children?: React.ReactNode;
  className?: string;
  style?: React.CSSProperties;
  onClick?: () => void;
}

const PaperCard = ({
  children,
  className,
  onClick,
  style,
}: PaperCardItemProps) => {
  return (
    <PaperCardItem onClick={onClick} className={className} style={style}>
      {children}
    </PaperCardItem>
  );
};

export default PaperCard;