<commit_before>/**
 * _header.scss
 */

// header styles
.header-back-btn {
    color: $color-main-dark;
    border: rem-calc(3) solid $color-main-dark;
    padding: rem-calc(5) rem-calc(20);
    text-align: center;
    text-decoration: none;
    border-radius: rem-calc(3);
    font-size: rem-calc(16);
    font-family: $headers-font;
    font-weight: 700;
    text-transform: uppercase;
    margin-left: rem-calc(30);
    margin-top: rem-calc(30);

    .fa {
        font-size: rem-calc(14);
        -webkit-transition: all .3s;
        transition: all .3s;
    }

    &:hover,
    &:focus,
    &:active {
        color: $color-main-dark;

        .fa {
            -webkit-transform: translateX(rem-calc(-5));
            transform: translateX(rem-calc(-5));
        }
    }

    &.element-dark {
        color: $color-main-dark;
        border: rem-calc(3) solid $color-main-dark;

        &:hover,
        &:focus,
        &:active {
            color: $color-main-dark;
        }
    }

    &.element-light {
        color: $color-main-light;
        border: rem-calc(3) solid $color-main-light;

        &:hover,
        &:focus,
        &:active {
            color: $color-main-light;
        }
    }
}

.main-header,
.post-view-header {
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;

    .element-light {
        color: $color-main-light;
    }

    .element-dark,
    &.no-cover {
        color: $color-main-dark;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: inherit;
        margin: 0;
    }

    h2 {
        font-size: rem-calc(22);
    }

    .post-logo-container,
    .author-logo-container {
        padding: rem-calc(15) rem-calc(40);

        img {
            max-width: rem-calc(180);
            max-height: rem-calc(180);
        }
    }

    .author-logo-container {
        img {
            border-radius: 100%;
        }
    }

    a,
    a:active,
    a:focus,
    a:hover {
        color: inherit;
    }
}

.main-header {
    padding: 18vh rem-calc(30);<commit_msg>Black background before image comes in<commit_after>/**
 * _header.scss
 */

// header styles
.header-back-btn {
    color: $color-main-dark;
    border: rem-calc(3) solid $color-main-dark;
    padding: rem-calc(5) rem-calc(20);
    text-align: center;
    text-decoration: none;
    border-radius: rem-calc(3);
    font-size: rem-calc(16);
    font-family: $headers-font;
    font-weight: 700;
    text-transform: uppercase;
    margin-left: rem-calc(30);
    margin-top: rem-calc(30);

    .fa {
        font-size: rem-calc(14);
        -webkit-transition: all .3s;
        transition: all .3s;
    }

    &:hover,
    &:focus,
    &:active {
        color: $color-main-dark;

        .fa {
            -webkit-transform: translateX(rem-calc(-5));
            transform: translateX(rem-calc(-5));
        }
    }

    &.element-dark {
        color: $color-main-dark;
        border: rem-calc(3) solid $color-main-dark;

        &:hover,
        &:focus,
        &:active {
            color: $color-main-dark;
        }
    }

    &.element-light {
        color: $color-main-light;
        border: rem-calc(3) solid $color-main-light;

        &:hover,
        &:focus,
        &:active {
            color: $color-main-light;
        }
    }
}

.main-header,
.post-view-header {
    text-align: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;

    .element-light {
        color: $color-main-light;
    }

    .element-dark,
    &.no-cover {
        color: $color-main-dark;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: inherit;
        margin: 0;
    }

    h2 {
        font-size: rem-calc(22);
    }

    .post-logo-container,
    .author-logo-container {
        padding: rem-calc(15) rem-calc(40);

        img {
            max-width: rem-calc(180);
            max-height: rem-calc(180);
        }
    }

    .author-logo-container {
        img {
            border-radius: 100%;
        }
    }

    a,
    a:active,
    a:focus,
    a:hover {
        color: inherit;
    }
}

.main-header {
    padding: 18vh rem-calc(30);
    background-color: black;
{'fraction_non_alphanumeric': 0.15252239509665252, 'fraction_numerical': 0.02498821310702499, 'mean_word_length': 1.5887736424649177, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4314032', 'n_tokens_mistral': 1578, 'n_tokens_neox': 1487, 'n_words': 266}