1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
|
$colors: (
white_header_head_neutral : #e1fad7,
white_line_head_neutral : #effdec,
white_button_head_neutral : #9adb84,
white_header_head_chosen : #baf0a8,
white_line_head_chosen : #e1fad7,
white_button_head_chosen : #52c22d,
white_header_origin_neutral : #e0f0ff,
white_line_origin_neutral : #f2f9ff,
white_button_origin_neutral : #87c2fa,
white_header_origin_chosen : #add8ff,
white_line_origin_chosen : #e0f0ff,
white_button_origin_chosen : #268ced,
white_header_not_chosen : #f0f0f0,
white_line_not_chosen : $gray-light,
dark_header_head_neutral : rgba(#3f3, .2),
dark_line_head_neutral : rgba(#3f3, .1),
dark_button_head_neutral : #40874f,
dark_header_head_chosen : rgba(#3f3, .33),
dark_line_head_chosen : rgba(#3f3, .2),
dark_button_head_chosen : #258537,
dark_header_origin_neutral : rgba(#2878c9, .4),
dark_line_origin_neutral : rgba(#2878c9, .3),
dark_button_origin_neutral : #2a5c8c,
dark_header_origin_chosen : rgba(#2878c9, .6),
dark_line_origin_chosen : rgba(#2878c9, .4),
dark_button_origin_chosen : #1d6cbf,
dark_header_not_chosen : rgba(#fff, .25),
dark_line_not_chosen : rgba(#fff, .1),
monokai_header_head_neutral : rgba(#a6e22e, .25),
monokai_line_head_neutral : rgba(#a6e22e, .1),
monokai_button_head_neutral : #376b20,
monokai_header_head_chosen : rgba(#a6e22e, .4),
monokai_line_head_chosen : rgba(#a6e22e, .25),
monokai_button_head_chosen : #39800d,
monokai_header_origin_neutral : rgba(#60d9f1, .35),
monokai_line_origin_neutral : rgba(#60d9f1, .15),
monokai_button_origin_neutral : #38848c,
monokai_header_origin_chosen : rgba(#60d9f1, .5),
monokai_line_origin_chosen : rgba(#60d9f1, .35),
monokai_button_origin_chosen : #3ea4b2,
monokai_header_not_chosen : rgba(#76715d, .24),
monokai_line_not_chosen : rgba(#76715d, .1),
solarized_light_header_head_neutral : rgba(#859900, .37),
solarized_light_line_head_neutral : rgba(#859900, .2),
solarized_light_button_head_neutral : #afb262,
solarized_light_header_head_chosen : rgba(#859900, .5),
solarized_light_line_head_chosen : rgba(#859900, .37),
solarized_light_button_head_chosen : #94993d,
solarized_light_header_origin_neutral : rgba(#2878c9, .37),
solarized_light_line_origin_neutral : rgba(#2878c9, .15),
solarized_light_button_origin_neutral : #60a1bf,
solarized_light_header_origin_chosen : rgba(#2878c9, .6),
solarized_light_line_origin_chosen : rgba(#2878c9, .37),
solarized_light_button_origin_chosen : #2482b2,
solarized_light_header_not_chosen : rgba(#839496, .37),
solarized_light_line_not_chosen : rgba(#839496, .2),
solarized_dark_header_head_neutral : rgba(#859900, .35),
solarized_dark_line_head_neutral : rgba(#859900, .15),
solarized_dark_button_head_neutral : #376b20,
solarized_dark_header_head_chosen : rgba(#859900, .5),
solarized_dark_line_head_chosen : rgba(#859900, .35),
solarized_dark_button_head_chosen : #39800d,
solarized_dark_header_origin_neutral : rgba(#2878c9, .35),
solarized_dark_line_origin_neutral : rgba(#2878c9, .15),
solarized_dark_button_origin_neutral : #086799,
solarized_dark_header_origin_chosen : rgba(#2878c9, .6),
solarized_dark_line_origin_chosen : rgba(#2878c9, .35),
solarized_dark_button_origin_chosen : #0082cc,
solarized_dark_header_not_chosen : rgba(#839496, .25),
solarized_dark_line_not_chosen : rgba(#839496, .15)
);
@mixin color-scheme($color) {
.header.line_content, .diff-line-num {
&.origin {
background-color: map-get($colors, #{$color}_header_origin_neutral);
border-color: map-get($colors, #{$color}_header_origin_neutral);
button {
background-color: map-get($colors, #{$color}_button_origin_neutral);
border-color: darken(map-get($colors, #{$color}_button_origin_neutral), 15);
}
&.selected {
background-color: map-get($colors, #{$color}_header_origin_chosen);
border-color: map-get($colors, #{$color}_header_origin_chosen);
button {
background-color: map-get($colors, #{$color}_button_origin_chosen);
border-color: darken(map-get($colors, #{$color}_button_origin_chosen), 15);
}
}
&.unselected {
background-color: map-get($colors, #{$color}_header_not_chosen);
border-color: map-get($colors, #{$color}_header_not_chosen);
button {
background-color: lighten(map-get($colors, #{$color}_button_origin_neutral), 15);
border-color: map-get($colors, #{$color}_button_origin_neutral);
}
}
}
&.head {
background-color: map-get($colors, #{$color}_header_head_neutral);
border-color: map-get($colors, #{$color}_header_head_neutral);
button {
background-color: map-get($colors, #{$color}_button_head_neutral);
border-color: darken(map-get($colors, #{$color}_button_head_neutral), 15);
}
&.selected {
background-color: map-get($colors, #{$color}_header_head_chosen);
border-color: map-get($colors, #{$color}_header_head_chosen);
button {
background-color: map-get($colors, #{$color}_button_head_chosen);
border-color: darken(map-get($colors, #{$color}_button_head_chosen), 15);
}
}
&.unselected {
background-color: map-get($colors, #{$color}_header_not_chosen);
border-color: map-get($colors, #{$color}_header_not_chosen);
button {
background-color: lighten(map-get($colors, #{$color}_button_head_neutral), 15);
border-color: map-get($colors, #{$color}_button_head_neutral);
}
}
}
}
.line_content {
&.origin {
background-color: map-get($colors, #{$color}_line_origin_neutral);
&.selected {
background-color: map-get($colors, #{$color}_line_origin_chosen);
}
&.unselected {
background-color: map-get($colors, #{$color}_line_not_chosen);
}
}
&.head {
background-color: map-get($colors, #{$color}_line_head_neutral);
&.selected {
background-color: map-get($colors, #{$color}_line_head_chosen);
}
&.unselected {
background-color: map-get($colors, #{$color}_line_not_chosen);
}
}
}
}
#conflicts {
.white {
@include color-scheme('white')
}
.dark {
@include color-scheme('dark')
}
.monokai {
@include color-scheme('monokai')
}
.solarized-light {
@include color-scheme('solarized_light')
}
.solarized-dark {
@include color-scheme('solarized_dark')
}
.diff-wrap-lines .line_content {
white-space: normal;
min-height: 19px;
}
.line_content.header {
position: relative;
button {
border-radius: 2px;
font-size: 10px;
position: absolute;
right: 10px;
padding: 0;
outline: none;
color: #fff;
width: 75px; // static width to make 2 buttons have same width
height: 19px;
}
}
.btn-success .fa-spinner {
color: #fff;
}
}
|
