styles.less

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 *
 * Add your own CSS or Less to fully customize Atom.
 * If you are unfamiliar with Less, you can read more about it here:
 * http://lesscss.org
 */

@import "syntax-variables";

.deprecation-cop-status.inline-block.text-warnin {
  display: none;
}

@git-added-color:     #5988b4;
@git-modified-color:  #7287b9;
@git-removed-color:   #556b8e;
@git-added-bg-color:  darken(@syntax-background-color, 5%);

atom-workspace,
atom-text-editor {
    font-family: "Operator Mono";
    font-size: 15px;
    font-weight: normal;
    line-height: 1.7;

    .syntax--entity.syntax--name.syntax--tag.syntax--js {
      color: rgb(233, 211, 154);
    }
}

atom-panel.tool-panel {
    font-size: 0.88em;
}

.pane {
  font-size: 0.88em;
}

.editor .comment,
atom-text-editor.editor .syntax--comment {
    font-family: "Operator Mono";
    font-style: italic;
}

.entity.other.attribute-name {
    font-style: italic;
}

atom-text-editor::shadow{
    .entity.other.attribute-name, .syntax--variable.syntax--language.syntax--js {
        font-style: italic;
    }
}


// NO SCORLLBARS
::-webkit-scrollbar {
    display: none;
}

.editor.mini {
  .scroll-view {
    padding-left: 0em !important;
  }
}

.gutter(@gutter) when (@gutter = true) {
  .line-numbers {
    // display: none;
    -webkit-tap-highlight-color:rgba(51, 181, 229, 0.4);
    -webkit-text-emphasis-color:rgb(213, 213, 209);
    -webkit-text-emphasis-position:over;
    -webkit-text-emphasis-style:none;
    -webkit-text-fill-color:rgb(213, 213, 209);
    -webkit-text-orientation:vertical-right;
    -webkit-text-security:none;
    -webkit-text-stroke-color:rgb(213, 213, 209);
    box-shadow: none !important;
  }

  .gutter {
    background: none !important;
  }

  .line-number.cursor-line {
    box-shadow: none !important;
  }

  .gutter > * {
    box-shadow: none !important;
  }

  .scroll-view {
    padding-left: 0em !important;
  }
}

.gutter(@gutter) when not (@gutter = true) {
  .gutter-container {
    display: none !important;
  }

  .editor {
    .scroll-view {
      padding-left: 2em !important;
    }
  }
}

// CUSTOM use this to toggle gutter
// .gutter(true);
.gutter(false);

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-right > div.about-release-notes.inline-block {
  display: none;
}

body > atom-workspace > atom-workspace-axis > atom-panel-container.left > atom-dock > div > div.atom-dock-mask > div > atom-pane-container > atom-pane > ul {
   display: none;
 }

 .editor.is-focused {
  .line.cursor-line {
    background: transparent;
  }
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-left > div {
  display: none;
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-left > status-bar-file {
  display: none;
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-right > div.package-updates-status-view.inline-block.text.text-info {
  display: none;
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-right > div.github-StatusBarTileController > a {
  display: none;
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar > div > div.status-bar-right > a {
  // display: none;
  // teletype
}

body > atom-workspace > atom-panel-container.footer > atom-panel > status-bar {
  font-size: 0.9em
}

body > atom-workspace > atom-workspace-axis > atom-panel-container.left > atom-dock > div {
  border-right: 1px solid darken(@syntax-background-color, 5%);
}



 /*
 @syntax-color-renamed:  @attribute;
 @syntax-color-added:    @variable;
 @syntax-color-modified: @tag;
 @syntax-color-removed: @error;
 */

@import "ui-variables";
// @app-background-color: @syntax-background-color;
// @accent-color:
// @base-color:

/*
 * Examples
 * (To see them, uncomment and save)
 */


//CUSTOM
// style the background color of the tree view
.tree-view {
  background-color: @syntax-background-color;

  //CUSTOM
  // Use git colors in file directories
  //Git colors
  .list-tree li.status-added, .list-tree li.status-added > .list-item {
    color: @git-added-color !important;
  }
  .list-tree li.status-modified, .list-tree li.status-modified > .list-item {
    color: @git-modified-color !important;
  }
  .list-tree li.status-removed, .list-tree li.status-removed > .list-item {
    color: @git-removed-color !important;
  }

  .list-tree li.status-ignored, .list-tree li.status-ignored > .list-item {
    //display: none;
  }

  //Git color backgrounds
  .list-tree li.directory.selected.status-added > .list-item::after {
    background-color: @git-added-bg-color !important;
  }

  .list-tree li.status-added.selected::before {
    background-color: @git-added-bg-color !important;
  }

  //Normal colors
  .list-tree li.selected:focus, .list-tree li.selected > .list-item::after {
    background-color: @git-removed-color !important;
  }

  .list-tree li.selected:focus, .list-tree li.selected > .list-item::after {
    background-color: @git-removed-color !important;
  }

}

// style the background and foreground colors on the atom-text-editor-element itself
atom-text-editor {
  //color: white;
  //background-color: #373737
}

// To style other content in the text editor's shadow DOM, use the ::shadow expression
atom-text-editor::shadow .cursor {
  //border-color: red;
}
atom-text-editor::shadow .gutter {
    //background-color: #1d1f21;
}
.tab-bar {
  //background-color: #373737;
  .tab::before {
    // background-color: @accent-color;
  }
}

//CUSTOM: hide the wrap guide
.editor {
  .wrap-guide {
    visibility: hidden !important;
  }
}

atom-panel.bottom {
  // background-color: #373737;
}

.editor .gutter .line-number {
  // CUSTOM
  // 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;
  }

}

// .status-bar {
//   display: none;
// }