<commit_before>@import 'colors';

:local(.synth) {

    display: flex;
    flex-direction: column;
    margin: 0.5em;
    padding: 0.5em;
    border: 2px solid $border-color;
    border-radius: 5px;

    #panel {
        display: flex;
        justify-content: space-around;
        font-size: 0.6em;
        padding-top: 0.5em;
    }

    .panel-div {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

    .keyboard,
    #sequencer,
    #seq-controls {
        margin-left: auto;
        margin-right: auto;
    }

    .keyboard {

        ul {
            list-style-type: none;
            font-size: 0.7em;
            padding-left: 0;

            li {
                text-align: center;
                width: 35px;
                height: 100px;
                border: 2px solid black;
                display: inline-block;
            }

        }

        li:nth-child(12n+2),
        li:nth-child(12n+4),
        li:nth-child(12n+7),
        li:nth-child(12n+9),
        li:nth-child(12n+11) {
            background-color: black;
            width: 20px;
            color: white;
        }

        li:nth-child(12n+6),
        li:nth-child(12n+13) {
            border-left: none;
        }
    }

    .column {
        display: inline-block;
        padding: 0;
        margin: 2px;
    }

    .cell {
        list-style: none;
        text-align: center;
        height: 30px;
        width: 30px;
        margin-bottom: 4px;
        background-color: red;
        box-shadow: inset rgba(128, 0, 0, 0.2) 0 -1px 1px 1px, inset #cc0000 0 -1px 9px, inset #ff3333 0 2px 14px;
        color: transparent;
    }

    .selected {
        background-color: blue; 
        color: transparent;
        box-shadow: inset rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #006 0 -1px 9px, inset #3F8CFF 0 2px 14px;
    };

    // .not-selected {
    //     background-color: rgba(255,0,0,.5);
    //     color: rgba(255,0,0,.5);
    // }

    #sequencer {
        display: flex;
    }

    #seq-controls {
        font-size: 0.8em;
    }

    #seq-controls label {
        margin-left: 5em;
    }
<commit_msg>pad colors are more subtle<commit_after>@import 'colors';

:local(.synth) {

    display: flex;
    flex-direction: column;
    margin: 0.5em;
    padding: 0.5em;
    border: 2px solid $border-color;
    border-radius: 5px;

    #panel {
        display: flex;
        justify-content: space-around;
        font-size: 0.6em;
        padding-top: 0.5em;
    }

    .panel-div {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

    .keyboard,
    #sequencer,
    #seq-controls {
        margin-left: auto;
        margin-right: auto;
    }

    .keyboard {

        ul {
            list-style-type: none;
            font-size: 0.7em;
            padding-left: 0;

            li {
                text-align: center;
                width: 35px;
                height: 100px;
                border: 2px solid black;
                display: inline-block;
            }

        }

        li:nth-child(12n+2),
        li:nth-child(12n+4),
        li:nth-child(12n+7),
        li:nth-child(12n+9),
        li:nth-child(12n+11) {
            background-color: black;
            width: 20px;
            color: white;
        }

        li:nth-child(12n+6),
        li:nth-child(12n+13) {
            border-left: none;
        }
    }

    .column {
        display: inline-block;
        padding: 0;
        margin: 2px;
    }

    .cell {
        list-style: none;
        text-align: center;
        height: 30px;
        width: 30px;
        margin-bottom: 4px;
        background-color: #999;
        box-shadow: inset rgba(128, 0, 0, 0.2) 0 -1px 1px 1px, inset #444 0 -1px 9px, inset #bbb 0 2px 14px;
        color: transparent;
    }

    .selected {
        background-color: #ccc; 
        opacity: 0.2;
        color: transparent;
        box-shadow: inset rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #006 0 -1px 9px, inset #3F8CFF 0 2px 14px;
    };

    // .not-selected {
    //     background-color: rgba(255,0,0,.5);
    //     color: rgba(255,0,0,.5);
    // }

    #sequencer {
        display: flex;
    }

    #seq-controls {
        font-size: 0.8em;
    }

    #seq-controls label {
        margin-left: 5em;
    }

{'fraction_non_alphanumeric': 0.12880184331797234, 'fraction_numerical': 0.05207373271889401, 'mean_word_length': 1.377327491785323, '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': '1341074', 'n_tokens_mistral': 1700, 'n_tokens_neox': 1485, 'n_words': 322}