Atom Stylesheet with background whitespace grid & styled html properties

Atom-Stylesheet.less

// Atom Styles
// theme: one-dark
// syntax: apm install oceanic-next

atom-text-editor,
atom-workspace {
  font-family: "Fira Code"; // https://github.com/tonsky/FiraCode
  font-size: 14px;
  line-height: 1.7;
}

// Tabs
atom-pane {
  .tab-bar {
    height: 32px
  }
  .tab-bar > .tab {
    font-size: 0.75em;
  }
}

// Sidebar
atom-panel.tool-panel {
  font-size: 0.85em;
  // no padding on first level of tree
  .tree-view-scroller > ol > li > ol > li.entry.list-nested-item {
    // font-size: 0.85em;
    padding-left: 0;
  }
  .tree-view-scroller > ol > li > ol > li.file.entry.list-item {
    // font-size: 0.85em;
    padding-left: 0;
    margin-left: 2px;
  }
}

// Terminal
.terminal-view {
  .xterm {
    background-color: rgb(0, 10, 17);
  }
  .terminal {
    line-height: 1.5;
    letter-spacing: 0.8px;
    color: rgb(123, 183, 200);
  }
}

// Editor Styles
atom-text-editor::shadow {
  
  text-rendering: optimizeLegibility;
  
  // Target Attributes, JS
  .source.html,
  .source.js,
  .source.jsx .source.ts,
  .source.tsx {
    .entity.other.attribute-name,
    .this {
      font-family: "Operator Mono"; // http://www.typography.com/blog/introducing-operator
      font-style: italic;
    }
  }
  
  // TypeScript
  .source.ts,
  .source.tsx {
    .meta.type {
      font-family: "Operator Mono";
      font-style: italic;
    }
  }
  
  // leading whitespace
  .leading-whitespace {
    color: rgba(0,0,0,0);
    position: relative;
    box-shadow: inset 1px 0 0 rgba(255,255,255,0.1);
  }
  .leading-whitespace:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }
}

Preview: