My custom git color styling for Atom

styles.less

// Colors selected to match the Twilight theme

@git-added-color:     #8F9D6A;
@git-modified-color:  #7587A6;
@git-removed-color:   #CF6A4C;

// Blur inactive windows
body.is-blurred .workspace {
  -webkit-filter: blur(0.13em) hue-rotate(19deg);
}

.workspace .select-list.from-top.overlay {
// Better palette selection hightlighting for various dropdowns
  ol li.selected {
    color: @git-modified-color;
    background-color: #373737;
  }
}

.tree-view {

// Use git colors in file directories
  .list-tree li.status-added, .list-tree li.status-added > .list-item {
    color: @git-added-color;
  }
  .list-tree li.status-modified, .list-tree li.status-modified > .list-item {
    color: @git-modified-color;
  }
  .list-tree li.status-removed, .list-tree li.status-removed > .list-item {
    color: @git-removed-color;
  }
  
  
  .list-tree li.status-ignored, .list-tree li.status-ignored > .list-item {
    display: none;
  }

}

.editor {

}

.editor .cursor {

}

.editor .gutter .line-number {

// Show collapse icons
  &.foldable {
    .icon-right {
      visibility: visible;
    }
  }

// Use git colors in gutter
  &.git-line-added {
  // Modify default
    border-left: 4px solid @git-added-color;
    padding-left: calc(0.5em - 4px);
  // Custom Settings
    color: @git-added-color;
  }
  &.git-line-modified {
  // Modify default
    border-left: 4px solid @git-modified-color;
    padding-left: calc(0.5em - 4px);
  // Custom Settings
    color: @git-modified-color;
  }
  &.git-line-removed {
  // Modify default
    border-left: 4px solid @git-removed-color;
    padding-left: calc(0.5em - 4px);
  // Custom Settings
    color: @git-removed-color;
  }

}

.editor .scroll-view .lines .line {

// Bigger and better ellipses on collapse
  &.fold {
    .fold-marker:after {
    //  Discard special default font
      font-family: none;
    //  Use real ellipses
      content: "\2026";
    // Set bigger font
      font-size: 1.0em;
      font-weight: bold;
      font-style: italic;
    // Make more noticable
      padding-left: 0.3em;
    }
  }

// Current line
  &.cursor-line {
    background: rgba(38, 38, 38, 1);
  }

}

.editor .scroll-view .underlayer {

// Better bracket matching styles
  .bracket-matcher {
  //  Remove default
    border-bottom: 0;
  // Set up as transparent highlight
    opacity: 0.25;
    background-color: #FFFFFF;
  }
  
  .crosshairs .crosshair {
    background-color: white;
    opacity: 0.08;
  }

}

.status-bar {

  .git-view .git-status {
    .icon {
      &.status-added {
        color: @git-added-color;
      }
      &.status-modified {
        color: @git-modified-color;
      }
      &.status-removed {
        color: @git-removed-color;
      }
    }
  }

}