atom-styles.less

atom-text-editor {
  text-rendering: optimizeLegibility;
}

atom-pane .mpe-preview webview {
  // transform: scale(1.4) translate(100px, 100px);
}

.editor,
.pane,
.panes,
.tab-bar,
.tool-bar,
.workspace,
atom-dock .atom-dock-mask,
atom-dock .item-views,
atom-dock .tree-view,
atom-panel,
atom-panel.bottom,
atom-panel-container .footer,
atom-panel-container .left,
atom-text-editor .gutter,
atom-text-editor .gutter-container,
atom-workspace,
atom-workspace-axis,
ink-console,
atom-pane .ink-toolbar .bar,
.welcome,
.welcome-card,
atom-panel.top.tool-panel.panel-top,
.image-view,
body,
regex-railroad-diagram.regex-railroad-diagram,
ink-console .divider,
html {
  background: transparent;
}

atom-panel.go-plus-panel *,
atom-pane .tester-message-header.inline-block,
atom-text-editor .gutter .blame-line {
  background: transparent !important;
}

atom-text-editor .scroll-view {
  padding-top: 0;
}

.syntax--css.syntax--support.syntax--constant {
  color: #f07178;
}

.syntax--comment {
  // color: #efefef;
}

.syntax--entity.syntax--name.syntax--function,
.syntax--js.syntax--variable.syntax--property {
  // color: #b3e5fc;
  color: #89ddf3;
}

.sy .atom-ternjs-documentation,
.atom-ternjs-type {
  color: white;
  // background: rgba(0, 0, 0, 0.78);
  background: #32363b;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

atom-text-editor .gutter .blame-line-marker {
  width: 100%;
  font-size: 0.8em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 200px;
  color: #efefef;
  opacity: 0.7;
}

.no-title-bar:not(.fullscreen) > atom-workspace atom-panel-container.left {
  margin-top: 35px !important;
}

atom-text-editor .wrap-guide {
  background: rgba(255, 255, 255, 0.05);
}

atom-text-editor .indent-guide {
  color: rgba(255, 255, 255, 0.03);
}

atom-pane-container atom-pane .item-views .pane-item {
  background: transparent;
}

.overlay,
atom-panel.modal {
  background: transparent;
}

atom-panel.modal.overlay.from-top {
  background: #32363b;
}

atom-workspace.vim-mode-plus--pane-maximized
  atom-pane-container
  atom-pane
  .item-views {
  background: transparent !important;
}

atom-notification {
  background: rgba(0, 0, 0, 0.5) !important;
}

atom-pane-container atom-pane-axis.horizontal > * {
  border-right: none;
}

atom-text-editor::shadow {
  .cursor-line {
    background-color: rgba(0, 0, 0, 0.15) !important;
  }

  .selection .region {
    background-color: rgba(0, 0, 0, 0.21) !important;
  }

  .gutter {
    background-color: rgba(0, 0, 0, 0) !important;
  }
}

// PlatformIO Terminal
.platformio-ide-terminal.terminal-view {
  background: transparent;
  color: white;

  .xterm.pro {
    background: transparent;
  }

  .terminal-cursor {
    background-color: rgba(255, 255, 255, 0.6);
  }
}

// My favorite color is the rain-bo~
atom-text-editor .syntax--string {
  background: linear-gradient(45deg, #00ffa1, aqua);

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

atom-text-editor .syntax--string .syntax--entity {
  -webkit-text-fill-color: initial;
}

atom-text-editor .syntax--string.syntax--quoted {
  // background: linear-gradient(45deg, #d74177, #ffe98a);
  // background: linear-gradient(45deg, #d4145a, #fbb03b);
  // background: linear-gradient(45deg, #009e00, #ffff96);

  // background: linear-gradient(45deg, #fca5f1, #b5ffff);
  // background: linear-gradient(45deg, #00b7ff, #ffffc7);
  // background: linear-gradient(45deg, #f24645, #ebc08d);
}

.pigments-native-background {
  -webkit-text-fill-color: initial;
}

// Markdown Syntax
.syntax--heading.syntax--md.syntax--markup {
  color: #c3e882;
  font-weight: 500;
}

.syntax--markup.syntax--list {
  color: white;
}

.syntax--punctuation.syntax--section.syntax--end.syntax--trailing.syntax--clojure {
  opacity: 0.2 !important;
}

// API Docs
.api-docs-doc {
  background: transparent;
}

.api-docs-doc::shadow div._content._page {
  background: transparent !important;
  color: white;

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p {
    background: transparent;
    border: none;
  }

  table {
    border: none;

    th {
      background: transparent;
    }
  }

  a {
    color: white;
  }

  pre {
    background: transparent;
    color: white;
    border: none;
  }

  code {
    color: white;
  }
}