import styled from 'styled-components';
import * as React from 'react';

export const StyledList = styled.div`
    width: 100%;
    color: ${({ theme }) => theme.colorPalette.primary.fontColor};
    border-radius: 5px;
`;

export const Header = styled.div`
    background-color: ${({ theme }) => theme.colorPalette.primary.main};
    padding: 10px;
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid ${({ theme }) => theme.colorPalette.primary.light};
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    overflow: hidden;
`;

export const Content = styled.div`
    display: flex;
    flex-direction: column;
    width: 100%;
`;