akurath/addons/cb.theme.dark/ace/theme.less

IDE Frontend for codepsaces.io

.ace_editor.ace-codebox-dark {
    background-color: #2b303b;
    color: #C5C8C6;

    .ace_gutter {
        background: #2b303b;
        color: #757a84
    }

    .ace_print-margin {
        width: 1px;
        background: #333d46
    }

    .ace_cursor {
        color: #AEAFAD
    }

    .ace_marker-layer .ace_selection {
        background: #3d4550;
    }

    &.ace_multiselect .ace_selection.ace_start {
        box-shadow: 0 0 3px 0px #1D1F21;
        border-radius: 2px
    }

    .ace_marker-layer .ace_step {
        background: rgb(102, 82, 0)
    }

    .ace_marker-layer .ace_bracket {
        margin: -1px 0 0 -1px;
        border: 1px solid #4B4E55
    }

    .ace_marker-layer .ace_active-line {
        background: #333d46
    }

    .ace_gutter-active-line {
        background-color: #333d46;
    }

    .ace_marker-layer .ace_selected-word {
        border: 1px solid #373B41
    }

    .ace_invisible {
        color: #4B4E55
    }

    .ace_keyword,
    .ace_meta,
    .ace_storage,
    .ace_storage.ace_type,
    .ace_support.ace_type {
        color: #B294BB
    }

    .ace_keyword.ace_operator {
        color: #8ABEB7
    }

    .ace_constant.ace_character,
    .ace_constant.ace_language,
    .ace_constant.ace_numeric,
    .ace_keyword.ace_other.ace_unit,
    .ace_support.ace_constant,
    .ace_variable.ace_parameter {
        color: #cc856c
    }

    .ace_constant.ace_other {
        color: #CED1CF
    }

    .ace_invalid {
        color: #CED2CF;
        background-color: #DF5F5F
    }

    .ace_invalid.ace_deprecated {
        color: #CED2CF;
        background-color: #B798BF
    }

    .ace_fold {
        background-color: #81A2BE;
        border-color: #757a84
    }

    .ace_entity.ace_name.ace_function,
    .ace_support.ace_function,
    .ace_variable {
        color: #81A2BE
    }

    .ace_support.ace_class,
    .ace_support.ace_type {
        color: #F0C674
    }

    .ace_heading,
    .ace_string {
        color: #9dbe8c
    }

    .ace_entity.ace_name.ace_tag,
    .ace_entity.ace_other.ace_attribute-name,
    .ace_meta.ace_tag,
    .ace_string.ace_regexp,
    .ace_variable {
        color: #b55761
    }

    .ace_comment {
        color: #969896
    }

    .ace_indent-guide {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYHB3d/8PAAOIAdULw8qMAAAAAElFTkSuQmCC) right repeat-y;
    }

    /* Autocomplete dialog */
    &.ace_autocomplete {
        width: 280px;
        z-index: 200000;
        background: #323d46;
        color: #65737e;
        border: none;
        position: fixed;
        box-shadow: 2px 3px 5px rgba(0,0,0,.2);
        line-height: 2;

        font-smoothing: subpixel-antialiased;
        -webkit-font-smoothing: subpixel-antialiased;

        .ace_marker-layer .ace_active-line {
            background-color: #4f5b67;
            z-index: 1;
        }
        .ace_text-layer .ace_selected,
        .ace_text-layer .ace_selected .ace_rightAlignedText{
            color: #a1adba;
        }
        .ace_line-hover {
            border: none;
            margin-top: -1px;
            background: none;
        }
        .ace_line-hover {
            position: absolute;
            z-index: 2;
        }
        .ace_rightAlignedText {
            color: #65737e;
            font-style: italic;
            display: inline-block;
            position: absolute;
            right: 4px;
            text-align: right;
            z-index: -1;
        }
        .ace_completion-highlight{
            color: #c0c5ce;
        }
    }

    /* Search dialog */
    .ace_search {
        border-color: transparent;
        background: #1c1f25;
        color: #65737e;

        .ace_searchbtn_close {
            &:hover {
                background-color: #323d46;
                color: #65737e;
            } 
        }

        .ace_search_field {
            background: #323d46;
            color: #65737e;
            border-color: transparent;
        }

        .ace_search_form, .ace_replace_form {
            background-color: #323d46;
            color: #65737e;
            border-color: transparent;
        }

        .ace_button {
            background-color: #323d46;
            color: #65737e;
        }

        .ace_searchbtn, .ace_replacebtn{
            background-color: #323d46;
            color: #65737e;
            border-color: transparent;
        }
    }
}