<commit_before>// Header and Navigation

.header {}

.header__logo {
    width: 300px;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.navigation {
    @include breakpoint(medium) {
        background: linear-gradient(90deg, $color-secondary 50%, $color-gray 50%); 
    }
}

.navigation__container {
    display: flex;
    flex-direction: column;
    
    @include breakpoint(medium) {
        flex-direction: row;
    }
}

.navigation__menu {
    list-style-type: none;
    background-color: $color-gray;
    display: flex;
    margin: 0;

    @include breakpoint(medium) {
        padding-left: 1rem;
    }

    li {
        display: block;
    }

    a {
        position: relative;
        display: block;
        height: 50px;
        padding: 1rem;
        color: $color-secondary;

        &.is-active {
            font-weight: bold;
            
            &:after {
                content: '';
                position: absolute;
                top: 0;
                left: calc(50% - 10px);
                border-top: 10px solid $color-secondary;
                border-left: 10px solid transparent;
                border-right: 10px solid transparent;

                @include breakpoint(medium) {
                    content: none;
                }
            }

            @include breakpoint(medium) {
                border-bottom: 3px solid $color-primary;
                background-color: transparent;
                color: $color-primary;
            }
        }
    }
}

.navigation__select-wrapper {
    position: relative;
    width: 100%;<commit_msg>Add hover state to state navigation<commit_after>// Header and Navigation

.header {}

.header__logo {
    width: 300px;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.navigation {
    @include breakpoint(medium) {
        background: linear-gradient(90deg, $color-secondary 50%, $color-gray 50%); 
    }
}

.navigation__container {
    display: flex;
    flex-direction: column;
    
    @include breakpoint(medium) {
        flex-direction: row;
    }
}

.navigation__menu {
    list-style-type: none;
    background-color: $color-gray;
    display: flex;
    margin: 0;

    @include breakpoint(medium) {
        padding-left: 1rem;
    }

    li {
        display: block;
    }

    a {
        position: relative;
        display: block;
        height: 50px;
        padding: 1rem;
        color: $color-secondary;

        @include breakpoint(medium) {
            border-bottom: 0px solid darken($color-gray, 10%);
            transition: border-bottom 200ms;
        }

        &:hover {
            @include breakpoint(medium) {
                border-bottom: 4px solid darken($color-gray, 10%);
            }
        }

        &.is-active {
            font-weight: bold;
            
            &:after {
                content: '';
                position: absolute;
                top: 0;
                left: calc(50% - 10px);
                border-top: 10px solid $color-secondary;
                border-left: 10px solid transparent;
                border-right: 10px solid transparent;

                @include breakpoint(medium) {
                    content: none;
                }
            }

            @include breakpoint(medium) {
                border-bottom: 4px solid $color-primary;
                color: $color-primary;
            }
        }
    }
}

.navigation__select-wrapper {
    position: relative;
    width: 100%;
{'fraction_non_alphanumeric': 0.1056581986143187, 'fraction_numerical': 0.020496535796766743, 'mean_word_length': 1.4928057553956835, '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': '3429376', 'n_tokens_mistral': 1072, 'n_tokens_neox': 954, 'n_words': 220}