##// END OF EJS Templates
diffs: fixed selecting active lines in both types of diffs.
dan -
r3130:dc7450ba default
parent child Browse files
Show More
@@ -1,1228 +1,1231 b''
1 // Default styles
1 // Default styles
2
2
3 .diff-collapse {
3 .diff-collapse {
4 margin: @padding 0;
4 margin: @padding 0;
5 text-align: right;
5 text-align: right;
6 }
6 }
7
7
8 .diff-container {
8 .diff-container {
9 margin-bottom: @space;
9 margin-bottom: @space;
10
10
11 .diffblock {
11 .diffblock {
12 margin-bottom: @space;
12 margin-bottom: @space;
13 }
13 }
14
14
15 &.hidden {
15 &.hidden {
16 display: none;
16 display: none;
17 overflow: hidden;
17 overflow: hidden;
18 }
18 }
19 }
19 }
20
20
21
21
22 div.diffblock .sidebyside {
22 div.diffblock .sidebyside {
23 background: #ffffff;
23 background: #ffffff;
24 }
24 }
25
25
26 div.diffblock {
26 div.diffblock {
27 overflow-x: auto;
27 overflow-x: auto;
28 overflow-y: hidden;
28 overflow-y: hidden;
29 clear: both;
29 clear: both;
30 padding: 0px;
30 padding: 0px;
31 background: @grey6;
31 background: @grey6;
32 border: @border-thickness solid @grey5;
32 border: @border-thickness solid @grey5;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
35
35
36
36
37 .comments-number {
37 .comments-number {
38 float: right;
38 float: right;
39 }
39 }
40
40
41 // BEGIN CODE-HEADER STYLES
41 // BEGIN CODE-HEADER STYLES
42
42
43 .code-header {
43 .code-header {
44 background: @grey6;
44 background: @grey6;
45 padding: 10px 0 10px 0;
45 padding: 10px 0 10px 0;
46 height: auto;
46 height: auto;
47 width: 100%;
47 width: 100%;
48
48
49 .hash {
49 .hash {
50 float: left;
50 float: left;
51 padding: 2px 0 0 2px;
51 padding: 2px 0 0 2px;
52 }
52 }
53
53
54 .date {
54 .date {
55 float: left;
55 float: left;
56 text-transform: uppercase;
56 text-transform: uppercase;
57 padding: 4px 0px 0px 2px;
57 padding: 4px 0px 0px 2px;
58 }
58 }
59
59
60 div {
60 div {
61 margin-left: 4px;
61 margin-left: 4px;
62 }
62 }
63
63
64 div.compare_header {
64 div.compare_header {
65 min-height: 40px;
65 min-height: 40px;
66 margin: 0;
66 margin: 0;
67 padding: 0 @padding;
67 padding: 0 @padding;
68
68
69 .drop-menu {
69 .drop-menu {
70 float:left;
70 float:left;
71 display: block;
71 display: block;
72 margin:0 0 @padding 0;
72 margin:0 0 @padding 0;
73 }
73 }
74
74
75 .compare-label {
75 .compare-label {
76 float: left;
76 float: left;
77 clear: both;
77 clear: both;
78 display: inline-block;
78 display: inline-block;
79 min-width: 5em;
79 min-width: 5em;
80 margin: 0;
80 margin: 0;
81 padding: @button-padding @button-padding @button-padding 0;
81 padding: @button-padding @button-padding @button-padding 0;
82 font-family: @text-semibold;
82 font-family: @text-semibold;
83 }
83 }
84
84
85 .compare-buttons {
85 .compare-buttons {
86 float: left;
86 float: left;
87 margin: 0;
87 margin: 0;
88 padding: 0 0 @padding;
88 padding: 0 0 @padding;
89
89
90 .btn {
90 .btn {
91 margin: 0 @padding 0 0;
91 margin: 0 @padding 0 0;
92 }
92 }
93 }
93 }
94 }
94 }
95
95
96 }
96 }
97
97
98 .parents {
98 .parents {
99 float: left;
99 float: left;
100 width: 100px;
100 width: 100px;
101 font-weight: 400;
101 font-weight: 400;
102 vertical-align: middle;
102 vertical-align: middle;
103 padding: 0px 2px 0px 2px;
103 padding: 0px 2px 0px 2px;
104 background-color: @grey6;
104 background-color: @grey6;
105
105
106 #parent_link {
106 #parent_link {
107 margin: 00px 2px;
107 margin: 00px 2px;
108
108
109 &.double {
109 &.double {
110 margin: 0px 2px;
110 margin: 0px 2px;
111 }
111 }
112
112
113 &.disabled{
113 &.disabled{
114 margin-right: @padding;
114 margin-right: @padding;
115 }
115 }
116 }
116 }
117 }
117 }
118
118
119 .children {
119 .children {
120 float: right;
120 float: right;
121 width: 100px;
121 width: 100px;
122 font-weight: 400;
122 font-weight: 400;
123 vertical-align: middle;
123 vertical-align: middle;
124 text-align: right;
124 text-align: right;
125 padding: 0px 2px 0px 2px;
125 padding: 0px 2px 0px 2px;
126 background-color: @grey6;
126 background-color: @grey6;
127
127
128 #child_link {
128 #child_link {
129 margin: 0px 2px;
129 margin: 0px 2px;
130
130
131 &.double {
131 &.double {
132 margin: 0px 2px;
132 margin: 0px 2px;
133 }
133 }
134
134
135 &.disabled{
135 &.disabled{
136 margin-right: @padding;
136 margin-right: @padding;
137 }
137 }
138 }
138 }
139 }
139 }
140
140
141 .changeset_header {
141 .changeset_header {
142 height: 16px;
142 height: 16px;
143
143
144 & > div{
144 & > div{
145 margin-right: @padding;
145 margin-right: @padding;
146 }
146 }
147 }
147 }
148
148
149 .changeset_file {
149 .changeset_file {
150 text-align: left;
150 text-align: left;
151 float: left;
151 float: left;
152 padding: 0;
152 padding: 0;
153
153
154 a{
154 a{
155 display: inline-block;
155 display: inline-block;
156 margin-right: 0.5em;
156 margin-right: 0.5em;
157 }
157 }
158
158
159 #selected_mode{
159 #selected_mode{
160 margin-left: 0;
160 margin-left: 0;
161 }
161 }
162 }
162 }
163
163
164 .diff-menu-wrapper {
164 .diff-menu-wrapper {
165 float: left;
165 float: left;
166 }
166 }
167
167
168 .diff-menu {
168 .diff-menu {
169 position: absolute;
169 position: absolute;
170 background: none repeat scroll 0 0 #FFFFFF;
170 background: none repeat scroll 0 0 #FFFFFF;
171 border-color: #003367 @grey3 @grey3;
171 border-color: #003367 @grey3 @grey3;
172 border-right: 1px solid @grey3;
172 border-right: 1px solid @grey3;
173 border-style: solid solid solid;
173 border-style: solid solid solid;
174 border-width: @border-thickness;
174 border-width: @border-thickness;
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
176 margin-top: 5px;
176 margin-top: 5px;
177 margin-left: 1px;
177 margin-left: 1px;
178 }
178 }
179
179
180 .diff-actions, .editor-actions {
180 .diff-actions, .editor-actions {
181 float: left;
181 float: left;
182
182
183 input{
183 input{
184 margin: 0 0.5em 0 0;
184 margin: 0 0.5em 0 0;
185 }
185 }
186 }
186 }
187
187
188 // END CODE-HEADER STYLES
188 // END CODE-HEADER STYLES
189
189
190 // BEGIN CODE-BODY STYLES
190 // BEGIN CODE-BODY STYLES
191
191
192 .code-body {
192 .code-body {
193 padding: 0;
193 padding: 0;
194 background-color: #ffffff;
194 background-color: #ffffff;
195 position: relative;
195 position: relative;
196 max-width: none;
196 max-width: none;
197 box-sizing: border-box;
197 box-sizing: border-box;
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
199 // to have the intended size and to scroll. Should be simplified.
199 // to have the intended size and to scroll. Should be simplified.
200 width: 100%;
200 width: 100%;
201 overflow-x: auto;
201 overflow-x: auto;
202 }
202 }
203
203
204 pre.raw {
204 pre.raw {
205 background: white;
205 background: white;
206 color: @grey1;
206 color: @grey1;
207 }
207 }
208 // END CODE-BODY STYLES
208 // END CODE-BODY STYLES
209
209
210 }
210 }
211
211
212
212
213 table.code-difftable {
213 table.code-difftable {
214 border-collapse: collapse;
214 border-collapse: collapse;
215 width: 99%;
215 width: 99%;
216 border-radius: 0px !important;
216 border-radius: 0px !important;
217
217
218 td {
218 td {
219 padding: 0 !important;
219 padding: 0 !important;
220 background: none !important;
220 background: none !important;
221 border: 0 !important;
221 border: 0 !important;
222 }
222 }
223
223
224 .context {
224 .context {
225 background: none repeat scroll 0 0 #DDE7EF;
225 background: none repeat scroll 0 0 #DDE7EF;
226 }
226 }
227
227
228 .add {
228 .add {
229 background: none repeat scroll 0 0 #DDFFDD;
229 background: none repeat scroll 0 0 #DDFFDD;
230
230
231 ins {
231 ins {
232 background: none repeat scroll 0 0 #AAFFAA;
232 background: none repeat scroll 0 0 #AAFFAA;
233 text-decoration: none;
233 text-decoration: none;
234 }
234 }
235 }
235 }
236
236
237 .del {
237 .del {
238 background: none repeat scroll 0 0 #FFDDDD;
238 background: none repeat scroll 0 0 #FFDDDD;
239
239
240 del {
240 del {
241 background: none repeat scroll 0 0 #FFAAAA;
241 background: none repeat scroll 0 0 #FFAAAA;
242 text-decoration: none;
242 text-decoration: none;
243 }
243 }
244 }
244 }
245
245
246 /** LINE NUMBERS **/
246 /** LINE NUMBERS **/
247 .lineno {
247 .lineno {
248 padding-left: 2px !important;
248 padding-left: 2px !important;
249 padding-right: 2px;
249 padding-right: 2px;
250 text-align: right;
250 text-align: right;
251 width: 32px;
251 width: 32px;
252 -moz-user-select: none;
252 -moz-user-select: none;
253 -webkit-user-select: none;
253 -webkit-user-select: none;
254 border-right: @border-thickness solid @grey5 !important;
254 border-right: @border-thickness solid @grey5 !important;
255 border-left: 0px solid #CCC !important;
255 border-left: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
257 border-bottom: none !important;
257 border-bottom: none !important;
258
258
259 a {
259 a {
260 &:extend(pre);
260 &:extend(pre);
261 text-align: right;
261 text-align: right;
262 padding-right: 2px;
262 padding-right: 2px;
263 cursor: pointer;
263 cursor: pointer;
264 display: block;
264 display: block;
265 width: 32px;
265 width: 32px;
266 }
266 }
267 }
267 }
268
268
269 .context {
269 .context {
270 cursor: auto;
270 cursor: auto;
271 &:extend(pre);
271 &:extend(pre);
272 }
272 }
273
273
274 .lineno-inline {
274 .lineno-inline {
275 background: none repeat scroll 0 0 #FFF !important;
275 background: none repeat scroll 0 0 #FFF !important;
276 padding-left: 2px;
276 padding-left: 2px;
277 padding-right: 2px;
277 padding-right: 2px;
278 text-align: right;
278 text-align: right;
279 width: 30px;
279 width: 30px;
280 -moz-user-select: none;
280 -moz-user-select: none;
281 -webkit-user-select: none;
281 -webkit-user-select: none;
282 }
282 }
283
283
284 /** CODE **/
284 /** CODE **/
285 .code {
285 .code {
286 display: block;
286 display: block;
287 width: 100%;
287 width: 100%;
288
288
289 td {
289 td {
290 margin: 0;
290 margin: 0;
291 padding: 0;
291 padding: 0;
292 }
292 }
293
293
294 pre {
294 pre {
295 margin: 0;
295 margin: 0;
296 padding: 0;
296 padding: 0;
297 margin-left: .5em;
297 margin-left: .5em;
298 }
298 }
299 }
299 }
300 }
300 }
301
301
302
302
303 // Comments
303 // Comments
304
304
305 div.comment:target {
305 div.comment:target {
306 border-left: 6px solid @comment-highlight-color !important;
306 border-left: 6px solid @comment-highlight-color !important;
307 padding-left: 3px;
307 padding-left: 3px;
308 margin-left: -9px;
308 margin-left: -9px;
309 }
309 }
310
310
311 //TODO: anderson: can't get an absolute number out of anything, so had to put the
311 //TODO: anderson: can't get an absolute number out of anything, so had to put the
312 //current values that might change. But to make it clear I put as a calculation
312 //current values that might change. But to make it clear I put as a calculation
313 @comment-max-width: 1065px;
313 @comment-max-width: 1065px;
314 @pr-extra-margin: 34px;
314 @pr-extra-margin: 34px;
315 @pr-border-spacing: 4px;
315 @pr-border-spacing: 4px;
316 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
316 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
317
317
318 // Pull Request
318 // Pull Request
319 .cs_files .code-difftable {
319 .cs_files .code-difftable {
320 border: @border-thickness solid @grey5; //borders only on PRs
320 border: @border-thickness solid @grey5; //borders only on PRs
321
321
322 .comment-inline-form,
322 .comment-inline-form,
323 div.comment {
323 div.comment {
324 width: @pr-comment-width;
324 width: @pr-comment-width;
325 }
325 }
326 }
326 }
327
327
328 // Changeset
328 // Changeset
329 .code-difftable {
329 .code-difftable {
330 .comment-inline-form,
330 .comment-inline-form,
331 div.comment {
331 div.comment {
332 width: @comment-max-width;
332 width: @comment-max-width;
333 }
333 }
334 }
334 }
335
335
336 //Style page
336 //Style page
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
338 #style-page .code-difftable{
338 #style-page .code-difftable{
339 .comment-inline-form,
339 .comment-inline-form,
340 div.comment {
340 div.comment {
341 width: @comment-max-width - @style-extra-margin;
341 width: @comment-max-width - @style-extra-margin;
342 }
342 }
343 }
343 }
344
344
345 #context-bar > h2 {
345 #context-bar > h2 {
346 font-size: 20px;
346 font-size: 20px;
347 }
347 }
348
348
349 #context-bar > h2> a {
349 #context-bar > h2> a {
350 font-size: 20px;
350 font-size: 20px;
351 }
351 }
352 // end of defaults
352 // end of defaults
353
353
354 .file_diff_buttons {
354 .file_diff_buttons {
355 padding: 0 0 @padding;
355 padding: 0 0 @padding;
356
356
357 .drop-menu {
357 .drop-menu {
358 float: left;
358 float: left;
359 margin: 0 @padding 0 0;
359 margin: 0 @padding 0 0;
360 }
360 }
361 .btn {
361 .btn {
362 margin: 0 @padding 0 0;
362 margin: 0 @padding 0 0;
363 }
363 }
364 }
364 }
365
365
366 .code-body.textarea.editor {
366 .code-body.textarea.editor {
367 max-width: none;
367 max-width: none;
368 padding: 15px;
368 padding: 15px;
369 }
369 }
370
370
371 td.injected_diff{
371 td.injected_diff{
372 max-width: 1178px;
372 max-width: 1178px;
373 overflow-x: auto;
373 overflow-x: auto;
374 overflow-y: hidden;
374 overflow-y: hidden;
375
375
376 div.diff-container,
376 div.diff-container,
377 div.diffblock{
377 div.diffblock{
378 max-width: 100%;
378 max-width: 100%;
379 }
379 }
380
380
381 div.code-body {
381 div.code-body {
382 max-width: 1124px;
382 max-width: 1124px;
383 overflow-x: auto;
383 overflow-x: auto;
384 overflow-y: hidden;
384 overflow-y: hidden;
385 padding: 0;
385 padding: 0;
386 }
386 }
387 div.diffblock {
387 div.diffblock {
388 border: none;
388 border: none;
389 }
389 }
390
390
391 &.inline-form {
391 &.inline-form {
392 width: 99%
392 width: 99%
393 }
393 }
394 }
394 }
395
395
396
396
397 table.code-difftable {
397 table.code-difftable {
398 width: 100%;
398 width: 100%;
399 }
399 }
400
400
401 /** PYGMENTS COLORING **/
401 /** PYGMENTS COLORING **/
402 div.codeblock {
402 div.codeblock {
403
403
404 // TODO: johbo: Added interim to get rid of the margin around
404 // TODO: johbo: Added interim to get rid of the margin around
405 // Select2 widgets. This needs further cleanup.
405 // Select2 widgets. This needs further cleanup.
406 margin-top: @padding;
406 margin-top: @padding;
407
407
408 overflow: auto;
408 overflow: auto;
409 padding: 0px;
409 padding: 0px;
410 border: @border-thickness solid @grey5;
410 border: @border-thickness solid @grey5;
411 background: @grey6;
411 background: @grey6;
412 .border-radius(@border-radius);
412 .border-radius(@border-radius);
413
413
414 #remove_gist {
414 #remove_gist {
415 float: right;
415 float: right;
416 }
416 }
417
417
418 .gist_url {
418 .gist_url {
419 padding: 0px 0px 10px 0px;
419 padding: 0px 0px 10px 0px;
420 }
420 }
421
421
422 .author {
422 .author {
423 clear: both;
423 clear: both;
424 vertical-align: middle;
424 vertical-align: middle;
425 font-family: @text-bold;
425 font-family: @text-bold;
426 }
426 }
427
427
428 .btn-mini {
428 .btn-mini {
429 float: left;
429 float: left;
430 margin: 0 5px 0 0;
430 margin: 0 5px 0 0;
431 }
431 }
432
432
433 .code-header {
433 .code-header {
434 padding: @padding;
434 padding: @padding;
435 border-bottom: @border-thickness solid @grey5;
435 border-bottom: @border-thickness solid @grey5;
436
436
437 .rc-user {
437 .rc-user {
438 min-width: 0;
438 min-width: 0;
439 margin-right: .5em;
439 margin-right: .5em;
440 }
440 }
441
441
442 .stats {
442 .stats {
443 clear: both;
443 clear: both;
444 margin: 0 0 @padding 0;
444 margin: 0 0 @padding 0;
445 padding: 0;
445 padding: 0;
446 .left {
446 .left {
447 float: left;
447 float: left;
448 clear: left;
448 clear: left;
449 max-width: 75%;
449 max-width: 75%;
450 margin: 0 0 @padding 0;
450 margin: 0 0 @padding 0;
451
451
452 &.item {
452 &.item {
453 margin-right: @padding;
453 margin-right: @padding;
454 &.last { border-right: none; }
454 &.last { border-right: none; }
455 }
455 }
456 }
456 }
457 .buttons { float: right; }
457 .buttons { float: right; }
458 .author {
458 .author {
459 height: 25px; margin-left: 15px; font-weight: bold;
459 height: 25px; margin-left: 15px; font-weight: bold;
460 }
460 }
461 }
461 }
462
462
463 .commit {
463 .commit {
464 margin: 5px 0 0 26px;
464 margin: 5px 0 0 26px;
465 font-weight: normal;
465 font-weight: normal;
466 white-space: pre-wrap;
466 white-space: pre-wrap;
467 }
467 }
468 }
468 }
469
469
470 .message {
470 .message {
471 position: relative;
471 position: relative;
472 margin: @padding;
472 margin: @padding;
473
473
474 .codeblock-label {
474 .codeblock-label {
475 margin: 0 0 1em 0;
475 margin: 0 0 1em 0;
476 }
476 }
477 }
477 }
478
478
479 .code-body {
479 .code-body {
480 padding: @padding;
480 padding: @padding;
481 background-color: #ffffff;
481 background-color: #ffffff;
482 min-width: 100%;
482 min-width: 100%;
483 box-sizing: border-box;
483 box-sizing: border-box;
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
485 // to have the intended size and to scroll. Should be simplified.
485 // to have the intended size and to scroll. Should be simplified.
486 width: 100%;
486 width: 100%;
487 overflow-x: auto;
487 overflow-x: auto;
488
488
489 img.rendered-binary {
489 img.rendered-binary {
490 height: auto;
490 height: auto;
491 width: 100%;
491 width: 100%;
492 }
492 }
493 }
493 }
494 }
494 }
495
495
496 .code-highlighttable,
496 .code-highlighttable,
497 div.codeblock {
497 div.codeblock {
498
498
499 &.readme {
499 &.readme {
500 background-color: white;
500 background-color: white;
501 }
501 }
502
502
503 .markdown-block table {
503 .markdown-block table {
504 border-collapse: collapse;
504 border-collapse: collapse;
505
505
506 th,
506 th,
507 td {
507 td {
508 padding: .5em;
508 padding: .5em;
509 border: @border-thickness solid @border-default-color;
509 border: @border-thickness solid @border-default-color;
510 }
510 }
511 }
511 }
512
512
513 table {
513 table {
514 border: 0px;
514 border: 0px;
515 margin: 0;
515 margin: 0;
516 letter-spacing: normal;
516 letter-spacing: normal;
517
517
518
518
519 td {
519 td {
520 border: 0px;
520 border: 0px;
521 vertical-align: top;
521 vertical-align: top;
522 }
522 }
523 }
523 }
524 }
524 }
525
525
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
527 div.search-code-body {
527 div.search-code-body {
528 background-color: #ffffff; padding: 5px 0 5px 10px;
528 background-color: #ffffff; padding: 5px 0 5px 10px;
529 pre {
529 pre {
530 .match { background-color: #faffa6;}
530 .match { background-color: #faffa6;}
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
532 }
532 }
533 .code-highlighttable {
533 .code-highlighttable {
534 border-collapse: collapse;
534 border-collapse: collapse;
535
535
536 tr:hover {
536 tr:hover {
537 background: #fafafa;
537 background: #fafafa;
538 }
538 }
539 td.code {
539 td.code {
540 padding-left: 10px;
540 padding-left: 10px;
541 }
541 }
542 td.line {
542 td.line {
543 border-right: 1px solid #ccc !important;
543 border-right: 1px solid #ccc !important;
544 padding-right: 10px;
544 padding-right: 10px;
545 text-align: right;
545 text-align: right;
546 font-family: "Lucida Console",Monaco,monospace;
546 font-family: "Lucida Console",Monaco,monospace;
547 span {
547 span {
548 white-space: pre-wrap;
548 white-space: pre-wrap;
549 color: #666666;
549 color: #666666;
550 }
550 }
551 }
551 }
552 }
552 }
553 }
553 }
554
554
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
556 .code-highlight {
556 .code-highlight {
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
559 pre div:target {background-color: @comment-highlight-color !important;}
559 pre div:target {background-color: @comment-highlight-color !important;}
560 }
560 }
561
561
562 .linenos a { text-decoration: none; }
562 .linenos a { text-decoration: none; }
563
563
564 .CodeMirror-selected { background: @rchighlightblue; }
564 .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
568
568
569 .code { display: block; border:0px !important; }
569 .code { display: block; border:0px !important; }
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
571 .codehilite {
571 .codehilite {
572 .hll { background-color: #ffffcc }
572 .hll { background-color: #ffffcc }
573 .c { color: #408080; font-style: italic } /* Comment */
573 .c { color: #408080; font-style: italic } /* Comment */
574 .err, .codehilite .err { border: none } /* Error */
574 .err, .codehilite .err { border: none } /* Error */
575 .k { color: #008000; font-weight: bold } /* Keyword */
575 .k { color: #008000; font-weight: bold } /* Keyword */
576 .o { color: #666666 } /* Operator */
576 .o { color: #666666 } /* Operator */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
581 .gd { color: #A00000 } /* Generic.Deleted */
581 .gd { color: #A00000 } /* Generic.Deleted */
582 .ge { font-style: italic } /* Generic.Emph */
582 .ge { font-style: italic } /* Generic.Emph */
583 .gr { color: #FF0000 } /* Generic.Error */
583 .gr { color: #FF0000 } /* Generic.Error */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
585 .gi { color: #00A000 } /* Generic.Inserted */
585 .gi { color: #00A000 } /* Generic.Inserted */
586 .go { color: #808080 } /* Generic.Output */
586 .go { color: #808080 } /* Generic.Output */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
588 .gs { font-weight: bold } /* Generic.Strong */
588 .gs { font-weight: bold } /* Generic.Strong */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
590 .gt { color: #0040D0 } /* Generic.Traceback */
590 .gt { color: #0040D0 } /* Generic.Traceback */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
594 .kp { color: #008000 } /* Keyword.Pseudo */
594 .kp { color: #008000 } /* Keyword.Pseudo */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
596 .kt { color: #B00040 } /* Keyword.Type */
596 .kt { color: #B00040 } /* Keyword.Type */
597 .m { color: #666666 } /* Literal.Number */
597 .m { color: #666666 } /* Literal.Number */
598 .s { color: #BA2121 } /* Literal.String */
598 .s { color: #BA2121 } /* Literal.String */
599 .na { color: #7D9029 } /* Name.Attribute */
599 .na { color: #7D9029 } /* Name.Attribute */
600 .nb { color: #008000 } /* Name.Builtin */
600 .nb { color: #008000 } /* Name.Builtin */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
602 .no { color: #880000 } /* Name.Constant */
602 .no { color: #880000 } /* Name.Constant */
603 .nd { color: #AA22FF } /* Name.Decorator */
603 .nd { color: #AA22FF } /* Name.Decorator */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
606 .nf { color: #0000FF } /* Name.Function */
606 .nf { color: #0000FF } /* Name.Function */
607 .nl { color: #A0A000 } /* Name.Label */
607 .nl { color: #A0A000 } /* Name.Label */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
610 .nv { color: #19177C } /* Name.Variable */
610 .nv { color: #19177C } /* Name.Variable */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
612 .w { color: #bbbbbb } /* Text.Whitespace */
612 .w { color: #bbbbbb } /* Text.Whitespace */
613 .mf { color: #666666 } /* Literal.Number.Float */
613 .mf { color: #666666 } /* Literal.Number.Float */
614 .mh { color: #666666 } /* Literal.Number.Hex */
614 .mh { color: #666666 } /* Literal.Number.Hex */
615 .mi { color: #666666 } /* Literal.Number.Integer */
615 .mi { color: #666666 } /* Literal.Number.Integer */
616 .mo { color: #666666 } /* Literal.Number.Oct */
616 .mo { color: #666666 } /* Literal.Number.Oct */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
618 .sc { color: #BA2121 } /* Literal.String.Char */
618 .sc { color: #BA2121 } /* Literal.String.Char */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
624 .sx { color: #008000 } /* Literal.String.Other */
624 .sx { color: #008000 } /* Literal.String.Other */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
627 .ss { color: #19177C } /* Literal.String.Symbol */
627 .ss { color: #19177C } /* Literal.String.Symbol */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
629 .vc { color: #19177C } /* Name.Variable.Class */
629 .vc { color: #19177C } /* Name.Variable.Class */
630 .vg { color: #19177C } /* Name.Variable.Global */
630 .vg { color: #19177C } /* Name.Variable.Global */
631 .vi { color: #19177C } /* Name.Variable.Instance */
631 .vi { color: #19177C } /* Name.Variable.Instance */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
633 }
633 }
634
634
635 /* customized pre blocks for markdown/rst */
635 /* customized pre blocks for markdown/rst */
636 pre.literal-block, .codehilite pre{
636 pre.literal-block, .codehilite pre{
637 padding: @padding;
637 padding: @padding;
638 border: 1px solid @grey6;
638 border: 1px solid @grey6;
639 .border-radius(@border-radius);
639 .border-radius(@border-radius);
640 background-color: @grey7;
640 background-color: @grey7;
641 }
641 }
642
642
643
643
644 /* START NEW CODE BLOCK CSS */
644 /* START NEW CODE BLOCK CSS */
645
645
646 @cb-line-height: 18px;
646 @cb-line-height: 18px;
647 @cb-line-code-padding: 10px;
647 @cb-line-code-padding: 10px;
648 @cb-text-padding: 5px;
648 @cb-text-padding: 5px;
649
649
650 @pill-padding: 2px 7px;
650 @pill-padding: 2px 7px;
651 @pill-padding-small: 2px 2px 1px 2px;
651 @pill-padding-small: 2px 2px 1px 2px;
652
652
653 input.filediff-collapse-state {
653 input.filediff-collapse-state {
654 display: none;
654 display: none;
655
655
656 &:checked + .filediff { /* file diff is collapsed */
656 &:checked + .filediff { /* file diff is collapsed */
657 .cb {
657 .cb {
658 display: none
658 display: none
659 }
659 }
660 .filediff-collapse-indicator {
660 .filediff-collapse-indicator {
661 width: 0;
661 width: 0;
662 height: 0;
662 height: 0;
663 border-style: solid;
663 border-style: solid;
664 border-width: 4.5px 0 4.5px 9.3px;
664 border-width: 4.5px 0 4.5px 9.3px;
665 border-color: transparent transparent transparent #aaa;
665 border-color: transparent transparent transparent #aaa;
666 margin: 6px 0px;
666 margin: 6px 0px;
667 }
667 }
668 .filediff-menu {
668 .filediff-menu {
669 display: none;
669 display: none;
670 }
670 }
671
671
672 }
672 }
673
673
674 &+ .filediff { /* file diff is expanded */
674 &+ .filediff { /* file diff is expanded */
675 .filediff-collapse-indicator {
675 .filediff-collapse-indicator {
676 width: 0;
676 width: 0;
677 height: 0;
677 height: 0;
678 border-style: solid;
678 border-style: solid;
679 border-width: 9.3px 4.5px 0 4.5px;
679 border-width: 9.3px 4.5px 0 4.5px;
680 border-color: #aaa transparent transparent transparent;
680 border-color: #aaa transparent transparent transparent;
681 margin: 6px 0px;
681 margin: 6px 0px;
682
682
683 }
683 }
684 .filediff-menu {
684 .filediff-menu {
685 display: block;
685 display: block;
686 }
686 }
687 margin: 10px 0;
687 margin: 10px 0;
688 &:nth-child(2) {
688 &:nth-child(2) {
689 margin: 0;
689 margin: 0;
690 }
690 }
691 }
691 }
692 }
692 }
693
693
694 .filediffs .anchor {
694 .filediffs .anchor {
695 display: block;
695 display: block;
696 height: 40px;
696 height: 40px;
697 margin-top: -40px;
697 margin-top: -40px;
698 visibility: hidden;
698 visibility: hidden;
699 }
699 }
700
700
701 .filediffs .anchor:nth-of-type(1) {
701 .filediffs .anchor:nth-of-type(1) {
702 display: block;
702 display: block;
703 height: 80px;
703 height: 80px;
704 margin-top: -80px;
704 margin-top: -80px;
705 visibility: hidden;
705 visibility: hidden;
706 }
706 }
707
707
708 .cs_files {
708 .cs_files {
709 clear: both;
709 clear: both;
710 }
710 }
711
711
712 #diff-file-sticky{
712 #diff-file-sticky{
713 will-change: min-height;
713 will-change: min-height;
714 }
714 }
715
715
716 .sidebar__inner{
716 .sidebar__inner{
717 transform: translate(0, 0); /* For browsers don't support translate3d. */
717 transform: translate(0, 0); /* For browsers don't support translate3d. */
718 transform: translate3d(0, 0, 0);
718 transform: translate3d(0, 0, 0);
719 will-change: position, transform;
719 will-change: position, transform;
720 height: 70px;
720 height: 70px;
721 z-index: 30;
721 z-index: 30;
722 background-color: #fff;
722 background-color: #fff;
723 padding: 5px 0px;
723 padding: 5px 0px;
724 }
724 }
725
725
726 .sidebar__bar {
726 .sidebar__bar {
727 padding: 5px 0px 0px 0px
727 padding: 5px 0px 0px 0px
728 }
728 }
729
729
730 .fpath-placeholder {
730 .fpath-placeholder {
731 clear: both;
731 clear: both;
732 visibility: hidden
732 visibility: hidden
733 }
733 }
734
734
735 .is-affixed {
735 .is-affixed {
736 .sidebar_inner_shadow {
736 .sidebar_inner_shadow {
737 position: fixed;
737 position: fixed;
738 top: 75px;
738 top: 75px;
739 right: -100%;
739 right: -100%;
740 left: -100%;
740 left: -100%;
741 z-index: 28;
741 z-index: 28;
742 display: block;
742 display: block;
743 height: 5px;
743 height: 5px;
744 content: "";
744 content: "";
745 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
745 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
746 border-top: 1px solid rgba(0, 0, 0, 0.15);
746 border-top: 1px solid rgba(0, 0, 0, 0.15);
747 }
747 }
748 .fpath-placeholder {
748 .fpath-placeholder {
749 visibility: visible !important;
749 visibility: visible !important;
750 }
750 }
751 }
751 }
752
752
753 .diffset-menu {
753 .diffset-menu {
754 margin-bottom: 20px;
754 margin-bottom: 20px;
755 }
755 }
756 .diffset {
756 .diffset {
757 margin: 20px auto;
757 margin: 20px auto;
758 .diffset-heading {
758 .diffset-heading {
759 border: 1px solid @grey5;
759 border: 1px solid @grey5;
760 margin-bottom: -1px;
760 margin-bottom: -1px;
761 // margin-top: 20px;
761 // margin-top: 20px;
762 h2 {
762 h2 {
763 margin: 0;
763 margin: 0;
764 line-height: 38px;
764 line-height: 38px;
765 padding-left: 10px;
765 padding-left: 10px;
766 }
766 }
767 .btn {
767 .btn {
768 margin: 0;
768 margin: 0;
769 }
769 }
770 background: @grey6;
770 background: @grey6;
771 display: block;
771 display: block;
772 padding: 5px;
772 padding: 5px;
773 }
773 }
774 .diffset-heading-warning {
774 .diffset-heading-warning {
775 background: @alert3-inner;
775 background: @alert3-inner;
776 border: 1px solid @alert3;
776 border: 1px solid @alert3;
777 }
777 }
778 &.diffset-comments-disabled {
778 &.diffset-comments-disabled {
779 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
779 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
780 display: none !important;
780 display: none !important;
781 }
781 }
782 }
782 }
783 }
783 }
784
784
785 .filelist {
785 .filelist {
786 .pill {
786 .pill {
787 display: block;
787 display: block;
788 float: left;
788 float: left;
789 padding: @pill-padding-small;
789 padding: @pill-padding-small;
790 }
790 }
791 }
791 }
792
792
793 .pill {
793 .pill {
794 display: block;
794 display: block;
795 float: left;
795 float: left;
796 padding: @pill-padding;
796 padding: @pill-padding;
797 }
797 }
798
798
799 .pill-group {
799 .pill-group {
800 .pill {
800 .pill {
801 opacity: .8;
801 opacity: .8;
802 margin-right: 3px;
802 margin-right: 3px;
803
803
804 &:first-child {
804 &:first-child {
805 border-radius: @border-radius 0 0 @border-radius;
805 border-radius: @border-radius 0 0 @border-radius;
806 }
806 }
807 &:last-child {
807 &:last-child {
808 border-radius: 0 @border-radius @border-radius 0;
808 border-radius: 0 @border-radius @border-radius 0;
809 }
809 }
810 &:only-child {
810 &:only-child {
811 border-radius: @border-radius;
811 border-radius: @border-radius;
812 margin-right: 0;
812 margin-right: 0;
813 }
813 }
814 }
814 }
815 }
815 }
816
816
817 /* Main comments*/
817 /* Main comments*/
818 #comments {
818 #comments {
819 .comment-selected {
819 .comment-selected {
820 border-left: 6px solid @comment-highlight-color;
820 border-left: 6px solid @comment-highlight-color;
821 padding-left: 3px;
821 padding-left: 3px;
822 margin-left: -9px;
822 margin-left: -9px;
823 }
823 }
824 }
824 }
825
825
826 .filediff {
826 .filediff {
827 border: 1px solid @grey5;
827 border: 1px solid @grey5;
828
828
829 /* START OVERRIDES */
829 /* START OVERRIDES */
830 .code-highlight {
830 .code-highlight {
831 border: none; // TODO: remove this border from the global
831 border: none; // TODO: remove this border from the global
832 // .code-highlight, it doesn't belong there
832 // .code-highlight, it doesn't belong there
833 }
833 }
834 label {
834 label {
835 margin: 0; // TODO: remove this margin definition from global label
835 margin: 0; // TODO: remove this margin definition from global label
836 // it doesn't belong there - if margin on labels
836 // it doesn't belong there - if margin on labels
837 // are needed for a form they should be defined
837 // are needed for a form they should be defined
838 // in the form's class
838 // in the form's class
839 }
839 }
840 /* END OVERRIDES */
840 /* END OVERRIDES */
841
841
842 * {
842 * {
843 box-sizing: border-box;
843 box-sizing: border-box;
844 }
844 }
845 .filediff-anchor {
845 .filediff-anchor {
846 visibility: hidden;
846 visibility: hidden;
847 }
847 }
848 &:hover {
848 &:hover {
849 .filediff-anchor {
849 .filediff-anchor {
850 visibility: visible;
850 visibility: visible;
851 }
851 }
852 }
852 }
853
853
854 .filediff-collapse-indicator {
854 .filediff-collapse-indicator {
855 border-style: solid;
855 border-style: solid;
856 float: left;
856 float: left;
857 margin: 4px 0px 0 0;
857 margin: 4px 0px 0 0;
858 cursor: pointer;
858 cursor: pointer;
859 }
859 }
860
860
861 .filediff-heading {
861 .filediff-heading {
862 background: @grey7;
862 background: @grey7;
863 cursor: pointer;
863 cursor: pointer;
864 display: block;
864 display: block;
865 padding: 5px 10px;
865 padding: 5px 10px;
866 }
866 }
867 .filediff-heading:after {
867 .filediff-heading:after {
868 content: "";
868 content: "";
869 display: table;
869 display: table;
870 clear: both;
870 clear: both;
871 }
871 }
872 .filediff-heading:hover {
872 .filediff-heading:hover {
873 background: #e1e9f4 !important;
873 background: #e1e9f4 !important;
874 }
874 }
875
875
876 .filediff-menu {
876 .filediff-menu {
877 float: right;
877 float: right;
878 text-align: right;
878 text-align: right;
879 padding: 5px 5px 5px 0px;
879 padding: 5px 5px 5px 0px;
880
880
881 &> a,
881 &> a,
882 &> span {
882 &> span {
883 padding: 1px;
883 padding: 1px;
884 }
884 }
885 }
885 }
886
886
887 .filediff-collapse-button, .filediff-expand-button {
887 .filediff-collapse-button, .filediff-expand-button {
888 cursor: pointer;
888 cursor: pointer;
889 }
889 }
890 .filediff-collapse-button {
890 .filediff-collapse-button {
891 display: inline;
891 display: inline;
892 }
892 }
893 .filediff-expand-button {
893 .filediff-expand-button {
894 display: none;
894 display: none;
895 }
895 }
896 .filediff-collapsed .filediff-collapse-button {
896 .filediff-collapsed .filediff-collapse-button {
897 display: none;
897 display: none;
898 }
898 }
899 .filediff-collapsed .filediff-expand-button {
899 .filediff-collapsed .filediff-expand-button {
900 display: inline;
900 display: inline;
901 }
901 }
902
902
903 /**** COMMENTS ****/
903 /**** COMMENTS ****/
904
904
905 .filediff-menu {
905 .filediff-menu {
906 .show-comment-button {
906 .show-comment-button {
907 display: none;
907 display: none;
908 }
908 }
909 }
909 }
910 &.hide-comments {
910 &.hide-comments {
911 .inline-comments {
911 .inline-comments {
912 display: none;
912 display: none;
913 }
913 }
914 .filediff-menu {
914 .filediff-menu {
915 .show-comment-button {
915 .show-comment-button {
916 display: inline;
916 display: inline;
917 }
917 }
918 .hide-comment-button {
918 .hide-comment-button {
919 display: none;
919 display: none;
920 }
920 }
921 }
921 }
922 }
922 }
923
923
924 .hide-line-comments {
924 .hide-line-comments {
925 .inline-comments {
925 .inline-comments {
926 display: none;
926 display: none;
927 }
927 }
928 }
928 }
929
929
930 /**** END COMMENTS ****/
930 /**** END COMMENTS ****/
931
931
932 }
932 }
933
933
934
934
935
935
936 .filediff, .filelist {
936 .filediff, .filelist {
937 .pill {
937 .pill {
938 &[op="name"] {
938 &[op="name"] {
939 background: none;
939 background: none;
940 opacity: 1;
940 opacity: 1;
941 color: white;
941 color: white;
942 }
942 }
943 &[op="limited"] {
943 &[op="limited"] {
944 background: @grey2;
944 background: @grey2;
945 color: white;
945 color: white;
946 }
946 }
947 &[op="binary"] {
947 &[op="binary"] {
948 background: @color7;
948 background: @color7;
949 color: white;
949 color: white;
950 }
950 }
951 &[op="modified"] {
951 &[op="modified"] {
952 background: @alert1;
952 background: @alert1;
953 color: white;
953 color: white;
954 }
954 }
955 &[op="renamed"] {
955 &[op="renamed"] {
956 background: @color4;
956 background: @color4;
957 color: white;
957 color: white;
958 }
958 }
959 &[op="copied"] {
959 &[op="copied"] {
960 background: @color4;
960 background: @color4;
961 color: white;
961 color: white;
962 }
962 }
963 &[op="mode"] {
963 &[op="mode"] {
964 background: @grey3;
964 background: @grey3;
965 color: white;
965 color: white;
966 }
966 }
967 &[op="symlink"] {
967 &[op="symlink"] {
968 background: @color8;
968 background: @color8;
969 color: white;
969 color: white;
970 }
970 }
971
971
972 &[op="added"] { /* added lines */
972 &[op="added"] { /* added lines */
973 background: @alert1;
973 background: @alert1;
974 color: white;
974 color: white;
975 }
975 }
976 &[op="deleted"] { /* deleted lines */
976 &[op="deleted"] { /* deleted lines */
977 background: @alert2;
977 background: @alert2;
978 color: white;
978 color: white;
979 }
979 }
980
980
981 &[op="created"] { /* created file */
981 &[op="created"] { /* created file */
982 background: @alert1;
982 background: @alert1;
983 color: white;
983 color: white;
984 }
984 }
985 &[op="removed"] { /* deleted file */
985 &[op="removed"] { /* deleted file */
986 background: @color5;
986 background: @color5;
987 color: white;
987 color: white;
988 }
988 }
989 }
989 }
990 }
990 }
991
991
992
992
993 .filediff-outdated {
993 .filediff-outdated {
994 padding: 8px 0;
994 padding: 8px 0;
995
995
996 .filediff-heading {
996 .filediff-heading {
997 opacity: .5;
997 opacity: .5;
998 }
998 }
999 }
999 }
1000
1000
1001 table.cb {
1001 table.cb {
1002 width: 100%;
1002 width: 100%;
1003 border-collapse: collapse;
1003 border-collapse: collapse;
1004
1004
1005 .cb-text {
1005 .cb-text {
1006 padding: @cb-text-padding;
1006 padding: @cb-text-padding;
1007 }
1007 }
1008 .cb-hunk {
1008 .cb-hunk {
1009 padding: @cb-text-padding;
1009 padding: @cb-text-padding;
1010 }
1010 }
1011 .cb-expand {
1011 .cb-expand {
1012 display: none;
1012 display: none;
1013 }
1013 }
1014 .cb-collapse {
1014 .cb-collapse {
1015 display: inline;
1015 display: inline;
1016 }
1016 }
1017 &.cb-collapsed {
1017 &.cb-collapsed {
1018 .cb-line {
1018 .cb-line {
1019 display: none;
1019 display: none;
1020 }
1020 }
1021 .cb-expand {
1021 .cb-expand {
1022 display: inline;
1022 display: inline;
1023 }
1023 }
1024 .cb-collapse {
1024 .cb-collapse {
1025 display: none;
1025 display: none;
1026 }
1026 }
1027 }
1027 }
1028
1028
1029 /* intentionally general selector since .cb-line-selected must override it
1029 /* intentionally general selector since .cb-line-selected must override it
1030 and they both use !important since the td itself may have a random color
1030 and they both use !important since the td itself may have a random color
1031 generated by annotation blocks. TLDR: if you change it, make sure
1031 generated by annotation blocks. TLDR: if you change it, make sure
1032 annotated block selection and line selection in file view still work */
1032 annotated block selection and line selection in file view still work */
1033 .cb-line-fresh .cb-content {
1033 .cb-line-fresh .cb-content {
1034 background: white !important;
1034 background: white !important;
1035 }
1035 }
1036 .cb-warning {
1036 .cb-warning {
1037 background: #fff4dd;
1037 background: #fff4dd;
1038 }
1038 }
1039
1039
1040 &.cb-diff-sideside {
1040 &.cb-diff-sideside {
1041 td {
1041 td {
1042 &.cb-content {
1042 &.cb-content {
1043 width: 50%;
1043 width: 50%;
1044 }
1044 }
1045 }
1045 }
1046 }
1046 }
1047
1047
1048 tr {
1048 tr {
1049 &.cb-annotate {
1049 &.cb-annotate {
1050 border-top: 1px solid #eee;
1050 border-top: 1px solid #eee;
1051 }
1051 }
1052
1052
1053 &.cb-comment-info {
1053 &.cb-comment-info {
1054 border-top: 1px solid #eee;
1054 border-top: 1px solid #eee;
1055 color: rgba(0, 0, 0, 0.3);
1055 color: rgba(0, 0, 0, 0.3);
1056 background: #edf2f9;
1056 background: #edf2f9;
1057
1057
1058 td {
1058 td {
1059
1059
1060 }
1060 }
1061 }
1061 }
1062
1062
1063 &.cb-hunk {
1063 &.cb-hunk {
1064 font-family: @font-family-monospace;
1064 font-family: @font-family-monospace;
1065 color: rgba(0, 0, 0, 0.3);
1065 color: rgba(0, 0, 0, 0.3);
1066
1066
1067 td {
1067 td {
1068 &:first-child {
1068 &:first-child {
1069 background: #edf2f9;
1069 background: #edf2f9;
1070 }
1070 }
1071 &:last-child {
1071 &:last-child {
1072 background: #f4f7fb;
1072 background: #f4f7fb;
1073 }
1073 }
1074 }
1074 }
1075 }
1075 }
1076 }
1076 }
1077
1077
1078
1078
1079 td {
1079 td {
1080 vertical-align: top;
1080 vertical-align: top;
1081 padding: 0;
1081 padding: 0;
1082
1082
1083 &.cb-content {
1083 &.cb-content {
1084 font-size: 12.35px;
1084 font-size: 12.35px;
1085
1085
1086 &.cb-line-selected .cb-code {
1086 &.cb-line-selected .cb-code {
1087 background: @comment-highlight-color !important;
1087 background: @comment-highlight-color !important;
1088 }
1088 }
1089
1089
1090 span.cb-code {
1090 span.cb-code {
1091 line-height: @cb-line-height;
1091 line-height: @cb-line-height;
1092 padding-left: @cb-line-code-padding;
1092 padding-left: @cb-line-code-padding;
1093 padding-right: @cb-line-code-padding;
1093 padding-right: @cb-line-code-padding;
1094 display: block;
1094 display: block;
1095 white-space: pre-wrap;
1095 white-space: pre-wrap;
1096 font-family: @font-family-monospace;
1096 font-family: @font-family-monospace;
1097 word-break: break-all;
1097 word-break: break-all;
1098 .nonl {
1098 .nonl {
1099 color: @color5;
1099 color: @color5;
1100 }
1100 }
1101 }
1101 }
1102
1102
1103 &> button.cb-comment-box-opener {
1103 &> button.cb-comment-box-opener {
1104
1104
1105 padding: 2px 2px 1px 3px;
1105 padding: 2px 2px 1px 3px;
1106 margin-left: -6px;
1106 margin-left: -6px;
1107 margin-top: -1px;
1107 margin-top: -1px;
1108
1108
1109 border-radius: @border-radius;
1109 border-radius: @border-radius;
1110 position: absolute;
1110 position: absolute;
1111 display: none;
1111 display: none;
1112 }
1112 }
1113 .cb-comment {
1113 .cb-comment {
1114 margin-top: 10px;
1114 margin-top: 10px;
1115 white-space: normal;
1115 white-space: normal;
1116 }
1116 }
1117 }
1117 }
1118 &:hover {
1118 &:hover {
1119 button.cb-comment-box-opener {
1119 button.cb-comment-box-opener {
1120 display: block;
1120 display: block;
1121 }
1121 }
1122 &+ td button.cb-comment-box-opener {
1122 &+ td button.cb-comment-box-opener {
1123 display: block
1123 display: block
1124 }
1124 }
1125 }
1125 }
1126
1126
1127 &.cb-data {
1127 &.cb-data {
1128 text-align: right;
1128 text-align: right;
1129 width: 30px;
1129 width: 30px;
1130 font-family: @font-family-monospace;
1130 font-family: @font-family-monospace;
1131
1131
1132 .icon-comment {
1132 .icon-comment {
1133 cursor: pointer;
1133 cursor: pointer;
1134 }
1134 }
1135 &.cb-line-selected {
1136 background: @comment-highlight-color !important;
1137 }
1135 &.cb-line-selected > div {
1138 &.cb-line-selected > div {
1136 display: block;
1139 display: block;
1137 background: @comment-highlight-color !important;
1140 background: @comment-highlight-color !important;
1138 line-height: @cb-line-height;
1141 line-height: @cb-line-height;
1139 color: rgba(0, 0, 0, 0.3);
1142 color: rgba(0, 0, 0, 0.3);
1140 }
1143 }
1141 }
1144 }
1142
1145
1143 &.cb-lineno {
1146 &.cb-lineno {
1144 padding: 0;
1147 padding: 0;
1145 width: 50px;
1148 width: 50px;
1146 color: rgba(0, 0, 0, 0.3);
1149 color: rgba(0, 0, 0, 0.3);
1147 text-align: right;
1150 text-align: right;
1148 border-right: 1px solid #eee;
1151 border-right: 1px solid #eee;
1149 font-family: @font-family-monospace;
1152 font-family: @font-family-monospace;
1150 -webkit-user-select: none;
1153 -webkit-user-select: none;
1151 -moz-user-select: none;
1154 -moz-user-select: none;
1152 user-select: none;
1155 user-select: none;
1153
1156
1154 a::before {
1157 a::before {
1155 content: attr(data-line-no);
1158 content: attr(data-line-no);
1156 }
1159 }
1157 &.cb-line-selected a {
1160 &.cb-line-selected {
1158 background: @comment-highlight-color !important;
1161 background: @comment-highlight-color !important;
1159 }
1162 }
1160
1163
1161 a {
1164 a {
1162 display: block;
1165 display: block;
1163 padding-right: @cb-line-code-padding;
1166 padding-right: @cb-line-code-padding;
1164 padding-left: @cb-line-code-padding;
1167 padding-left: @cb-line-code-padding;
1165 line-height: @cb-line-height;
1168 line-height: @cb-line-height;
1166 color: rgba(0, 0, 0, 0.3);
1169 color: rgba(0, 0, 0, 0.3);
1167 }
1170 }
1168 }
1171 }
1169
1172
1170 &.cb-empty {
1173 &.cb-empty {
1171 background: @grey7;
1174 background: @grey7;
1172 }
1175 }
1173
1176
1174 ins {
1177 ins {
1175 color: black;
1178 color: black;
1176 background: #a6f3a6;
1179 background: #a6f3a6;
1177 text-decoration: none;
1180 text-decoration: none;
1178 }
1181 }
1179 del {
1182 del {
1180 color: black;
1183 color: black;
1181 background: #f8cbcb;
1184 background: #f8cbcb;
1182 text-decoration: none;
1185 text-decoration: none;
1183 }
1186 }
1184 &.cb-addition {
1187 &.cb-addition {
1185 background: #ecffec;
1188 background: #ecffec;
1186
1189
1187 &.blob-lineno {
1190 &.blob-lineno {
1188 background: #ddffdd;
1191 background: #ddffdd;
1189 }
1192 }
1190 }
1193 }
1191 &.cb-deletion {
1194 &.cb-deletion {
1192 background: #ffecec;
1195 background: #ffecec;
1193
1196
1194 &.blob-lineno {
1197 &.blob-lineno {
1195 background: #ffdddd;
1198 background: #ffdddd;
1196 }
1199 }
1197 }
1200 }
1198 &.cb-annotate-message-spacer {
1201 &.cb-annotate-message-spacer {
1199 width:8px;
1202 width:8px;
1200 padding: 1px 0px 0px 3px;
1203 padding: 1px 0px 0px 3px;
1201 }
1204 }
1202 &.cb-annotate-info {
1205 &.cb-annotate-info {
1203 width: 320px;
1206 width: 320px;
1204 min-width: 320px;
1207 min-width: 320px;
1205 max-width: 320px;
1208 max-width: 320px;
1206 padding: 5px 2px;
1209 padding: 5px 2px;
1207 font-size: 13px;
1210 font-size: 13px;
1208
1211
1209 .cb-annotate-message {
1212 .cb-annotate-message {
1210 padding: 2px 0px 0px 0px;
1213 padding: 2px 0px 0px 0px;
1211 white-space: pre-line;
1214 white-space: pre-line;
1212 overflow: hidden;
1215 overflow: hidden;
1213 }
1216 }
1214 .rc-user {
1217 .rc-user {
1215 float: none;
1218 float: none;
1216 padding: 0 6px 0 17px;
1219 padding: 0 6px 0 17px;
1217 min-width: unset;
1220 min-width: unset;
1218 min-height: unset;
1221 min-height: unset;
1219 }
1222 }
1220 }
1223 }
1221
1224
1222 &.cb-annotate-revision {
1225 &.cb-annotate-revision {
1223 cursor: pointer;
1226 cursor: pointer;
1224 text-align: right;
1227 text-align: right;
1225 padding: 1px 3px 0px 3px;
1228 padding: 1px 3px 0px 3px;
1226 }
1229 }
1227 }
1230 }
1228 }
1231 }
@@ -1,572 +1,578 b''
1 // # Copyright (C) 2010-2018 RhodeCode GmbH
1 // # Copyright (C) 2010-2018 RhodeCode GmbH
2 // #
2 // #
3 // # This program is free software: you can redistribute it and/or modify
3 // # This program is free software: you can redistribute it and/or modify
4 // # it under the terms of the GNU Affero General Public License, version 3
4 // # it under the terms of the GNU Affero General Public License, version 3
5 // # (only), as published by the Free Software Foundation.
5 // # (only), as published by the Free Software Foundation.
6 // #
6 // #
7 // # This program is distributed in the hope that it will be useful,
7 // # This program is distributed in the hope that it will be useful,
8 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
8 // # but WITHOUT ANY WARRANTY; without even the implied warranty of
9 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
9 // # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
10 // # GNU General Public License for more details.
10 // # GNU General Public License for more details.
11 // #
11 // #
12 // # You should have received a copy of the GNU Affero General Public License
12 // # You should have received a copy of the GNU Affero General Public License
13 // # along with this program. If not, see <http://www.gnu.org/licenses/>.
13 // # along with this program. If not, see <http://www.gnu.org/licenses/>.
14 // #
14 // #
15 // # This program is dual-licensed. If you wish to learn more about the
15 // # This program is dual-licensed. If you wish to learn more about the
16 // # RhodeCode Enterprise Edition, including its added features, Support services,
16 // # RhodeCode Enterprise Edition, including its added features, Support services,
17 // # and proprietary license terms, please see https://rhodecode.com/licenses/
17 // # and proprietary license terms, please see https://rhodecode.com/licenses/
18
18
19 /**
19 /**
20 RhodeCode JS Files
20 RhodeCode JS Files
21 **/
21 **/
22
22
23 if (typeof console == "undefined" || typeof console.log == "undefined"){
23 if (typeof console == "undefined" || typeof console.log == "undefined"){
24 console = { log: function() {} }
24 console = { log: function() {} }
25 }
25 }
26
26
27 // TODO: move the following function to submodules
27 // TODO: move the following function to submodules
28
28
29 /**
29 /**
30 * show more
30 * show more
31 */
31 */
32 var show_more_event = function(){
32 var show_more_event = function(){
33 $('table .show_more').click(function(e) {
33 $('table .show_more').click(function(e) {
34 var cid = e.target.id.substring(1);
34 var cid = e.target.id.substring(1);
35 var button = $(this);
35 var button = $(this);
36 if (button.hasClass('open')) {
36 if (button.hasClass('open')) {
37 $('#'+cid).hide();
37 $('#'+cid).hide();
38 button.removeClass('open');
38 button.removeClass('open');
39 } else {
39 } else {
40 $('#'+cid).show();
40 $('#'+cid).show();
41 button.addClass('open one');
41 button.addClass('open one');
42 }
42 }
43 });
43 });
44 };
44 };
45
45
46 var compare_radio_buttons = function(repo_name, compare_ref_type){
46 var compare_radio_buttons = function(repo_name, compare_ref_type){
47 $('#compare_action').on('click', function(e){
47 $('#compare_action').on('click', function(e){
48 e.preventDefault();
48 e.preventDefault();
49
49
50 var source = $('input[name=compare_source]:checked').val();
50 var source = $('input[name=compare_source]:checked').val();
51 var target = $('input[name=compare_target]:checked').val();
51 var target = $('input[name=compare_target]:checked').val();
52 if(source && target){
52 if(source && target){
53 var url_data = {
53 var url_data = {
54 repo_name: repo_name,
54 repo_name: repo_name,
55 source_ref: source,
55 source_ref: source,
56 source_ref_type: compare_ref_type,
56 source_ref_type: compare_ref_type,
57 target_ref: target,
57 target_ref: target,
58 target_ref_type: compare_ref_type,
58 target_ref_type: compare_ref_type,
59 merge: 1
59 merge: 1
60 };
60 };
61 window.location = pyroutes.url('repo_compare', url_data);
61 window.location = pyroutes.url('repo_compare', url_data);
62 }
62 }
63 });
63 });
64 $('.compare-radio-button').on('click', function(e){
64 $('.compare-radio-button').on('click', function(e){
65 var source = $('input[name=compare_source]:checked').val();
65 var source = $('input[name=compare_source]:checked').val();
66 var target = $('input[name=compare_target]:checked').val();
66 var target = $('input[name=compare_target]:checked').val();
67 if(source && target){
67 if(source && target){
68 $('#compare_action').removeAttr("disabled");
68 $('#compare_action').removeAttr("disabled");
69 $('#compare_action').removeClass("disabled");
69 $('#compare_action').removeClass("disabled");
70 }
70 }
71 })
71 })
72 };
72 };
73
73
74 var showRepoSize = function(target, repo_name, commit_id, callback) {
74 var showRepoSize = function(target, repo_name, commit_id, callback) {
75 var container = $('#' + target);
75 var container = $('#' + target);
76 var url = pyroutes.url('repo_stats',
76 var url = pyroutes.url('repo_stats',
77 {"repo_name": repo_name, "commit_id": commit_id});
77 {"repo_name": repo_name, "commit_id": commit_id});
78
78
79 if (!container.hasClass('loaded')) {
79 if (!container.hasClass('loaded')) {
80 $.ajax({url: url})
80 $.ajax({url: url})
81 .complete(function (data) {
81 .complete(function (data) {
82 var responseJSON = data.responseJSON;
82 var responseJSON = data.responseJSON;
83 container.addClass('loaded');
83 container.addClass('loaded');
84 container.html(responseJSON.size);
84 container.html(responseJSON.size);
85 callback(responseJSON.code_stats)
85 callback(responseJSON.code_stats)
86 })
86 })
87 .fail(function (data) {
87 .fail(function (data) {
88 console.log('failed to load repo stats');
88 console.log('failed to load repo stats');
89 });
89 });
90 }
90 }
91
91
92 };
92 };
93
93
94 var showRepoStats = function(target, data){
94 var showRepoStats = function(target, data){
95 var container = $('#' + target);
95 var container = $('#' + target);
96
96
97 if (container.hasClass('loaded')) {
97 if (container.hasClass('loaded')) {
98 return
98 return
99 }
99 }
100
100
101 var total = 0;
101 var total = 0;
102 var no_data = true;
102 var no_data = true;
103 var tbl = document.createElement('table');
103 var tbl = document.createElement('table');
104 tbl.setAttribute('class', 'trending_language_tbl');
104 tbl.setAttribute('class', 'trending_language_tbl');
105
105
106 $.each(data, function(key, val){
106 $.each(data, function(key, val){
107 total += val.count;
107 total += val.count;
108 });
108 });
109
109
110 var sortedStats = [];
110 var sortedStats = [];
111 for (var obj in data){
111 for (var obj in data){
112 sortedStats.push([obj, data[obj]])
112 sortedStats.push([obj, data[obj]])
113 }
113 }
114 var sortedData = sortedStats.sort(function (a, b) {
114 var sortedData = sortedStats.sort(function (a, b) {
115 return b[1].count - a[1].count
115 return b[1].count - a[1].count
116 });
116 });
117 var cnt = 0;
117 var cnt = 0;
118 $.each(sortedData, function(idx, val){
118 $.each(sortedData, function(idx, val){
119 cnt += 1;
119 cnt += 1;
120 no_data = false;
120 no_data = false;
121
121
122 var hide = cnt > 2;
122 var hide = cnt > 2;
123 var tr = document.createElement('tr');
123 var tr = document.createElement('tr');
124 if (hide) {
124 if (hide) {
125 tr.setAttribute('style', 'display:none');
125 tr.setAttribute('style', 'display:none');
126 tr.setAttribute('class', 'stats_hidden');
126 tr.setAttribute('class', 'stats_hidden');
127 }
127 }
128
128
129 var key = val[0];
129 var key = val[0];
130 var obj = {"desc": val[1].desc, "count": val[1].count};
130 var obj = {"desc": val[1].desc, "count": val[1].count};
131
131
132 var percentage = Math.round((obj.count / total * 100), 2);
132 var percentage = Math.round((obj.count / total * 100), 2);
133
133
134 var td1 = document.createElement('td');
134 var td1 = document.createElement('td');
135 td1.width = 300;
135 td1.width = 300;
136 var trending_language_label = document.createElement('div');
136 var trending_language_label = document.createElement('div');
137 trending_language_label.innerHTML = obj.desc + " (.{0})".format(key);
137 trending_language_label.innerHTML = obj.desc + " (.{0})".format(key);
138 td1.appendChild(trending_language_label);
138 td1.appendChild(trending_language_label);
139
139
140 var td2 = document.createElement('td');
140 var td2 = document.createElement('td');
141 var trending_language = document.createElement('div');
141 var trending_language = document.createElement('div');
142 var nr_files = obj.count +" "+ _ngettext('file', 'files', obj.count);
142 var nr_files = obj.count +" "+ _ngettext('file', 'files', obj.count);
143
143
144 trending_language.title = key + " " + nr_files;
144 trending_language.title = key + " " + nr_files;
145
145
146 trending_language.innerHTML = "<span>" + percentage + "% " + nr_files
146 trending_language.innerHTML = "<span>" + percentage + "% " + nr_files
147 + "</span><b>" + percentage + "% " + nr_files + "</b>";
147 + "</span><b>" + percentage + "% " + nr_files + "</b>";
148
148
149 trending_language.setAttribute("class", 'trending_language');
149 trending_language.setAttribute("class", 'trending_language');
150 $('b', trending_language)[0].style.width = percentage + "%";
150 $('b', trending_language)[0].style.width = percentage + "%";
151 td2.appendChild(trending_language);
151 td2.appendChild(trending_language);
152
152
153 tr.appendChild(td1);
153 tr.appendChild(td1);
154 tr.appendChild(td2);
154 tr.appendChild(td2);
155 tbl.appendChild(tr);
155 tbl.appendChild(tr);
156 if (cnt == 3) {
156 if (cnt == 3) {
157 var show_more = document.createElement('tr');
157 var show_more = document.createElement('tr');
158 var td = document.createElement('td');
158 var td = document.createElement('td');
159 lnk = document.createElement('a');
159 lnk = document.createElement('a');
160
160
161 lnk.href = '#';
161 lnk.href = '#';
162 lnk.innerHTML = _gettext('Show more');
162 lnk.innerHTML = _gettext('Show more');
163 lnk.id = 'code_stats_show_more';
163 lnk.id = 'code_stats_show_more';
164 td.appendChild(lnk);
164 td.appendChild(lnk);
165
165
166 show_more.appendChild(td);
166 show_more.appendChild(td);
167 show_more.appendChild(document.createElement('td'));
167 show_more.appendChild(document.createElement('td'));
168 tbl.appendChild(show_more);
168 tbl.appendChild(show_more);
169 }
169 }
170 });
170 });
171
171
172 $(container).html(tbl);
172 $(container).html(tbl);
173 $(container).addClass('loaded');
173 $(container).addClass('loaded');
174
174
175 $('#code_stats_show_more').on('click', function (e) {
175 $('#code_stats_show_more').on('click', function (e) {
176 e.preventDefault();
176 e.preventDefault();
177 $('.stats_hidden').each(function (idx) {
177 $('.stats_hidden').each(function (idx) {
178 $(this).css("display", "");
178 $(this).css("display", "");
179 });
179 });
180 $('#code_stats_show_more').hide();
180 $('#code_stats_show_more').hide();
181 });
181 });
182
182
183 };
183 };
184
184
185 // returns a node from given html;
185 // returns a node from given html;
186 var fromHTML = function(html){
186 var fromHTML = function(html){
187 var _html = document.createElement('element');
187 var _html = document.createElement('element');
188 _html.innerHTML = html;
188 _html.innerHTML = html;
189 return _html;
189 return _html;
190 };
190 };
191
191
192 // Toggle Collapsable Content
192 // Toggle Collapsable Content
193 function collapsableContent() {
193 function collapsableContent() {
194
194
195 $('.collapsable-content').not('.no-hide').hide();
195 $('.collapsable-content').not('.no-hide').hide();
196
196
197 $('.btn-collapse').unbind(); //in case we've been here before
197 $('.btn-collapse').unbind(); //in case we've been here before
198 $('.btn-collapse').click(function() {
198 $('.btn-collapse').click(function() {
199 var button = $(this);
199 var button = $(this);
200 var togglename = $(this).data("toggle");
200 var togglename = $(this).data("toggle");
201 $('.collapsable-content[data-toggle='+togglename+']').toggle();
201 $('.collapsable-content[data-toggle='+togglename+']').toggle();
202 if ($(this).html()=="Show Less")
202 if ($(this).html()=="Show Less")
203 $(this).html("Show More");
203 $(this).html("Show More");
204 else
204 else
205 $(this).html("Show Less");
205 $(this).html("Show Less");
206 });
206 });
207 };
207 };
208
208
209 var timeagoActivate = function() {
209 var timeagoActivate = function() {
210 $("time.timeago").timeago();
210 $("time.timeago").timeago();
211 };
211 };
212
212
213
213
214 var clipboardActivate = function() {
214 var clipboardActivate = function() {
215 /*
215 /*
216 *
216 *
217 * <i class="tooltip icon-plus clipboard-action" data-clipboard-text="${commit.raw_id}" title="${_('Copy the full commit id')}"></i>
217 * <i class="tooltip icon-plus clipboard-action" data-clipboard-text="${commit.raw_id}" title="${_('Copy the full commit id')}"></i>
218 * */
218 * */
219 var clipboard = new ClipboardJS('.clipboard-action');
219 var clipboard = new ClipboardJS('.clipboard-action');
220
220
221 clipboard.on('success', function(e) {
221 clipboard.on('success', function(e) {
222 var callback = function () {
222 var callback = function () {
223 $(e.trigger).animate({'opacity': 1.00}, 200)
223 $(e.trigger).animate({'opacity': 1.00}, 200)
224 };
224 };
225 $(e.trigger).animate({'opacity': 0.15}, 200, callback);
225 $(e.trigger).animate({'opacity': 0.15}, 200, callback);
226 e.clearSelection();
226 e.clearSelection();
227 });
227 });
228 };
228 };
229
229
230
230
231 // Formatting values in a Select2 dropdown of commit references
231 // Formatting values in a Select2 dropdown of commit references
232 var formatSelect2SelectionRefs = function(commit_ref){
232 var formatSelect2SelectionRefs = function(commit_ref){
233 var tmpl = '';
233 var tmpl = '';
234 if (!commit_ref.text || commit_ref.type === 'sha'){
234 if (!commit_ref.text || commit_ref.type === 'sha'){
235 return commit_ref.text;
235 return commit_ref.text;
236 }
236 }
237 if (commit_ref.type === 'branch'){
237 if (commit_ref.type === 'branch'){
238 tmpl = tmpl.concat('<i class="icon-branch"></i> ');
238 tmpl = tmpl.concat('<i class="icon-branch"></i> ');
239 } else if (commit_ref.type === 'tag'){
239 } else if (commit_ref.type === 'tag'){
240 tmpl = tmpl.concat('<i class="icon-tag"></i> ');
240 tmpl = tmpl.concat('<i class="icon-tag"></i> ');
241 } else if (commit_ref.type === 'book'){
241 } else if (commit_ref.type === 'book'){
242 tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
242 tmpl = tmpl.concat('<i class="icon-bookmark"></i> ');
243 }
243 }
244 return tmpl.concat(escapeHtml(commit_ref.text));
244 return tmpl.concat(escapeHtml(commit_ref.text));
245 };
245 };
246
246
247 // takes a given html element and scrolls it down offset pixels
247 // takes a given html element and scrolls it down offset pixels
248 function offsetScroll(element, offset) {
248 function offsetScroll(element, offset) {
249 setTimeout(function() {
249 setTimeout(function() {
250 var location = element.offset().top;
250 var location = element.offset().top;
251 // some browsers use body, some use html
251 // some browsers use body, some use html
252 $('html, body').animate({ scrollTop: (location - offset) });
252 $('html, body').animate({ scrollTop: (location - offset) });
253 }, 100);
253 }, 100);
254 }
254 }
255
255
256 // scroll an element `percent`% from the top of page in `time` ms
256 // scroll an element `percent`% from the top of page in `time` ms
257 function scrollToElement(element, percent, time) {
257 function scrollToElement(element, percent, time) {
258 percent = (percent === undefined ? 25 : percent);
258 percent = (percent === undefined ? 25 : percent);
259 time = (time === undefined ? 100 : time);
259 time = (time === undefined ? 100 : time);
260
260
261 var $element = $(element);
261 var $element = $(element);
262 if ($element.length == 0) {
262 if ($element.length == 0) {
263 throw('Cannot scroll to {0}'.format(element))
263 throw('Cannot scroll to {0}'.format(element))
264 }
264 }
265 var elOffset = $element.offset().top;
265 var elOffset = $element.offset().top;
266 var elHeight = $element.height();
266 var elHeight = $element.height();
267 var windowHeight = $(window).height();
267 var windowHeight = $(window).height();
268 var offset = elOffset;
268 var offset = elOffset;
269 if (elHeight < windowHeight) {
269 if (elHeight < windowHeight) {
270 offset = elOffset - ((windowHeight / (100 / percent)) - (elHeight / 2));
270 offset = elOffset - ((windowHeight / (100 / percent)) - (elHeight / 2));
271 }
271 }
272 setTimeout(function() {
272 setTimeout(function() {
273 $('html, body').animate({ scrollTop: offset});
273 $('html, body').animate({ scrollTop: offset});
274 }, time);
274 }, time);
275 }
275 }
276
276
277 /**
277 /**
278 * global hooks after DOM is loaded
278 * global hooks after DOM is loaded
279 */
279 */
280 $(document).ready(function() {
280 $(document).ready(function() {
281 firefoxAnchorFix();
281 firefoxAnchorFix();
282
282
283 $('.navigation a.menulink').on('click', function(e){
283 $('.navigation a.menulink').on('click', function(e){
284 var menuitem = $(this).parent('li');
284 var menuitem = $(this).parent('li');
285 if (menuitem.hasClass('open')) {
285 if (menuitem.hasClass('open')) {
286 menuitem.removeClass('open');
286 menuitem.removeClass('open');
287 } else {
287 } else {
288 menuitem.addClass('open');
288 menuitem.addClass('open');
289 $(document).on('click', function(event) {
289 $(document).on('click', function(event) {
290 if (!$(event.target).closest(menuitem).length) {
290 if (!$(event.target).closest(menuitem).length) {
291 menuitem.removeClass('open');
291 menuitem.removeClass('open');
292 }
292 }
293 });
293 });
294 }
294 }
295 });
295 });
296
296
297 $('body').on('click', '.cb-lineno a', function(event) {
297 $('body').on('click', '.cb-lineno a', function(event) {
298 function sortNumber(a,b) {
299 return a - b;
300 }
298
301
299 function sortNumber(a,b) {
302 var lineNo = $(this).data('lineNo');
300 return a - b;
303 var lineName = $(this).attr('name');
304
305 if (lineNo) {
306 var prevLine = $('.cb-line-selected a').data('lineNo');
307
308 // on shift, we do a range selection, if we got previous line
309 if (event.shiftKey && prevLine !== undefined) {
310 var prevLine = parseInt(prevLine);
311 var nextLine = parseInt(lineNo);
312 var pos = [prevLine, nextLine].sort(sortNumber);
313 var anchor = '#L{0}-{1}'.format(pos[0], pos[1]);
314
315 // single click
316 } else {
317 var nextLine = parseInt(lineNo);
318 var pos = [nextLine, nextLine];
319 var anchor = '#L{0}'.format(pos[0]);
320
321 }
322 // highlight
323 var range = [];
324 for (var i = pos[0]; i <= pos[1]; i++) {
325 range.push(i);
326 }
327 // clear old selected lines
328 $('.cb-line-selected').removeClass('cb-line-selected');
329
330 $.each(range, function (i, lineNo) {
331 var line_td = $('td.cb-lineno#L' + lineNo);
332
333 if (line_td.length) {
334 line_td.addClass('cb-line-selected'); // line number td
335 line_td.prev().addClass('cb-line-selected'); // line data
336 line_td.next().addClass('cb-line-selected'); // line content
337 }
338 });
339
340 } else if (lineName !== undefined) { // lineName only occurs in diffs
341 // clear old selected lines
342 $('td.cb-line-selected').removeClass('cb-line-selected');
343 var anchor = '#{0}'.format(lineName);
344 var diffmode = templateContext.session_attrs.diffmode || "sideside";
345
346 if (diffmode === "unified") {
347 $(this).closest('tr').find('td').addClass('cb-line-selected');
348 } else {
349 var activeTd = $(this).closest('td');
350 activeTd.addClass('cb-line-selected');
351 activeTd.next('td').addClass('cb-line-selected');
301 }
352 }
302
353
303 var lineNo = $(this).data('lineNo');
354 }
304 if (lineNo) {
305
306 // on shift, we do a range selection, if we got previous line
307 var prevLine = $('.cb-line-selected a').data('lineNo');
308 if (event.shiftKey && prevLine !== undefined) {
309 var prevLine = parseInt(prevLine);
310 var nextLine = parseInt(lineNo);
311 var pos = [prevLine, nextLine].sort(sortNumber);
312 var anchor = '#L{0}-{1}'.format(pos[0], pos[1]);
313
314 } else {
315
316 var nextLine = parseInt(lineNo);
317 var pos = [nextLine, nextLine];
318 var anchor = '#L{0}'.format(pos[0]);
319
355
320 }
356 // Replace URL without jumping to it if browser supports.
321 // highlight
357 // Default otherwise
322 var range = [];
358 if (history.pushState && anchor !== undefined) {
323 for (var i = pos[0]; i <= pos[1]; i++) {
359 var new_location = location.href.rstrip('#');
324 range.push(i);
360 if (location.hash) {
325 }
361 // location without hash
326 // clear selection
362 new_location = new_location.replace(location.hash, "");
327 $('.cb-line-selected').removeClass('cb-line-selected');
328
329 $.each(range, function (i, lineNo) {
330 var line_td = $('td.cb-lineno#L' + lineNo);
331 if (line_td.length) {
332 line_td.addClass('cb-line-selected'); // line number td
333 line_td.prev().addClass('cb-line-selected'); // line data
334 line_td.next().addClass('cb-line-selected'); // line content
335 }
336 });
337
338
339 } else {
340 if ($(this).attr('name') !== undefined) {
341 // clear selection
342 $('td.cb-line-selected').removeClass('cb-line-selected');
343 var aEl = $(this).closest('td');
344 aEl.addClass('cb-line-selected');
345 aEl.next('td').addClass('cb-line-selected');
346 }
347 }
363 }
348
364
349 // Replace URL without jumping to it if browser supports.
365 // Make new anchor url
350 // Default otherwise
366 new_location = new_location + anchor;
351 if (history.pushState && anchor !== undefined) {
367 history.pushState(true, document.title, new_location);
352 var new_location = location.href.rstrip('#');
353 if (location.hash) {
354 // location without hash
355 new_location = new_location.replace(location.hash, "");
356 }
357
368
358 // Make new anchor url
369 return false;
359 new_location = new_location + anchor;
370 }
360 history.pushState(true, document.title, new_location);
361
371
362 return false;
372 });
363 }
364
365 });
366
367
373
368 $('.collapse_file').on('click', function(e) {
374 $('.collapse_file').on('click', function(e) {
369 e.stopPropagation();
375 e.stopPropagation();
370 if ($(e.target).is('a')) { return; }
376 if ($(e.target).is('a')) { return; }
371 var node = $(e.delegateTarget).first();
377 var node = $(e.delegateTarget).first();
372 var icon = $($(node.children().first()).children().first());
378 var icon = $($(node.children().first()).children().first());
373 var id = node.attr('fid');
379 var id = node.attr('fid');
374 var target = $('#'+id);
380 var target = $('#'+id);
375 var tr = $('#tr_'+id);
381 var tr = $('#tr_'+id);
376 var diff = $('#diff_'+id);
382 var diff = $('#diff_'+id);
377 if(node.hasClass('expand_file')){
383 if(node.hasClass('expand_file')){
378 node.removeClass('expand_file');
384 node.removeClass('expand_file');
379 icon.removeClass('expand_file_icon');
385 icon.removeClass('expand_file_icon');
380 node.addClass('collapse_file');
386 node.addClass('collapse_file');
381 icon.addClass('collapse_file_icon');
387 icon.addClass('collapse_file_icon');
382 diff.show();
388 diff.show();
383 tr.show();
389 tr.show();
384 target.show();
390 target.show();
385 } else {
391 } else {
386 node.removeClass('collapse_file');
392 node.removeClass('collapse_file');
387 icon.removeClass('collapse_file_icon');
393 icon.removeClass('collapse_file_icon');
388 node.addClass('expand_file');
394 node.addClass('expand_file');
389 icon.addClass('expand_file_icon');
395 icon.addClass('expand_file_icon');
390 diff.hide();
396 diff.hide();
391 tr.hide();
397 tr.hide();
392 target.hide();
398 target.hide();
393 }
399 }
394 });
400 });
395
401
396 $('#expand_all_files').click(function() {
402 $('#expand_all_files').click(function() {
397 $('.expand_file').each(function() {
403 $('.expand_file').each(function() {
398 var node = $(this);
404 var node = $(this);
399 var icon = $($(node.children().first()).children().first());
405 var icon = $($(node.children().first()).children().first());
400 var id = $(this).attr('fid');
406 var id = $(this).attr('fid');
401 var target = $('#'+id);
407 var target = $('#'+id);
402 var tr = $('#tr_'+id);
408 var tr = $('#tr_'+id);
403 var diff = $('#diff_'+id);
409 var diff = $('#diff_'+id);
404 node.removeClass('expand_file');
410 node.removeClass('expand_file');
405 icon.removeClass('expand_file_icon');
411 icon.removeClass('expand_file_icon');
406 node.addClass('collapse_file');
412 node.addClass('collapse_file');
407 icon.addClass('collapse_file_icon');
413 icon.addClass('collapse_file_icon');
408 diff.show();
414 diff.show();
409 tr.show();
415 tr.show();
410 target.show();
416 target.show();
411 });
417 });
412 });
418 });
413
419
414 $('#collapse_all_files').click(function() {
420 $('#collapse_all_files').click(function() {
415 $('.collapse_file').each(function() {
421 $('.collapse_file').each(function() {
416 var node = $(this);
422 var node = $(this);
417 var icon = $($(node.children().first()).children().first());
423 var icon = $($(node.children().first()).children().first());
418 var id = $(this).attr('fid');
424 var id = $(this).attr('fid');
419 var target = $('#'+id);
425 var target = $('#'+id);
420 var tr = $('#tr_'+id);
426 var tr = $('#tr_'+id);
421 var diff = $('#diff_'+id);
427 var diff = $('#diff_'+id);
422 node.removeClass('collapse_file');
428 node.removeClass('collapse_file');
423 icon.removeClass('collapse_file_icon');
429 icon.removeClass('collapse_file_icon');
424 node.addClass('expand_file');
430 node.addClass('expand_file');
425 icon.addClass('expand_file_icon');
431 icon.addClass('expand_file_icon');
426 diff.hide();
432 diff.hide();
427 tr.hide();
433 tr.hide();
428 target.hide();
434 target.hide();
429 });
435 });
430 });
436 });
431
437
432 // Mouse over behavior for comments and line selection
438 // Mouse over behavior for comments and line selection
433
439
434 // Select the line that comes from the url anchor
440 // Select the line that comes from the url anchor
435 // At the time of development, Chrome didn't seem to support jquery's :target
441 // At the time of development, Chrome didn't seem to support jquery's :target
436 // element, so I had to scroll manually
442 // element, so I had to scroll manually
437
443
438 if (location.hash) {
444 if (location.hash) {
439 var result = splitDelimitedHash(location.hash);
445 var result = splitDelimitedHash(location.hash);
440 var loc = result.loc;
446 var loc = result.loc;
441 if (loc.length > 1) {
447 if (loc.length > 1) {
442
448
443 var highlightable_line_tds = [];
449 var highlightable_line_tds = [];
444
450
445 // source code line format
451 // source code line format
446 var page_highlights = loc.substring(
452 var page_highlights = loc.substring(
447 loc.indexOf('#') + 1).split('L');
453 loc.indexOf('#') + 1).split('L');
448
454
449 if (page_highlights.length > 1) {
455 if (page_highlights.length > 1) {
450 var highlight_ranges = page_highlights[1].split(",");
456 var highlight_ranges = page_highlights[1].split(",");
451 var h_lines = [];
457 var h_lines = [];
452 for (var pos in highlight_ranges) {
458 for (var pos in highlight_ranges) {
453 var _range = highlight_ranges[pos].split('-');
459 var _range = highlight_ranges[pos].split('-');
454 if (_range.length === 2) {
460 if (_range.length === 2) {
455 var start = parseInt(_range[0]);
461 var start = parseInt(_range[0]);
456 var end = parseInt(_range[1]);
462 var end = parseInt(_range[1]);
457 if (start < end) {
463 if (start < end) {
458 for (var i = start; i <= end; i++) {
464 for (var i = start; i <= end; i++) {
459 h_lines.push(i);
465 h_lines.push(i);
460 }
466 }
461 }
467 }
462 }
468 }
463 else {
469 else {
464 h_lines.push(parseInt(highlight_ranges[pos]));
470 h_lines.push(parseInt(highlight_ranges[pos]));
465 }
471 }
466 }
472 }
467 for (pos in h_lines) {
473 for (pos in h_lines) {
468 var line_td = $('td.cb-lineno#L' + h_lines[pos]);
474 var line_td = $('td.cb-lineno#L' + h_lines[pos]);
469 if (line_td.length) {
475 if (line_td.length) {
470 highlightable_line_tds.push(line_td);
476 highlightable_line_tds.push(line_td);
471 }
477 }
472 }
478 }
473 }
479 }
474
480
475 // now check a direct id reference (diff page)
481 // now check a direct id reference (diff page)
476 if ($(loc).length && $(loc).hasClass('cb-lineno')) {
482 if ($(loc).length && $(loc).hasClass('cb-lineno')) {
477 highlightable_line_tds.push($(loc));
483 highlightable_line_tds.push($(loc));
478 }
484 }
479 $.each(highlightable_line_tds, function (i, $td) {
485 $.each(highlightable_line_tds, function (i, $td) {
480 $td.addClass('cb-line-selected'); // line number td
486 $td.addClass('cb-line-selected'); // line number td
481 $td.prev().addClass('cb-line-selected'); // line data
487 $td.prev().addClass('cb-line-selected'); // line data
482 $td.next().addClass('cb-line-selected'); // line content
488 $td.next().addClass('cb-line-selected'); // line content
483 });
489 });
484
490
485 if (highlightable_line_tds.length) {
491 if (highlightable_line_tds.length) {
486 var $first_line_td = highlightable_line_tds[0];
492 var $first_line_td = highlightable_line_tds[0];
487 scrollToElement($first_line_td);
493 scrollToElement($first_line_td);
488 $.Topic('/ui/plugins/code/anchor_focus').prepareOrPublish({
494 $.Topic('/ui/plugins/code/anchor_focus').prepareOrPublish({
489 td: $first_line_td,
495 td: $first_line_td,
490 remainder: result.remainder
496 remainder: result.remainder
491 });
497 });
492 }
498 }
493 }
499 }
494 }
500 }
495 collapsableContent();
501 collapsableContent();
496 });
502 });
497
503
498 var feedLifetimeOptions = function(query, initialData){
504 var feedLifetimeOptions = function(query, initialData){
499 var data = {results: []};
505 var data = {results: []};
500 var isQuery = typeof query.term !== 'undefined';
506 var isQuery = typeof query.term !== 'undefined';
501
507
502 var section = _gettext('Lifetime');
508 var section = _gettext('Lifetime');
503 var children = [];
509 var children = [];
504
510
505 //filter results
511 //filter results
506 $.each(initialData.results, function(idx, value) {
512 $.each(initialData.results, function(idx, value) {
507
513
508 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
514 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
509 children.push({
515 children.push({
510 'id': this.id,
516 'id': this.id,
511 'text': this.text
517 'text': this.text
512 })
518 })
513 }
519 }
514
520
515 });
521 });
516 data.results.push({
522 data.results.push({
517 'text': section,
523 'text': section,
518 'children': children
524 'children': children
519 });
525 });
520
526
521 if (isQuery) {
527 if (isQuery) {
522
528
523 var now = moment.utc();
529 var now = moment.utc();
524
530
525 var parseQuery = function(entry, now){
531 var parseQuery = function(entry, now){
526 var fmt = 'DD/MM/YYYY H:mm';
532 var fmt = 'DD/MM/YYYY H:mm';
527 var parsed = moment.utc(entry, fmt);
533 var parsed = moment.utc(entry, fmt);
528 var diffInMin = parsed.diff(now, 'minutes');
534 var diffInMin = parsed.diff(now, 'minutes');
529
535
530 if (diffInMin > 0){
536 if (diffInMin > 0){
531 return {
537 return {
532 id: diffInMin,
538 id: diffInMin,
533 text: parsed.format(fmt)
539 text: parsed.format(fmt)
534 }
540 }
535 } else {
541 } else {
536 return {
542 return {
537 id: undefined,
543 id: undefined,
538 text: parsed.format('DD/MM/YYYY') + ' ' + _gettext('date not in future')
544 text: parsed.format('DD/MM/YYYY') + ' ' + _gettext('date not in future')
539 }
545 }
540 }
546 }
541
547
542
548
543 };
549 };
544
550
545 data.results.push({
551 data.results.push({
546 'text': _gettext('Specified expiration date'),
552 'text': _gettext('Specified expiration date'),
547 'children': [{
553 'children': [{
548 'id': parseQuery(query.term, now).id,
554 'id': parseQuery(query.term, now).id,
549 'text': parseQuery(query.term, now).text
555 'text': parseQuery(query.term, now).text
550 }]
556 }]
551 });
557 });
552 }
558 }
553
559
554 query.callback(data);
560 query.callback(data);
555 };
561 };
556
562
557
563
558 var storeUserSessionAttr = function (key, val) {
564 var storeUserSessionAttr = function (key, val) {
559
565
560 var postData = {
566 var postData = {
561 'key': key,
567 'key': key,
562 'val': val,
568 'val': val,
563 'csrf_token': CSRF_TOKEN
569 'csrf_token': CSRF_TOKEN
564 };
570 };
565
571
566 var success = function(o) {
572 var success = function(o) {
567 return true
573 return true
568 };
574 };
569
575
570 ajaxPOST(pyroutes.url('store_user_session_value'), postData, success);
576 ajaxPOST(pyroutes.url('store_user_session_value'), postData, success);
571 return false;
577 return false;
572 };
578 };
General Comments 0
You need to be logged in to leave comments. Login now