atom-dark-fusion-syntax/styles/base.less

Flat and color balanced dark theme for maximum readability

@import "syntax-variables";
@import "ruby";

atom-text-editor, :host {
  background-color: @syntax-background-color;
  color: @syntax-text-color;

  .wrap-guide {
    background-color: @syntax-wrap-guide-color;
  }

  .indent-guide {
     color: @syntax-indent-guide-color;
  }

  .invisible-character {
    color: @syntax-invisible-character-color;
  }

  .gutter {
    background-color: @syntax-gutter-background-color;
    color: @syntax-gutter-text-color;

    .line-number {
      width: 100%;
      &.cursor-line {
        background-color: @syntax-gutter-background-color-selected;
        color: @syntax-gutter-text-color-selected;
      }

      &.cursor-line-no-selection {
        color: @syntax-gutter-text-color-selected;
      }
    }
  }

  .gutter .line-number.folded,
  .gutter .line-number:after,
  .fold-marker:after {
    color: @light-gray;
  }

  .invisible {
    color: @syntax-text-color;
  }

  .cursor {
    color: @syntax-cursor-color;
  }

  .selection .region {
    background-color: @syntax-selection-color;
  }
}

atom-text-editor .search-results .marker .region,
:host .search-results .marker .region {
  background-color: transparent;
  border: 1px solid @syntax-result-marker-color;
}

atom-text-editor .search-results .marker.current-result .region,
:host .search-results .marker.current-result .region {
  border: 1px solid @syntax-result-marker-color-selected;
}

.comment {
  color: @light-gray;
}

.entity {
  &.name.type {
    color: @light-orange;
  }

  &.other.inherited-class {
    color: @orange;
  }

  &.name {
    &.accessor {
      color: @white;
    }
  }
}

.keyword {
  color: @purple;

  &.control {
    color: @purple;
  }

  &.operator {
    color: @light-orange;

    &.new {
        color: @blue;
    }
  }

  &.other.special-method {
    color: @blue;
  }

  &.other.unit {
    color: @orange;
  }
}

.storage {
  color: @purple;

  &.type {
    color: @blue;

    &.flowtype {
      color: @very-light-gray;

      &.variable {
        color: @light-orange;
      }
    }
  }

  &.function {
    color: @blue;
  }
}

.constant {
  color: @orange;

  &.dom {
      color: @very-light-gray;
  }

  &.character.escape {
    color: @cyan;
  }

  &.numeric {
    /*color: @orange;*/
    color: @light-orange;
  }

  &.other.color {
    color: @cyan;
  }

  &.other.symbol {
    color: @orange;
  }
}

.variable {
  color: @very-light-gray;

  &.interpolation {
    color: darken(@very-light-gray, 10%);
  }

  &.parameter.function {
    color: @light-orange;
  }

  &.other {
    color: @blue;

    &.instance,
    &.class {
      color: @light-orange
    }

    &.readwrite,
    &.property,
    &.object {
      color: @very-light-gray;
    }

    &.constant {
      color: @light-orange;
    }
  }

  &.type {
      color: @light-orange;
  }

  &.prototype {
      color: @orange;
  }

  &.this,
  &.super {
      color: @blue;
  }
}

.invalid.illegal {
  background-color: @red;
  color: @syntax-background-color;
}

.string {
  color: @orange;


  &.regexp {
    color: @cyan;

    .source.ruby.embedded {
      color: @orange;
    }
  }

  &.other.link {
    color: @red;
  }

  &.unquoted.js {
    color: @light-orange;
  }
}

.punctuation {
  &.definition {
    &.comment {
      color: @light-gray;
    }

    &.string,
    &.variable,
    &.parameters,
    &.array {
      color: @syntax-text-color;
    }

    &.string {
      &.begin,
      &.end {
        color: @red;
      }
    }

    &.heading,
    &.identity {
      color: @blue;
    }

    &.tag {
      color: saturate(spin(darken(@blue, 16%), 6), 13%);
    }

    &.bold {
      color: @light-orange;
      font-weight: bold;
    }

    &.italic {
      color: @purple;
      font-style: italic;
    }
  }

  &.class {
      color: @very-light-gray;
  }

  &.section.embedded {
    color: darken(@red, 10%);
  }

  &.terminator,
  &.key-value {
      color: @light-orange;
  }
}

.support {
  &.class {
    color: @light-orange;
  }

  &.function  {
    color: @light-orange;

    &.any-method {
      color: @very-light-gray;
    }

    &.misc {
      color: @orange;
    }
  }
}

.entity {
  &.name.function {
    //color: @blue;
    color: @white;
  }

  &.name.class,
  &.name.type.class {
    color: @light-orange;
  }

  &.name.section {
    color: @blue;
  }

  &.name.tag {
    color: @blue;
  }

  &.other.attribute-name {
    //color: @blue;

    //&.id {
      //color: @very-light-gray;
      color: @light-orange;
    //}
  }
}

.meta {
  &.class {
    color: @light-orange;
  }

  &.link {
    color: @orange;
  }

  &.require {
    color: @blue;
  }

  &.selector {
    color: @purple;
  }

  &.separator {
    background-color: @gray;
    color: @syntax-text-color;
  }

  &.brace {
    color: @very-light-gray;
  }
}

.none {
  color: @syntax-text-color;
}

.markup {
  &.bold {
    color: @orange;
    font-weight: bold;
  }

  &.changed {
    color: @purple;
  }

  &.deleted {
    color: @red;
  }

  &.italic {
    color: @purple;
    font-style: italic;
  }

  &.heading .punctuation.definition.heading {
    color: @blue;
  }

  &.inserted {
    color: @green;
  }

  &.list {
    color: @red;
  }

  &.quote {
    color: @orange;
  }

  &.raw.inline {
    color: @green;
  }
}

.source.gfm .markup {
  -webkit-font-smoothing: auto;
  &.heading {
    color: @orange;
  }
}

.source.glsl {
  .storage {
    &.modifier {
        color: @blue;
    }
  }
  .support {
    &.function {
      color: @blue;
    }

    &.variable {
      color: @orange;
    }
  }
}

.source.ts {
  .storage {
    &.type {
      color: @blue;
    }
  }

  .entity {
    &.name {
      color: @blue;

      &.function {
        color: @white;
      }
    }

    &.instance {
      color: @light-orange;
    }

    &.inherited-class {
      color: @light-orange;
    }
  }

  .parameter {
    &.function {
      color: @very-light-gray;
    }
  }

  .language {
    &.variable {
      color: @blue;
    }
  }
}

.coffee {
  &.support {
    &.function {
      color: @light-orange;
    }
  }
}

.xhtml,
.sgml,
.html {
  &.doctype {
    color: @orange;
  }

  &.custom {
    &.elements {
      color: @light-orange;
    }
  }
}


.c {
    &.dot-access {
        color: @syntax-text-color;
    }
}

.objc {
    &.punctuation {
        &.scope {
            color: @syntax-text-color;
        }
    }

    &.support {
        &.function {
            color: @light-orange;
        }
    }
}

.objcpp {
    .support {
        color: @light-orange;
    }
}

.cs {
    &.meta {
        &.body {
            color: @syntax-text-color;
        }

        &.method,
        &.namespace {
            &.body {
                color: @syntax-text-color;
            }
            color: @light-orange;
        }

        &.keyword {
            &.using {
                color: @light-orange;

                &.other {
                    color: @cyan;
                }
            }
        }

        .variable {
            &.parameter {
                &.function {
                    color: @syntax-text-color;
                }
            }
        }
    }
}

.uno {
    &.source {
        &.keyword {
            color: @cyan;
        }

        &.meta {
            &.class {
                &.body {
                    color: @syntax-text-color;
                }

                &.identifier {
                    .entity {
                        &.name {
                            color: @syntax-text-color;
                        }
                    }
                }

                .storage {
                    &.type {
                        color: @light-orange;
                    }
                }
            }
            &.method {
                &.return-type {
                    color: @light-orange;
                }
            }
            &.method-call {
                .meta {
                    &.method {
                        color: @light-orange;
                    }
                }
            }

            &.meta {
                .meta {
                    &.method {
                        &.annotation {
                            color: @light-orange;
                        }
                    }
                }
            }
        }
    }
}

.shell {
  &.builtin {
    &.function {
      color: @light-orange;
    }
  }

  &.definition {
    &.variable {
      color: @orange;
    }
  }
}

.dots {
  .constant {
    &.other {
      color: @blue;
    }
  }
}

.regexp {
  color: @orange !important;
}

atom-text-editor[mini] .scroll-view,
:host([mini]) .scroll-view {
  padding-left: 1px;
}