import styled from 'styled-components';
import { Variants } from '../../styles';
import * as React from 'react';

const StyledCard = styled.div<{variant: Variants}>` 
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 20px 10px 20px 10px;
    /* border: 2px solid #655c5c; */
    box-shadow: 1px 0px 5px 0px #9998989e;
    border-radius: 6px;
    background: #fff;
    ${ props => props.variant === 'outlined' && `
        border: 1px solid ${props.theme.colorPalette.primary.main};
    `}
`;

export default StyledCard;