AtomStyleDarkUI #less

AtomStyleDarkUI.less

/*
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 */

/* style the background color of the tree view */
.tree-view {
  background-color: black;
}

/* style the background and foreground colors on the atom-text-editor-element itself */
atom-text-editor {
  background-color: black;
}

/* Gutter style */
atom-text-editor.editor .gutter {
    background-color: black;
}

/* Gutter line number style and foldable icon style */
.editor {
  .gutter {
    .line-number {
      padding: 0 0 0 0.25em;
      color: blue !important;
      .icon-right {
          padding-right: 0.1em
      }
    }
    .line-number.cursor-line { // Gutter active line number style 
        background-color: teal !important;
        color: cyan !important;
    }
  }
  .cursor {
    border-color: cyan;
  }
  .cursor-line {
    background: rgba(100, 100, 100, 0.3);
  }
}

/* Gutter active element style */
.file.entry.list-item.selected span {
  font-weight: bold;
  font-family: Times;
  font-size: 1.1em;
  margin: 4px 0;
  &:after {
    content: ' (Active)';
  }
}

/* Thinner Tabs style */
.tab-bar {
  height: 34px;
  padding: 0;
  .tab {
    -webkit-transform: none;
    top: 2px; line-height: 25px;
    &.active {
      height: 25px;
      color: lime;
      font-size: 1.1em;
      font-family: Times;
      &:before {
        height: 25px;
      }
      .close-icon {
        -webkit-transform: none;
        line-height: 25px;
        color: red;
      }
    }
    &:before {
      -webkit-transform: none;
      width: 18px;
    }
    .close-icon {
      -webkit-transform: none;
      line-height: 25px;
    }
    .close-icon:hover {
      -webkit-transform: none;
      line-height: 25px;
      color: red;
    }
    .title {
      -webkit-transform: none;
    }
  }
}