1  @import "syntax-variables";
 2  @import "octicon-utf-codes";
 3  @import "octicon-mixins";
 4  
 5  atom-text-editor {
 6    .gutter .line-number {
 7      &.git-line-modified {
 8        border-left: 2px solid @syntax-color-modified;
 9        padding-left: ~"calc(0.5em - 2px)";
10      }
11  
12      &.git-line-added {
13        border-left: 2px solid @syntax-color-added;
14        padding-left: ~"calc(0.5em - 2px)";
15      }
16  
17      @size: 4px;
18      &.git-line-removed:before,
19      &.git-previous-line-removed:before {
20        position: absolute;
21        left: 0;
22        height: 0;
23        width: 0;
24        content: "";
25        border: solid transparent;
26        border-left-color: @syntax-color-removed;
27        border-width: @size;
28        margin-top: -@size;
29        pointer-events: none;
30      }
31      &.git-line-removed:before {
32        bottom: -@size;
33      }
34      &.git-previous-line-removed:before {
35        top: 0;
36      }
37    }
38  
39    .gutter.git-diff-icon .line-number {
40      border-left-width: 0;
41      padding-left: 1.4em; // space for diff icon
42  
43      &:before {
44        .octicon-font();
45        content: "";
46        display: inline-block;
47        position: absolute;
48        top: .2em;
49        left: .4em;
50        height: 0px; // make sure it doesnt affect the gutter line height.
51        width: 1em;
52        font-size: .75em;
53      }
54  
55      &.git-line-modified:before {
56        content: @primitive-dot;
57        color: @syntax-color-modified;
58      }
59  
60      &.git-line-added:before {
61        content: @plus;
62        color: @syntax-color-added;
63      }
64  
65      &.git-line-removed:before,
66      &.git-previous-line-removed:before {
67        border: none; // reset triangle
68        content: @dash;
69        color: @syntax-color-removed;
70      }
71      &.git-line-removed:before {
72        top: 1em;
73      }
74      &.git-previous-line-removed:before {
75        top: 0;
76      }
77    }
78  }