{"size": 1760, "ext": "js", "max_stars_repo_path": "src/components/Post/styles.js", "max_stars_repo_name": "BrunoS3D/Insta-Clone", "max_stars_repo_stars_event_min_datetime": "2019-11-01T03:19:49.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-10T09:27:30.000Z", "max_issues_repo_path": "src/components/Post/styles.js", "max_issues_repo_name": "BrunoS3D/Insta-Clone", "max_issues_repo_issues_event_min_datetime": "2019-10-31T18:23:07.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-12T23:47:20.000Z", "max_forks_repo_path": "src/components/Post/styles.js", "max_forks_repo_name": "BrunoS3D/Insta-Clone", "max_forks_repo_forks_event_min_datetime": "2020-05-06T14:38:07.000Z", "max_forks_repo_forks_event_max_datetime": "2020-10-11T18:45:57.000Z"}
{"max_stars_count": 10, "max_issues_count": 6, "max_forks_count": 2, "avg_line_length": 19.5555555556, "max_line_length": 46, "alphanum_fraction": 0.5102272727}
import styled from 'styled-components';

export const Container = styled.article`
    margin-top: 60px;
    width: 600px;

    display: flex;
    flex-direction: column;

    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #E6E6E6;

    
    &>footer {
        padding: 8px 16px;
    }
    &>footer .post-description {
        color: #262626;
        font-size: 0.9rem;
    }
    &>footer .moment-timestamp {
        color: #999;
        font-size: 0.7rem;
        text-transform: uppercase;
    }
    &>footer>p>.author {
        color: #262626;
        margin-right: 0.25rem;
        
        font-size: 0.9rem;
        font-weight: bold;
        text-decoration: none;
    }
    &>footer .read-more {
        color: #999;

        margin: 0;
        border: 0;
        padding: 0;
        background: 0 0;

        margin-left: 0.25rem;
        
        font-size: 0.9rem;
        text-decoration: none;

        cursor: pointer;
        outline: none;
        user-select: none;
        touch-action: manipulation;
    }
    &>footer svg {
        width: 32px;
        height: 32px;
    }

    &>footer .favorite-button {
        border: none;
        background: none;
        
        cursor: pointer;
        outline: none;
        user-select: none;
        touch-action: manipulation;
    }
    &>footer .favorite-button>.downvote path {
        fill: #000;
    }
    &>footer .favorite-button>.upvote path {
        fill: #ED4956ff;
    }

    @media screen and (max-width: 800px) {
        width: 100%;
        margin-top: 30px;

        border-left: none;
        border-right: none;

        &>footer {
            padding: 16px;
        }
    }

    @media screen and (max-width: 500px) {
        margin-top: 20px;
    }
`;
