##// END OF EJS Templates
diffs/files: fix and improve line selections and anchor links.
marcink -
r2642:b8db5763 default
parent child Browse files
Show More
@@ -1,1150 +1,1141 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 .compare_view_files {
22
23 .diff-container {
24
25 .diffblock {
26 margin-bottom: 0;
27 }
28 }
29 }
30
21
31 div.diffblock .sidebyside {
22 div.diffblock .sidebyside {
32 background: #ffffff;
23 background: #ffffff;
33 }
24 }
34
25
35 div.diffblock {
26 div.diffblock {
36 overflow-x: auto;
27 overflow-x: auto;
37 overflow-y: hidden;
28 overflow-y: hidden;
38 clear: both;
29 clear: both;
39 padding: 0px;
30 padding: 0px;
40 background: @grey6;
31 background: @grey6;
41 border: @border-thickness solid @grey5;
32 border: @border-thickness solid @grey5;
42 -webkit-border-radius: @border-radius @border-radius 0px 0px;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
43 border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
44
35
45
36
46 .comments-number {
37 .comments-number {
47 float: right;
38 float: right;
48 }
39 }
49
40
50 // BEGIN CODE-HEADER STYLES
41 // BEGIN CODE-HEADER STYLES
51
42
52 .code-header {
43 .code-header {
53 background: @grey6;
44 background: @grey6;
54 padding: 10px 0 10px 0;
45 padding: 10px 0 10px 0;
55 height: auto;
46 height: auto;
56 width: 100%;
47 width: 100%;
57
48
58 .hash {
49 .hash {
59 float: left;
50 float: left;
60 padding: 2px 0 0 2px;
51 padding: 2px 0 0 2px;
61 }
52 }
62
53
63 .date {
54 .date {
64 float: left;
55 float: left;
65 text-transform: uppercase;
56 text-transform: uppercase;
66 padding: 4px 0px 0px 2px;
57 padding: 4px 0px 0px 2px;
67 }
58 }
68
59
69 div {
60 div {
70 margin-left: 4px;
61 margin-left: 4px;
71 }
62 }
72
63
73 div.compare_header {
64 div.compare_header {
74 min-height: 40px;
65 min-height: 40px;
75 margin: 0;
66 margin: 0;
76 padding: 0 @padding;
67 padding: 0 @padding;
77
68
78 .drop-menu {
69 .drop-menu {
79 float:left;
70 float:left;
80 display: block;
71 display: block;
81 margin:0 0 @padding 0;
72 margin:0 0 @padding 0;
82 }
73 }
83
74
84 .compare-label {
75 .compare-label {
85 float: left;
76 float: left;
86 clear: both;
77 clear: both;
87 display: inline-block;
78 display: inline-block;
88 min-width: 5em;
79 min-width: 5em;
89 margin: 0;
80 margin: 0;
90 padding: @button-padding @button-padding @button-padding 0;
81 padding: @button-padding @button-padding @button-padding 0;
91 font-family: @text-semibold;
82 font-family: @text-semibold;
92 }
83 }
93
84
94 .compare-buttons {
85 .compare-buttons {
95 float: left;
86 float: left;
96 margin: 0;
87 margin: 0;
97 padding: 0 0 @padding;
88 padding: 0 0 @padding;
98
89
99 .btn {
90 .btn {
100 margin: 0 @padding 0 0;
91 margin: 0 @padding 0 0;
101 }
92 }
102 }
93 }
103 }
94 }
104
95
105 }
96 }
106
97
107 .parents {
98 .parents {
108 float: left;
99 float: left;
109 width: 100px;
100 width: 100px;
110 font-weight: 400;
101 font-weight: 400;
111 vertical-align: middle;
102 vertical-align: middle;
112 padding: 0px 2px 0px 2px;
103 padding: 0px 2px 0px 2px;
113 background-color: @grey6;
104 background-color: @grey6;
114
105
115 #parent_link {
106 #parent_link {
116 margin: 00px 2px;
107 margin: 00px 2px;
117
108
118 &.double {
109 &.double {
119 margin: 0px 2px;
110 margin: 0px 2px;
120 }
111 }
121
112
122 &.disabled{
113 &.disabled{
123 margin-right: @padding;
114 margin-right: @padding;
124 }
115 }
125 }
116 }
126 }
117 }
127
118
128 .children {
119 .children {
129 float: right;
120 float: right;
130 width: 100px;
121 width: 100px;
131 font-weight: 400;
122 font-weight: 400;
132 vertical-align: middle;
123 vertical-align: middle;
133 text-align: right;
124 text-align: right;
134 padding: 0px 2px 0px 2px;
125 padding: 0px 2px 0px 2px;
135 background-color: @grey6;
126 background-color: @grey6;
136
127
137 #child_link {
128 #child_link {
138 margin: 0px 2px;
129 margin: 0px 2px;
139
130
140 &.double {
131 &.double {
141 margin: 0px 2px;
132 margin: 0px 2px;
142 }
133 }
143
134
144 &.disabled{
135 &.disabled{
145 margin-right: @padding;
136 margin-right: @padding;
146 }
137 }
147 }
138 }
148 }
139 }
149
140
150 .changeset_header {
141 .changeset_header {
151 height: 16px;
142 height: 16px;
152
143
153 & > div{
144 & > div{
154 margin-right: @padding;
145 margin-right: @padding;
155 }
146 }
156 }
147 }
157
148
158 .changeset_file {
149 .changeset_file {
159 text-align: left;
150 text-align: left;
160 float: left;
151 float: left;
161 padding: 0;
152 padding: 0;
162
153
163 a{
154 a{
164 display: inline-block;
155 display: inline-block;
165 margin-right: 0.5em;
156 margin-right: 0.5em;
166 }
157 }
167
158
168 #selected_mode{
159 #selected_mode{
169 margin-left: 0;
160 margin-left: 0;
170 }
161 }
171 }
162 }
172
163
173 .diff-menu-wrapper {
164 .diff-menu-wrapper {
174 float: left;
165 float: left;
175 }
166 }
176
167
177 .diff-menu {
168 .diff-menu {
178 position: absolute;
169 position: absolute;
179 background: none repeat scroll 0 0 #FFFFFF;
170 background: none repeat scroll 0 0 #FFFFFF;
180 border-color: #003367 @grey3 @grey3;
171 border-color: #003367 @grey3 @grey3;
181 border-right: 1px solid @grey3;
172 border-right: 1px solid @grey3;
182 border-style: solid solid solid;
173 border-style: solid solid solid;
183 border-width: @border-thickness;
174 border-width: @border-thickness;
184 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
185 margin-top: 5px;
176 margin-top: 5px;
186 margin-left: 1px;
177 margin-left: 1px;
187 }
178 }
188
179
189 .diff-actions, .editor-actions {
180 .diff-actions, .editor-actions {
190 float: left;
181 float: left;
191
182
192 input{
183 input{
193 margin: 0 0.5em 0 0;
184 margin: 0 0.5em 0 0;
194 }
185 }
195 }
186 }
196
187
197 // END CODE-HEADER STYLES
188 // END CODE-HEADER STYLES
198
189
199 // BEGIN CODE-BODY STYLES
190 // BEGIN CODE-BODY STYLES
200
191
201 .code-body {
192 .code-body {
202 padding: 0;
193 padding: 0;
203 background-color: #ffffff;
194 background-color: #ffffff;
204 position: relative;
195 position: relative;
205 max-width: none;
196 max-width: none;
206 box-sizing: border-box;
197 box-sizing: border-box;
207 // TODO: johbo: Parent has overflow: auto, this forces the child here
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
208 // to have the intended size and to scroll. Should be simplified.
199 // to have the intended size and to scroll. Should be simplified.
209 width: 100%;
200 width: 100%;
210 overflow-x: auto;
201 overflow-x: auto;
211 }
202 }
212
203
213 pre.raw {
204 pre.raw {
214 background: white;
205 background: white;
215 color: @grey1;
206 color: @grey1;
216 }
207 }
217 // END CODE-BODY STYLES
208 // END CODE-BODY STYLES
218
209
219 }
210 }
220
211
221
212
222 table.code-difftable {
213 table.code-difftable {
223 border-collapse: collapse;
214 border-collapse: collapse;
224 width: 99%;
215 width: 99%;
225 border-radius: 0px !important;
216 border-radius: 0px !important;
226
217
227 td {
218 td {
228 padding: 0 !important;
219 padding: 0 !important;
229 background: none !important;
220 background: none !important;
230 border: 0 !important;
221 border: 0 !important;
231 }
222 }
232
223
233 .context {
224 .context {
234 background: none repeat scroll 0 0 #DDE7EF;
225 background: none repeat scroll 0 0 #DDE7EF;
235 }
226 }
236
227
237 .add {
228 .add {
238 background: none repeat scroll 0 0 #DDFFDD;
229 background: none repeat scroll 0 0 #DDFFDD;
239
230
240 ins {
231 ins {
241 background: none repeat scroll 0 0 #AAFFAA;
232 background: none repeat scroll 0 0 #AAFFAA;
242 text-decoration: none;
233 text-decoration: none;
243 }
234 }
244 }
235 }
245
236
246 .del {
237 .del {
247 background: none repeat scroll 0 0 #FFDDDD;
238 background: none repeat scroll 0 0 #FFDDDD;
248
239
249 del {
240 del {
250 background: none repeat scroll 0 0 #FFAAAA;
241 background: none repeat scroll 0 0 #FFAAAA;
251 text-decoration: none;
242 text-decoration: none;
252 }
243 }
253 }
244 }
254
245
255 /** LINE NUMBERS **/
246 /** LINE NUMBERS **/
256 .lineno {
247 .lineno {
257 padding-left: 2px !important;
248 padding-left: 2px !important;
258 padding-right: 2px;
249 padding-right: 2px;
259 text-align: right;
250 text-align: right;
260 width: 32px;
251 width: 32px;
261 -moz-user-select: none;
252 -moz-user-select: none;
262 -webkit-user-select: none;
253 -webkit-user-select: none;
263 border-right: @border-thickness solid @grey5 !important;
254 border-right: @border-thickness solid @grey5 !important;
264 border-left: 0px solid #CCC !important;
255 border-left: 0px solid #CCC !important;
265 border-top: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
266 border-bottom: none !important;
257 border-bottom: none !important;
267
258
268 a {
259 a {
269 &:extend(pre);
260 &:extend(pre);
270 text-align: right;
261 text-align: right;
271 padding-right: 2px;
262 padding-right: 2px;
272 cursor: pointer;
263 cursor: pointer;
273 display: block;
264 display: block;
274 width: 32px;
265 width: 32px;
275 }
266 }
276 }
267 }
277
268
278 .context {
269 .context {
279 cursor: auto;
270 cursor: auto;
280 &:extend(pre);
271 &:extend(pre);
281 }
272 }
282
273
283 .lineno-inline {
274 .lineno-inline {
284 background: none repeat scroll 0 0 #FFF !important;
275 background: none repeat scroll 0 0 #FFF !important;
285 padding-left: 2px;
276 padding-left: 2px;
286 padding-right: 2px;
277 padding-right: 2px;
287 text-align: right;
278 text-align: right;
288 width: 30px;
279 width: 30px;
289 -moz-user-select: none;
280 -moz-user-select: none;
290 -webkit-user-select: none;
281 -webkit-user-select: none;
291 }
282 }
292
283
293 /** CODE **/
284 /** CODE **/
294 .code {
285 .code {
295 display: block;
286 display: block;
296 width: 100%;
287 width: 100%;
297
288
298 td {
289 td {
299 margin: 0;
290 margin: 0;
300 padding: 0;
291 padding: 0;
301 }
292 }
302
293
303 pre {
294 pre {
304 margin: 0;
295 margin: 0;
305 padding: 0;
296 padding: 0;
306 margin-left: .5em;
297 margin-left: .5em;
307 }
298 }
308 }
299 }
309 }
300 }
310
301
311
302
312 // Comments
303 // Comments
313
304
314 div.comment:target {
305 div.comment:target {
315 border-left: 6px solid @comment-highlight-color !important;
306 border-left: 6px solid @comment-highlight-color !important;
316 padding-left: 3px;
307 padding-left: 3px;
317 margin-left: -9px;
308 margin-left: -9px;
318 }
309 }
319
310
320 //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
321 //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
322 @comment-max-width: 1065px;
313 @comment-max-width: 1065px;
323 @pr-extra-margin: 34px;
314 @pr-extra-margin: 34px;
324 @pr-border-spacing: 4px;
315 @pr-border-spacing: 4px;
325 @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;
326
317
327 // Pull Request
318 // Pull Request
328 .cs_files .code-difftable {
319 .cs_files .code-difftable {
329 border: @border-thickness solid @grey5; //borders only on PRs
320 border: @border-thickness solid @grey5; //borders only on PRs
330
321
331 .comment-inline-form,
322 .comment-inline-form,
332 div.comment {
323 div.comment {
333 width: @pr-comment-width;
324 width: @pr-comment-width;
334 }
325 }
335 }
326 }
336
327
337 // Changeset
328 // Changeset
338 .code-difftable {
329 .code-difftable {
339 .comment-inline-form,
330 .comment-inline-form,
340 div.comment {
331 div.comment {
341 width: @comment-max-width;
332 width: @comment-max-width;
342 }
333 }
343 }
334 }
344
335
345 //Style page
336 //Style page
346 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
347 #style-page .code-difftable{
338 #style-page .code-difftable{
348 .comment-inline-form,
339 .comment-inline-form,
349 div.comment {
340 div.comment {
350 width: @comment-max-width - @style-extra-margin;
341 width: @comment-max-width - @style-extra-margin;
351 }
342 }
352 }
343 }
353
344
354 #context-bar > h2 {
345 #context-bar > h2 {
355 font-size: 20px;
346 font-size: 20px;
356 }
347 }
357
348
358 #context-bar > h2> a {
349 #context-bar > h2> a {
359 font-size: 20px;
350 font-size: 20px;
360 }
351 }
361 // end of defaults
352 // end of defaults
362
353
363 .file_diff_buttons {
354 .file_diff_buttons {
364 padding: 0 0 @padding;
355 padding: 0 0 @padding;
365
356
366 .drop-menu {
357 .drop-menu {
367 float: left;
358 float: left;
368 margin: 0 @padding 0 0;
359 margin: 0 @padding 0 0;
369 }
360 }
370 .btn {
361 .btn {
371 margin: 0 @padding 0 0;
362 margin: 0 @padding 0 0;
372 }
363 }
373 }
364 }
374
365
375 .code-body.textarea.editor {
366 .code-body.textarea.editor {
376 max-width: none;
367 max-width: none;
377 padding: 15px;
368 padding: 15px;
378 }
369 }
379
370
380 td.injected_diff{
371 td.injected_diff{
381 max-width: 1178px;
372 max-width: 1178px;
382 overflow-x: auto;
373 overflow-x: auto;
383 overflow-y: hidden;
374 overflow-y: hidden;
384
375
385 div.diff-container,
376 div.diff-container,
386 div.diffblock{
377 div.diffblock{
387 max-width: 100%;
378 max-width: 100%;
388 }
379 }
389
380
390 div.code-body {
381 div.code-body {
391 max-width: 1124px;
382 max-width: 1124px;
392 overflow-x: auto;
383 overflow-x: auto;
393 overflow-y: hidden;
384 overflow-y: hidden;
394 padding: 0;
385 padding: 0;
395 }
386 }
396 div.diffblock {
387 div.diffblock {
397 border: none;
388 border: none;
398 }
389 }
399
390
400 &.inline-form {
391 &.inline-form {
401 width: 99%
392 width: 99%
402 }
393 }
403 }
394 }
404
395
405
396
406 table.code-difftable {
397 table.code-difftable {
407 width: 100%;
398 width: 100%;
408 }
399 }
409
400
410 /** PYGMENTS COLORING **/
401 /** PYGMENTS COLORING **/
411 div.codeblock {
402 div.codeblock {
412
403
413 // TODO: johbo: Added interim to get rid of the margin around
404 // TODO: johbo: Added interim to get rid of the margin around
414 // Select2 widgets. This needs further cleanup.
405 // Select2 widgets. This needs further cleanup.
415 margin-top: @padding;
406 margin-top: @padding;
416
407
417 overflow: auto;
408 overflow: auto;
418 padding: 0px;
409 padding: 0px;
419 border: @border-thickness solid @grey5;
410 border: @border-thickness solid @grey5;
420 background: @grey6;
411 background: @grey6;
421 .border-radius(@border-radius);
412 .border-radius(@border-radius);
422
413
423 #remove_gist {
414 #remove_gist {
424 float: right;
415 float: right;
425 }
416 }
426
417
427 .gist_url {
418 .gist_url {
428 padding: 0px 0px 10px 0px;
419 padding: 0px 0px 10px 0px;
429 }
420 }
430
421
431 .author {
422 .author {
432 clear: both;
423 clear: both;
433 vertical-align: middle;
424 vertical-align: middle;
434 font-family: @text-bold;
425 font-family: @text-bold;
435 }
426 }
436
427
437 .btn-mini {
428 .btn-mini {
438 float: left;
429 float: left;
439 margin: 0 5px 0 0;
430 margin: 0 5px 0 0;
440 }
431 }
441
432
442 .code-header {
433 .code-header {
443 padding: @padding;
434 padding: @padding;
444 border-bottom: @border-thickness solid @grey5;
435 border-bottom: @border-thickness solid @grey5;
445
436
446 .rc-user {
437 .rc-user {
447 min-width: 0;
438 min-width: 0;
448 margin-right: .5em;
439 margin-right: .5em;
449 }
440 }
450
441
451 .stats {
442 .stats {
452 clear: both;
443 clear: both;
453 margin: 0 0 @padding 0;
444 margin: 0 0 @padding 0;
454 padding: 0;
445 padding: 0;
455 .left {
446 .left {
456 float: left;
447 float: left;
457 clear: left;
448 clear: left;
458 max-width: 75%;
449 max-width: 75%;
459 margin: 0 0 @padding 0;
450 margin: 0 0 @padding 0;
460
451
461 &.item {
452 &.item {
462 margin-right: @padding;
453 margin-right: @padding;
463 &.last { border-right: none; }
454 &.last { border-right: none; }
464 }
455 }
465 }
456 }
466 .buttons { float: right; }
457 .buttons { float: right; }
467 .author {
458 .author {
468 height: 25px; margin-left: 15px; font-weight: bold;
459 height: 25px; margin-left: 15px; font-weight: bold;
469 }
460 }
470 }
461 }
471
462
472 .commit {
463 .commit {
473 margin: 5px 0 0 26px;
464 margin: 5px 0 0 26px;
474 font-weight: normal;
465 font-weight: normal;
475 white-space: pre-wrap;
466 white-space: pre-wrap;
476 }
467 }
477 }
468 }
478
469
479 .message {
470 .message {
480 position: relative;
471 position: relative;
481 margin: @padding;
472 margin: @padding;
482
473
483 .codeblock-label {
474 .codeblock-label {
484 margin: 0 0 1em 0;
475 margin: 0 0 1em 0;
485 }
476 }
486 }
477 }
487
478
488 .code-body {
479 .code-body {
489 padding: @padding;
480 padding: @padding;
490 background-color: #ffffff;
481 background-color: #ffffff;
491 min-width: 100%;
482 min-width: 100%;
492 box-sizing: border-box;
483 box-sizing: border-box;
493 // TODO: johbo: Parent has overflow: auto, this forces the child here
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
494 // to have the intended size and to scroll. Should be simplified.
485 // to have the intended size and to scroll. Should be simplified.
495 width: 100%;
486 width: 100%;
496 overflow-x: auto;
487 overflow-x: auto;
497
488
498 img.rendered-binary {
489 img.rendered-binary {
499 height: auto;
490 height: auto;
500 width: 100%;
491 width: 100%;
501 }
492 }
502 }
493 }
503 }
494 }
504
495
505 .code-highlighttable,
496 .code-highlighttable,
506 div.codeblock {
497 div.codeblock {
507
498
508 &.readme {
499 &.readme {
509 background-color: white;
500 background-color: white;
510 }
501 }
511
502
512 .markdown-block table {
503 .markdown-block table {
513 border-collapse: collapse;
504 border-collapse: collapse;
514
505
515 th,
506 th,
516 td {
507 td {
517 padding: .5em;
508 padding: .5em;
518 border: @border-thickness solid @border-default-color;
509 border: @border-thickness solid @border-default-color;
519 }
510 }
520 }
511 }
521
512
522 table {
513 table {
523 border: 0px;
514 border: 0px;
524 margin: 0;
515 margin: 0;
525 letter-spacing: normal;
516 letter-spacing: normal;
526
517
527
518
528 td {
519 td {
529 border: 0px;
520 border: 0px;
530 vertical-align: top;
521 vertical-align: top;
531 }
522 }
532 }
523 }
533 }
524 }
534
525
535 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
536 div.search-code-body {
527 div.search-code-body {
537 background-color: #ffffff; padding: 5px 0 5px 10px;
528 background-color: #ffffff; padding: 5px 0 5px 10px;
538 pre {
529 pre {
539 .match { background-color: #faffa6;}
530 .match { background-color: #faffa6;}
540 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
541 }
532 }
542 .code-highlighttable {
533 .code-highlighttable {
543 border-collapse: collapse;
534 border-collapse: collapse;
544
535
545 tr:hover {
536 tr:hover {
546 background: #fafafa;
537 background: #fafafa;
547 }
538 }
548 td.code {
539 td.code {
549 padding-left: 10px;
540 padding-left: 10px;
550 }
541 }
551 td.line {
542 td.line {
552 border-right: 1px solid #ccc !important;
543 border-right: 1px solid #ccc !important;
553 padding-right: 10px;
544 padding-right: 10px;
554 text-align: right;
545 text-align: right;
555 font-family: "Lucida Console",Monaco,monospace;
546 font-family: "Lucida Console",Monaco,monospace;
556 span {
547 span {
557 white-space: pre-wrap;
548 white-space: pre-wrap;
558 color: #666666;
549 color: #666666;
559 }
550 }
560 }
551 }
561 }
552 }
562 }
553 }
563
554
564 div.annotatediv { margin-left: 2px; margin-right: 4px; }
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
565 .code-highlight {
556 .code-highlight {
566 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
567 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
568 pre div:target {background-color: @comment-highlight-color !important;}
559 pre div:target {background-color: @comment-highlight-color !important;}
569 }
560 }
570
561
571 .linenos a { text-decoration: none; }
562 .linenos a { text-decoration: none; }
572
563
573 .CodeMirror-selected { background: @rchighlightblue; }
564 .CodeMirror-selected { background: @rchighlightblue; }
574 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
575 .CodeMirror ::selection { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
576 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
577
568
578 .code { display: block; border:0px !important; }
569 .code { display: block; border:0px !important; }
579 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
580 .codehilite {
571 .codehilite {
581 .hll { background-color: #ffffcc }
572 .hll { background-color: #ffffcc }
582 .c { color: #408080; font-style: italic } /* Comment */
573 .c { color: #408080; font-style: italic } /* Comment */
583 .err, .codehilite .err { border: @border-thickness solid #FF0000 } /* Error */
574 .err, .codehilite .err { border: @border-thickness solid #FF0000 } /* Error */
584 .k { color: #008000; font-weight: bold } /* Keyword */
575 .k { color: #008000; font-weight: bold } /* Keyword */
585 .o { color: #666666 } /* Operator */
576 .o { color: #666666 } /* Operator */
586 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
587 .cp { color: #BC7A00 } /* Comment.Preproc */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
588 .c1 { color: #408080; font-style: italic } /* Comment.Single */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
589 .cs { color: #408080; font-style: italic } /* Comment.Special */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
590 .gd { color: #A00000 } /* Generic.Deleted */
581 .gd { color: #A00000 } /* Generic.Deleted */
591 .ge { font-style: italic } /* Generic.Emph */
582 .ge { font-style: italic } /* Generic.Emph */
592 .gr { color: #FF0000 } /* Generic.Error */
583 .gr { color: #FF0000 } /* Generic.Error */
593 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
594 .gi { color: #00A000 } /* Generic.Inserted */
585 .gi { color: #00A000 } /* Generic.Inserted */
595 .go { color: #808080 } /* Generic.Output */
586 .go { color: #808080 } /* Generic.Output */
596 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
597 .gs { font-weight: bold } /* Generic.Strong */
588 .gs { font-weight: bold } /* Generic.Strong */
598 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
599 .gt { color: #0040D0 } /* Generic.Traceback */
590 .gt { color: #0040D0 } /* Generic.Traceback */
600 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
601 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
602 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
603 .kp { color: #008000 } /* Keyword.Pseudo */
594 .kp { color: #008000 } /* Keyword.Pseudo */
604 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
605 .kt { color: #B00040 } /* Keyword.Type */
596 .kt { color: #B00040 } /* Keyword.Type */
606 .m { color: #666666 } /* Literal.Number */
597 .m { color: #666666 } /* Literal.Number */
607 .s { color: #BA2121 } /* Literal.String */
598 .s { color: #BA2121 } /* Literal.String */
608 .na { color: #7D9029 } /* Name.Attribute */
599 .na { color: #7D9029 } /* Name.Attribute */
609 .nb { color: #008000 } /* Name.Builtin */
600 .nb { color: #008000 } /* Name.Builtin */
610 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
611 .no { color: #880000 } /* Name.Constant */
602 .no { color: #880000 } /* Name.Constant */
612 .nd { color: #AA22FF } /* Name.Decorator */
603 .nd { color: #AA22FF } /* Name.Decorator */
613 .ni { color: #999999; font-weight: bold } /* Name.Entity */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
614 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
615 .nf { color: #0000FF } /* Name.Function */
606 .nf { color: #0000FF } /* Name.Function */
616 .nl { color: #A0A000 } /* Name.Label */
607 .nl { color: #A0A000 } /* Name.Label */
617 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
618 .nt { color: #008000; font-weight: bold } /* Name.Tag */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
619 .nv { color: #19177C } /* Name.Variable */
610 .nv { color: #19177C } /* Name.Variable */
620 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
621 .w { color: #bbbbbb } /* Text.Whitespace */
612 .w { color: #bbbbbb } /* Text.Whitespace */
622 .mf { color: #666666 } /* Literal.Number.Float */
613 .mf { color: #666666 } /* Literal.Number.Float */
623 .mh { color: #666666 } /* Literal.Number.Hex */
614 .mh { color: #666666 } /* Literal.Number.Hex */
624 .mi { color: #666666 } /* Literal.Number.Integer */
615 .mi { color: #666666 } /* Literal.Number.Integer */
625 .mo { color: #666666 } /* Literal.Number.Oct */
616 .mo { color: #666666 } /* Literal.Number.Oct */
626 .sb { color: #BA2121 } /* Literal.String.Backtick */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
627 .sc { color: #BA2121 } /* Literal.String.Char */
618 .sc { color: #BA2121 } /* Literal.String.Char */
628 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
629 .s2 { color: #BA2121 } /* Literal.String.Double */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
630 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
631 .sh { color: #BA2121 } /* Literal.String.Heredoc */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
632 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
633 .sx { color: #008000 } /* Literal.String.Other */
624 .sx { color: #008000 } /* Literal.String.Other */
634 .sr { color: #BB6688 } /* Literal.String.Regex */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
635 .s1 { color: #BA2121 } /* Literal.String.Single */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
636 .ss { color: #19177C } /* Literal.String.Symbol */
627 .ss { color: #19177C } /* Literal.String.Symbol */
637 .bp { color: #008000 } /* Name.Builtin.Pseudo */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
638 .vc { color: #19177C } /* Name.Variable.Class */
629 .vc { color: #19177C } /* Name.Variable.Class */
639 .vg { color: #19177C } /* Name.Variable.Global */
630 .vg { color: #19177C } /* Name.Variable.Global */
640 .vi { color: #19177C } /* Name.Variable.Instance */
631 .vi { color: #19177C } /* Name.Variable.Instance */
641 .il { color: #666666 } /* Literal.Number.Integer.Long */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
642 }
633 }
643
634
644 /* customized pre blocks for markdown/rst */
635 /* customized pre blocks for markdown/rst */
645 pre.literal-block, .codehilite pre{
636 pre.literal-block, .codehilite pre{
646 padding: @padding;
637 padding: @padding;
647 border: 1px solid @grey6;
638 border: 1px solid @grey6;
648 .border-radius(@border-radius);
639 .border-radius(@border-radius);
649 background-color: @grey7;
640 background-color: @grey7;
650 }
641 }
651
642
652
643
653 /* START NEW CODE BLOCK CSS */
644 /* START NEW CODE BLOCK CSS */
654
645
655 @cb-line-height: 18px;
646 @cb-line-height: 18px;
656 @cb-line-code-padding: 10px;
647 @cb-line-code-padding: 10px;
657 @cb-text-padding: 5px;
648 @cb-text-padding: 5px;
658
649
659 @pill-padding: 2px 7px;
650 @pill-padding: 2px 7px;
660
651
661 input.filediff-collapse-state {
652 input.filediff-collapse-state {
662 display: none;
653 display: none;
663
654
664 &:checked + .filediff { /* file diff is collapsed */
655 &:checked + .filediff { /* file diff is collapsed */
665 .cb {
656 .cb {
666 display: none
657 display: none
667 }
658 }
668 .filediff-collapse-indicator {
659 .filediff-collapse-indicator {
669 width: 0;
660 width: 0;
670 height: 0;
661 height: 0;
671 border-style: solid;
662 border-style: solid;
672 border-width: 4.5px 0 4.5px 9.3px;
663 border-width: 4.5px 0 4.5px 9.3px;
673 border-color: transparent transparent transparent #aaa;
664 border-color: transparent transparent transparent #aaa;
674 margin: 6px 0px;
665 margin: 6px 0px;
675 }
666 }
676 .filediff-menu {
667 .filediff-menu {
677 display: none;
668 display: none;
678 }
669 }
679 margin: 10px 0 0 0;
670 margin: 10px 0 0 0;
680 }
671 }
681
672
682 &+ .filediff { /* file diff is expanded */
673 &+ .filediff { /* file diff is expanded */
683 .filediff-collapse-indicator {
674 .filediff-collapse-indicator {
684 width: 0;
675 width: 0;
685 height: 0;
676 height: 0;
686 border-style: solid;
677 border-style: solid;
687 border-width: 9.3px 4.5px 0 4.5px;
678 border-width: 9.3px 4.5px 0 4.5px;
688 border-color: #aaa transparent transparent transparent;
679 border-color: #aaa transparent transparent transparent;
689 margin: 6px 0px;
680 margin: 6px 0px;
690
681
691 }
682 }
692 .filediff-menu {
683 .filediff-menu {
693 display: block;
684 display: block;
694 }
685 }
695 margin: 10px 0;
686 margin: 10px 0;
696 &:nth-child(2) {
687 &:nth-child(2) {
697 margin: 0;
688 margin: 0;
698 }
689 }
699 }
690 }
700 }
691 }
701 .cs_files {
692 .cs_files {
702 clear: both;
693 clear: both;
703 }
694 }
704
695
705 .diffset-menu {
696 .diffset-menu {
706 margin-bottom: 20px;
697 margin-bottom: 20px;
707 }
698 }
708 .diffset {
699 .diffset {
709 margin: 20px auto;
700 margin: 20px auto;
710 .diffset-heading {
701 .diffset-heading {
711 border: 1px solid @grey5;
702 border: 1px solid @grey5;
712 margin-bottom: -1px;
703 margin-bottom: -1px;
713 // margin-top: 20px;
704 // margin-top: 20px;
714 h2 {
705 h2 {
715 margin: 0;
706 margin: 0;
716 line-height: 38px;
707 line-height: 38px;
717 padding-left: 10px;
708 padding-left: 10px;
718 }
709 }
719 .btn {
710 .btn {
720 margin: 0;
711 margin: 0;
721 }
712 }
722 background: @grey6;
713 background: @grey6;
723 display: block;
714 display: block;
724 padding: 5px;
715 padding: 5px;
725 }
716 }
726 .diffset-heading-warning {
717 .diffset-heading-warning {
727 background: @alert3-inner;
718 background: @alert3-inner;
728 border: 1px solid @alert3;
719 border: 1px solid @alert3;
729 }
720 }
730 &.diffset-comments-disabled {
721 &.diffset-comments-disabled {
731 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
722 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
732 display: none !important;
723 display: none !important;
733 }
724 }
734 }
725 }
735 }
726 }
736
727
737 .pill {
728 .pill {
738 display: block;
729 display: block;
739 float: left;
730 float: left;
740 padding: @pill-padding;
731 padding: @pill-padding;
741 }
732 }
742 .pill-group {
733 .pill-group {
743 .pill {
734 .pill {
744 opacity: .8;
735 opacity: .8;
745 &:first-child {
736 &:first-child {
746 border-radius: @border-radius 0 0 @border-radius;
737 border-radius: @border-radius 0 0 @border-radius;
747 }
738 }
748 &:last-child {
739 &:last-child {
749 border-radius: 0 @border-radius @border-radius 0;
740 border-radius: 0 @border-radius @border-radius 0;
750 }
741 }
751 &:only-child {
742 &:only-child {
752 border-radius: @border-radius;
743 border-radius: @border-radius;
753 }
744 }
754 }
745 }
755 }
746 }
756
747
757 /* Main comments*/
748 /* Main comments*/
758 #comments {
749 #comments {
759 .comment-selected {
750 .comment-selected {
760 border-left: 6px solid @comment-highlight-color;
751 border-left: 6px solid @comment-highlight-color;
761 padding-left: 3px;
752 padding-left: 3px;
762 margin-left: -9px;
753 margin-left: -9px;
763 }
754 }
764 }
755 }
765
756
766 .filediff {
757 .filediff {
767 border: 1px solid @grey5;
758 border: 1px solid @grey5;
768
759
769 /* START OVERRIDES */
760 /* START OVERRIDES */
770 .code-highlight {
761 .code-highlight {
771 border: none; // TODO: remove this border from the global
762 border: none; // TODO: remove this border from the global
772 // .code-highlight, it doesn't belong there
763 // .code-highlight, it doesn't belong there
773 }
764 }
774 label {
765 label {
775 margin: 0; // TODO: remove this margin definition from global label
766 margin: 0; // TODO: remove this margin definition from global label
776 // it doesn't belong there - if margin on labels
767 // it doesn't belong there - if margin on labels
777 // are needed for a form they should be defined
768 // are needed for a form they should be defined
778 // in the form's class
769 // in the form's class
779 }
770 }
780 /* END OVERRIDES */
771 /* END OVERRIDES */
781
772
782 * {
773 * {
783 box-sizing: border-box;
774 box-sizing: border-box;
784 }
775 }
785 .filediff-anchor {
776 .filediff-anchor {
786 visibility: hidden;
777 visibility: hidden;
787 }
778 }
788 &:hover {
779 &:hover {
789 .filediff-anchor {
780 .filediff-anchor {
790 visibility: visible;
781 visibility: visible;
791 }
782 }
792 }
783 }
793
784
794 .filediff-collapse-indicator {
785 .filediff-collapse-indicator {
795 border-style: solid;
786 border-style: solid;
796 float: left;
787 float: left;
797 margin: 4px 0px 0 0;
788 margin: 4px 0px 0 0;
798 cursor: pointer;
789 cursor: pointer;
799 }
790 }
800
791
801 .filediff-heading {
792 .filediff-heading {
802 background: @grey7;
793 background: @grey7;
803 cursor: pointer;
794 cursor: pointer;
804 display: block;
795 display: block;
805 padding: 5px 10px;
796 padding: 5px 10px;
806 }
797 }
807 .filediff-heading:after {
798 .filediff-heading:after {
808 content: "";
799 content: "";
809 display: table;
800 display: table;
810 clear: both;
801 clear: both;
811 }
802 }
812 .filediff-heading:hover {
803 .filediff-heading:hover {
813 background: #e1e9f4 !important;
804 background: #e1e9f4 !important;
814 }
805 }
815
806
816 .filediff-menu {
807 .filediff-menu {
817 float: right;
808 float: right;
818 text-align: right;
809 text-align: right;
819 padding: 5px 5px 5px 0px;
810 padding: 5px 5px 5px 0px;
820
811
821 &> a,
812 &> a,
822 &> span {
813 &> span {
823 padding: 1px;
814 padding: 1px;
824 }
815 }
825 }
816 }
826
817
827 .pill {
818 .pill {
828 &[op="name"] {
819 &[op="name"] {
829 background: none;
820 background: none;
830 opacity: 1;
821 opacity: 1;
831 color: white;
822 color: white;
832 }
823 }
833 &[op="limited"] {
824 &[op="limited"] {
834 background: @grey2;
825 background: @grey2;
835 color: white;
826 color: white;
836 }
827 }
837 &[op="binary"] {
828 &[op="binary"] {
838 background: @color7;
829 background: @color7;
839 color: white;
830 color: white;
840 }
831 }
841 &[op="modified"] {
832 &[op="modified"] {
842 background: @alert1;
833 background: @alert1;
843 color: white;
834 color: white;
844 }
835 }
845 &[op="renamed"] {
836 &[op="renamed"] {
846 background: @color4;
837 background: @color4;
847 color: white;
838 color: white;
848 }
839 }
849 &[op="copied"] {
840 &[op="copied"] {
850 background: @color4;
841 background: @color4;
851 color: white;
842 color: white;
852 }
843 }
853 &[op="mode"] {
844 &[op="mode"] {
854 background: @grey3;
845 background: @grey3;
855 color: white;
846 color: white;
856 }
847 }
857 &[op="symlink"] {
848 &[op="symlink"] {
858 background: @color8;
849 background: @color8;
859 color: white;
850 color: white;
860 }
851 }
861
852
862 &[op="added"] { /* added lines */
853 &[op="added"] { /* added lines */
863 background: @alert1;
854 background: @alert1;
864 color: white;
855 color: white;
865 }
856 }
866 &[op="deleted"] { /* deleted lines */
857 &[op="deleted"] { /* deleted lines */
867 background: @alert2;
858 background: @alert2;
868 color: white;
859 color: white;
869 }
860 }
870
861
871 &[op="created"] { /* created file */
862 &[op="created"] { /* created file */
872 background: @alert1;
863 background: @alert1;
873 color: white;
864 color: white;
874 }
865 }
875 &[op="removed"] { /* deleted file */
866 &[op="removed"] { /* deleted file */
876 background: @color5;
867 background: @color5;
877 color: white;
868 color: white;
878 }
869 }
879 }
870 }
880
871
881 .filediff-collapse-button, .filediff-expand-button {
872 .filediff-collapse-button, .filediff-expand-button {
882 cursor: pointer;
873 cursor: pointer;
883 }
874 }
884 .filediff-collapse-button {
875 .filediff-collapse-button {
885 display: inline;
876 display: inline;
886 }
877 }
887 .filediff-expand-button {
878 .filediff-expand-button {
888 display: none;
879 display: none;
889 }
880 }
890 .filediff-collapsed .filediff-collapse-button {
881 .filediff-collapsed .filediff-collapse-button {
891 display: none;
882 display: none;
892 }
883 }
893 .filediff-collapsed .filediff-expand-button {
884 .filediff-collapsed .filediff-expand-button {
894 display: inline;
885 display: inline;
895 }
886 }
896
887
897 /**** COMMENTS ****/
888 /**** COMMENTS ****/
898
889
899 .filediff-menu {
890 .filediff-menu {
900 .show-comment-button {
891 .show-comment-button {
901 display: none;
892 display: none;
902 }
893 }
903 }
894 }
904 &.hide-comments {
895 &.hide-comments {
905 .inline-comments {
896 .inline-comments {
906 display: none;
897 display: none;
907 }
898 }
908 .filediff-menu {
899 .filediff-menu {
909 .show-comment-button {
900 .show-comment-button {
910 display: inline;
901 display: inline;
911 }
902 }
912 .hide-comment-button {
903 .hide-comment-button {
913 display: none;
904 display: none;
914 }
905 }
915 }
906 }
916 }
907 }
917
908
918 .hide-line-comments {
909 .hide-line-comments {
919 .inline-comments {
910 .inline-comments {
920 display: none;
911 display: none;
921 }
912 }
922 }
913 }
923
914
924 /**** END COMMENTS ****/
915 /**** END COMMENTS ****/
925
916
926 }
917 }
927
918
928 .filediff-outdated {
919 .filediff-outdated {
929 padding: 8px 0;
920 padding: 8px 0;
930
921
931 .filediff-heading {
922 .filediff-heading {
932 opacity: .5;
923 opacity: .5;
933 }
924 }
934 }
925 }
935
926
936 table.cb {
927 table.cb {
937 width: 100%;
928 width: 100%;
938 border-collapse: collapse;
929 border-collapse: collapse;
939
930
940 .cb-text {
931 .cb-text {
941 padding: @cb-text-padding;
932 padding: @cb-text-padding;
942 }
933 }
943 .cb-hunk {
934 .cb-hunk {
944 padding: @cb-text-padding;
935 padding: @cb-text-padding;
945 }
936 }
946 .cb-expand {
937 .cb-expand {
947 display: none;
938 display: none;
948 }
939 }
949 .cb-collapse {
940 .cb-collapse {
950 display: inline;
941 display: inline;
951 }
942 }
952 &.cb-collapsed {
943 &.cb-collapsed {
953 .cb-line {
944 .cb-line {
954 display: none;
945 display: none;
955 }
946 }
956 .cb-expand {
947 .cb-expand {
957 display: inline;
948 display: inline;
958 }
949 }
959 .cb-collapse {
950 .cb-collapse {
960 display: none;
951 display: none;
961 }
952 }
962 }
953 }
963
954
964 /* intentionally general selector since .cb-line-selected must override it
955 /* intentionally general selector since .cb-line-selected must override it
965 and they both use !important since the td itself may have a random color
956 and they both use !important since the td itself may have a random color
966 generated by annotation blocks. TLDR: if you change it, make sure
957 generated by annotation blocks. TLDR: if you change it, make sure
967 annotated block selection and line selection in file view still work */
958 annotated block selection and line selection in file view still work */
968 .cb-line-fresh .cb-content {
959 .cb-line-fresh .cb-content {
969 background: white !important;
960 background: white !important;
970 }
961 }
971 .cb-warning {
962 .cb-warning {
972 background: #fff4dd;
963 background: #fff4dd;
973 }
964 }
974
965
975 &.cb-diff-sideside {
966 &.cb-diff-sideside {
976 td {
967 td {
977 &.cb-content {
968 &.cb-content {
978 width: 50%;
969 width: 50%;
979 }
970 }
980 }
971 }
981 }
972 }
982
973
983 tr {
974 tr {
984 &.cb-annotate {
975 &.cb-annotate {
985 border-top: 1px solid #eee;
976 border-top: 1px solid #eee;
986 }
977 }
987
978
988 &.cb-hunk {
979 &.cb-hunk {
989 font-family: @font-family-monospace;
980 font-family: @font-family-monospace;
990 color: rgba(0, 0, 0, 0.3);
981 color: rgba(0, 0, 0, 0.3);
991
982
992 td {
983 td {
993 &:first-child {
984 &:first-child {
994 background: #edf2f9;
985 background: #edf2f9;
995 }
986 }
996 &:last-child {
987 &:last-child {
997 background: #f4f7fb;
988 background: #f4f7fb;
998 }
989 }
999 }
990 }
1000 }
991 }
1001 }
992 }
1002
993
1003
994
1004 td {
995 td {
1005 vertical-align: top;
996 vertical-align: top;
1006 padding: 0;
997 padding: 0;
1007
998
1008 &.cb-content {
999 &.cb-content {
1009 font-size: 12.35px;
1000 font-size: 12.35px;
1010
1001
1011 &.cb-line-selected .cb-code {
1002 &.cb-line-selected .cb-code {
1012 background: @comment-highlight-color !important;
1003 background: @comment-highlight-color !important;
1013 }
1004 }
1014
1005
1015 span.cb-code {
1006 span.cb-code {
1016 line-height: @cb-line-height;
1007 line-height: @cb-line-height;
1017 padding-left: @cb-line-code-padding;
1008 padding-left: @cb-line-code-padding;
1018 padding-right: @cb-line-code-padding;
1009 padding-right: @cb-line-code-padding;
1019 display: block;
1010 display: block;
1020 white-space: pre-wrap;
1011 white-space: pre-wrap;
1021 font-family: @font-family-monospace;
1012 font-family: @font-family-monospace;
1022 word-break: break-all;
1013 word-break: break-all;
1023 .nonl {
1014 .nonl {
1024 color: @color5;
1015 color: @color5;
1025 }
1016 }
1026 }
1017 }
1027
1018
1028 &> button.cb-comment-box-opener {
1019 &> button.cb-comment-box-opener {
1029
1020
1030 padding: 2px 2px 1px 3px;
1021 padding: 2px 2px 1px 3px;
1031 margin-left: -6px;
1022 margin-left: -6px;
1032 margin-top: -1px;
1023 margin-top: -1px;
1033
1024
1034 border-radius: @border-radius;
1025 border-radius: @border-radius;
1035 position: absolute;
1026 position: absolute;
1036 display: none;
1027 display: none;
1037 }
1028 }
1038 .cb-comment {
1029 .cb-comment {
1039 margin-top: 10px;
1030 margin-top: 10px;
1040 white-space: normal;
1031 white-space: normal;
1041 }
1032 }
1042 }
1033 }
1043 &:hover {
1034 &:hover {
1044 button.cb-comment-box-opener {
1035 button.cb-comment-box-opener {
1045 display: block;
1036 display: block;
1046 }
1037 }
1047 &+ td button.cb-comment-box-opener {
1038 &+ td button.cb-comment-box-opener {
1048 display: block
1039 display: block
1049 }
1040 }
1050 }
1041 }
1051
1042
1052 &.cb-data {
1043 &.cb-data {
1053 text-align: right;
1044 text-align: right;
1054 width: 30px;
1045 width: 30px;
1055 font-family: @font-family-monospace;
1046 font-family: @font-family-monospace;
1056
1047
1057 .icon-comment {
1048 .icon-comment {
1058 cursor: pointer;
1049 cursor: pointer;
1059 }
1050 }
1060 &.cb-line-selected > div {
1051 &.cb-line-selected > div {
1061 display: block;
1052 display: block;
1062 background: @comment-highlight-color !important;
1053 background: @comment-highlight-color !important;
1063 line-height: @cb-line-height;
1054 line-height: @cb-line-height;
1064 color: rgba(0, 0, 0, 0.3);
1055 color: rgba(0, 0, 0, 0.3);
1065 }
1056 }
1066 }
1057 }
1067
1058
1068 &.cb-lineno {
1059 &.cb-lineno {
1069 padding: 0;
1060 padding: 0;
1070 width: 50px;
1061 width: 50px;
1071 color: rgba(0, 0, 0, 0.3);
1062 color: rgba(0, 0, 0, 0.3);
1072 text-align: right;
1063 text-align: right;
1073 border-right: 1px solid #eee;
1064 border-right: 1px solid #eee;
1074 font-family: @font-family-monospace;
1065 font-family: @font-family-monospace;
1075
1066
1076 a::before {
1067 a::before {
1077 content: attr(data-line-no);
1068 content: attr(data-line-no);
1078 }
1069 }
1079 &.cb-line-selected a {
1070 &.cb-line-selected a {
1080 background: @comment-highlight-color !important;
1071 background: @comment-highlight-color !important;
1081 }
1072 }
1082
1073
1083 a {
1074 a {
1084 display: block;
1075 display: block;
1085 padding-right: @cb-line-code-padding;
1076 padding-right: @cb-line-code-padding;
1086 padding-left: @cb-line-code-padding;
1077 padding-left: @cb-line-code-padding;
1087 line-height: @cb-line-height;
1078 line-height: @cb-line-height;
1088 color: rgba(0, 0, 0, 0.3);
1079 color: rgba(0, 0, 0, 0.3);
1089 }
1080 }
1090 }
1081 }
1091
1082
1092 &.cb-empty {
1083 &.cb-empty {
1093 background: @grey7;
1084 background: @grey7;
1094 }
1085 }
1095
1086
1096 ins {
1087 ins {
1097 color: black;
1088 color: black;
1098 background: #a6f3a6;
1089 background: #a6f3a6;
1099 text-decoration: none;
1090 text-decoration: none;
1100 }
1091 }
1101 del {
1092 del {
1102 color: black;
1093 color: black;
1103 background: #f8cbcb;
1094 background: #f8cbcb;
1104 text-decoration: none;
1095 text-decoration: none;
1105 }
1096 }
1106 &.cb-addition {
1097 &.cb-addition {
1107 background: #ecffec;
1098 background: #ecffec;
1108
1099
1109 &.blob-lineno {
1100 &.blob-lineno {
1110 background: #ddffdd;
1101 background: #ddffdd;
1111 }
1102 }
1112 }
1103 }
1113 &.cb-deletion {
1104 &.cb-deletion {
1114 background: #ffecec;
1105 background: #ffecec;
1115
1106
1116 &.blob-lineno {
1107 &.blob-lineno {
1117 background: #ffdddd;
1108 background: #ffdddd;
1118 }
1109 }
1119 }
1110 }
1120 &.cb-annotate-message-spacer {
1111 &.cb-annotate-message-spacer {
1121 width:8px;
1112 width:8px;
1122 padding: 1px 0px 0px 3px;
1113 padding: 1px 0px 0px 3px;
1123 }
1114 }
1124 &.cb-annotate-info {
1115 &.cb-annotate-info {
1125 width: 320px;
1116 width: 320px;
1126 min-width: 320px;
1117 min-width: 320px;
1127 max-width: 320px;
1118 max-width: 320px;
1128 padding: 5px 2px;
1119 padding: 5px 2px;
1129 font-size: 13px;
1120 font-size: 13px;
1130
1121
1131 .cb-annotate-message {
1122 .cb-annotate-message {
1132 padding: 2px 0px 0px 0px;
1123 padding: 2px 0px 0px 0px;
1133 white-space: pre-line;
1124 white-space: pre-line;
1134 overflow: hidden;
1125 overflow: hidden;
1135 }
1126 }
1136 .rc-user {
1127 .rc-user {
1137 float: none;
1128 float: none;
1138 padding: 0 6px 0 17px;
1129 padding: 0 6px 0 17px;
1139 min-width: unset;
1130 min-width: unset;
1140 min-height: unset;
1131 min-height: unset;
1141 }
1132 }
1142 }
1133 }
1143
1134
1144 &.cb-annotate-revision {
1135 &.cb-annotate-revision {
1145 cursor: pointer;
1136 cursor: pointer;
1146 text-align: right;
1137 text-align: right;
1147 padding: 1px 3px 0px 3px;
1138 padding: 1px 3px 0px 3px;
1148 }
1139 }
1149 }
1140 }
1150 }
1141 }
@@ -1,2415 +1,2407 b''
1 //Primary CSS
1 //Primary CSS
2
2
3 //--- IMPORTS ------------------//
3 //--- IMPORTS ------------------//
4
4
5 @import 'helpers';
5 @import 'helpers';
6 @import 'mixins';
6 @import 'mixins';
7 @import 'rcicons';
7 @import 'rcicons';
8 @import 'fonts';
8 @import 'fonts';
9 @import 'variables';
9 @import 'variables';
10 @import 'bootstrap-variables';
10 @import 'bootstrap-variables';
11 @import 'form-bootstrap';
11 @import 'form-bootstrap';
12 @import 'codemirror';
12 @import 'codemirror';
13 @import 'legacy_code_styles';
13 @import 'legacy_code_styles';
14 @import 'readme-box';
14 @import 'readme-box';
15 @import 'progress-bar';
15 @import 'progress-bar';
16
16
17 @import 'type';
17 @import 'type';
18 @import 'alerts';
18 @import 'alerts';
19 @import 'buttons';
19 @import 'buttons';
20 @import 'tags';
20 @import 'tags';
21 @import 'code-block';
21 @import 'code-block';
22 @import 'examples';
22 @import 'examples';
23 @import 'login';
23 @import 'login';
24 @import 'main-content';
24 @import 'main-content';
25 @import 'select2';
25 @import 'select2';
26 @import 'comments';
26 @import 'comments';
27 @import 'panels-bootstrap';
27 @import 'panels-bootstrap';
28 @import 'panels';
28 @import 'panels';
29 @import 'deform';
29 @import 'deform';
30
30
31 //--- BASE ------------------//
31 //--- BASE ------------------//
32 .noscript-error {
32 .noscript-error {
33 top: 0;
33 top: 0;
34 left: 0;
34 left: 0;
35 width: 100%;
35 width: 100%;
36 z-index: 101;
36 z-index: 101;
37 text-align: center;
37 text-align: center;
38 font-family: @text-semibold;
38 font-family: @text-semibold;
39 font-size: 120%;
39 font-size: 120%;
40 color: white;
40 color: white;
41 background-color: @alert2;
41 background-color: @alert2;
42 padding: 5px 0 5px 0;
42 padding: 5px 0 5px 0;
43 }
43 }
44
44
45 html {
45 html {
46 display: table;
46 display: table;
47 height: 100%;
47 height: 100%;
48 width: 100%;
48 width: 100%;
49 }
49 }
50
50
51 body {
51 body {
52 display: table-cell;
52 display: table-cell;
53 width: 100%;
53 width: 100%;
54 }
54 }
55
55
56 //--- LAYOUT ------------------//
56 //--- LAYOUT ------------------//
57
57
58 .hidden{
58 .hidden{
59 display: none !important;
59 display: none !important;
60 }
60 }
61
61
62 .box{
62 .box{
63 float: left;
63 float: left;
64 width: 100%;
64 width: 100%;
65 }
65 }
66
66
67 .browser-header {
67 .browser-header {
68 clear: both;
68 clear: both;
69 }
69 }
70 .main {
70 .main {
71 clear: both;
71 clear: both;
72 padding:0 0 @pagepadding;
72 padding:0 0 @pagepadding;
73 height: auto;
73 height: auto;
74
74
75 &:after { //clearfix
75 &:after { //clearfix
76 content:"";
76 content:"";
77 clear:both;
77 clear:both;
78 width:100%;
78 width:100%;
79 display:block;
79 display:block;
80 }
80 }
81 }
81 }
82
82
83 .action-link{
83 .action-link{
84 margin-left: @padding;
84 margin-left: @padding;
85 padding-left: @padding;
85 padding-left: @padding;
86 border-left: @border-thickness solid @border-default-color;
86 border-left: @border-thickness solid @border-default-color;
87 }
87 }
88
88
89 input + .action-link, .action-link.first{
89 input + .action-link, .action-link.first{
90 border-left: none;
90 border-left: none;
91 }
91 }
92
92
93 .action-link.last{
93 .action-link.last{
94 margin-right: @padding;
94 margin-right: @padding;
95 padding-right: @padding;
95 padding-right: @padding;
96 }
96 }
97
97
98 .action-link.active,
98 .action-link.active,
99 .action-link.active a{
99 .action-link.active a{
100 color: @grey4;
100 color: @grey4;
101 }
101 }
102
102
103 .action-link.disabled {
103 .action-link.disabled {
104 color: @grey4;
104 color: @grey4;
105 cursor: inherit;
105 cursor: inherit;
106 }
106 }
107
107
108 .clipboard-action {
108 .clipboard-action {
109 cursor: pointer;
109 cursor: pointer;
110 }
110 }
111
111
112 ul.simple-list{
112 ul.simple-list{
113 list-style: none;
113 list-style: none;
114 margin: 0;
114 margin: 0;
115 padding: 0;
115 padding: 0;
116 }
116 }
117
117
118 .main-content {
118 .main-content {
119 padding-bottom: @pagepadding;
119 padding-bottom: @pagepadding;
120 }
120 }
121
121
122 .wide-mode-wrapper {
122 .wide-mode-wrapper {
123 max-width:4000px !important;
123 max-width:4000px !important;
124 }
124 }
125
125
126 .wrapper {
126 .wrapper {
127 position: relative;
127 position: relative;
128 max-width: @wrapper-maxwidth;
128 max-width: @wrapper-maxwidth;
129 margin: 0 auto;
129 margin: 0 auto;
130 }
130 }
131
131
132 #content {
132 #content {
133 clear: both;
133 clear: both;
134 padding: 0 @contentpadding;
134 padding: 0 @contentpadding;
135 }
135 }
136
136
137 .advanced-settings-fields{
137 .advanced-settings-fields{
138 input{
138 input{
139 margin-left: @textmargin;
139 margin-left: @textmargin;
140 margin-right: @padding/2;
140 margin-right: @padding/2;
141 }
141 }
142 }
142 }
143
143
144 .cs_files_title {
144 .cs_files_title {
145 margin: @pagepadding 0 0;
145 margin: @pagepadding 0 0;
146 }
146 }
147
147
148 input.inline[type="file"] {
148 input.inline[type="file"] {
149 display: inline;
149 display: inline;
150 }
150 }
151
151
152 .error_page {
152 .error_page {
153 margin: 10% auto;
153 margin: 10% auto;
154
154
155 h1 {
155 h1 {
156 color: @grey2;
156 color: @grey2;
157 }
157 }
158
158
159 .alert {
159 .alert {
160 margin: @padding 0;
160 margin: @padding 0;
161 }
161 }
162
162
163 .error-branding {
163 .error-branding {
164 font-family: @text-semibold;
164 font-family: @text-semibold;
165 color: @grey4;
165 color: @grey4;
166 }
166 }
167
167
168 .error_message {
168 .error_message {
169 font-family: @text-regular;
169 font-family: @text-regular;
170 }
170 }
171
171
172 .sidebar {
172 .sidebar {
173 min-height: 275px;
173 min-height: 275px;
174 margin: 0;
174 margin: 0;
175 padding: 0 0 @sidebarpadding @sidebarpadding;
175 padding: 0 0 @sidebarpadding @sidebarpadding;
176 border: none;
176 border: none;
177 }
177 }
178
178
179 .main-content {
179 .main-content {
180 position: relative;
180 position: relative;
181 margin: 0 @sidebarpadding @sidebarpadding;
181 margin: 0 @sidebarpadding @sidebarpadding;
182 padding: 0 0 0 @sidebarpadding;
182 padding: 0 0 0 @sidebarpadding;
183 border-left: @border-thickness solid @grey5;
183 border-left: @border-thickness solid @grey5;
184
184
185 @media (max-width:767px) {
185 @media (max-width:767px) {
186 clear: both;
186 clear: both;
187 width: 100%;
187 width: 100%;
188 margin: 0;
188 margin: 0;
189 border: none;
189 border: none;
190 }
190 }
191 }
191 }
192
192
193 .inner-column {
193 .inner-column {
194 float: left;
194 float: left;
195 width: 29.75%;
195 width: 29.75%;
196 min-height: 150px;
196 min-height: 150px;
197 margin: @sidebarpadding 2% 0 0;
197 margin: @sidebarpadding 2% 0 0;
198 padding: 0 2% 0 0;
198 padding: 0 2% 0 0;
199 border-right: @border-thickness solid @grey5;
199 border-right: @border-thickness solid @grey5;
200
200
201 @media (max-width:767px) {
201 @media (max-width:767px) {
202 clear: both;
202 clear: both;
203 width: 100%;
203 width: 100%;
204 border: none;
204 border: none;
205 }
205 }
206
206
207 ul {
207 ul {
208 padding-left: 1.25em;
208 padding-left: 1.25em;
209 }
209 }
210
210
211 &:last-child {
211 &:last-child {
212 margin: @sidebarpadding 0 0;
212 margin: @sidebarpadding 0 0;
213 border: none;
213 border: none;
214 }
214 }
215
215
216 h4 {
216 h4 {
217 margin: 0 0 @padding;
217 margin: 0 0 @padding;
218 font-family: @text-semibold;
218 font-family: @text-semibold;
219 }
219 }
220 }
220 }
221 }
221 }
222 .error-page-logo {
222 .error-page-logo {
223 width: 130px;
223 width: 130px;
224 height: 160px;
224 height: 160px;
225 }
225 }
226
226
227 // HEADER
227 // HEADER
228 .header {
228 .header {
229
229
230 // TODO: johbo: Fix login pages, so that they work without a min-height
230 // TODO: johbo: Fix login pages, so that they work without a min-height
231 // for the header and then remove the min-height. I chose a smaller value
231 // for the header and then remove the min-height. I chose a smaller value
232 // intentionally here to avoid rendering issues in the main navigation.
232 // intentionally here to avoid rendering issues in the main navigation.
233 min-height: 49px;
233 min-height: 49px;
234
234
235 position: relative;
235 position: relative;
236 vertical-align: bottom;
236 vertical-align: bottom;
237 padding: 0 @header-padding;
237 padding: 0 @header-padding;
238 background-color: @grey2;
238 background-color: @grey2;
239 color: @grey5;
239 color: @grey5;
240
240
241 .title {
241 .title {
242 overflow: visible;
242 overflow: visible;
243 }
243 }
244
244
245 &:before,
245 &:before,
246 &:after {
246 &:after {
247 content: "";
247 content: "";
248 clear: both;
248 clear: both;
249 width: 100%;
249 width: 100%;
250 }
250 }
251
251
252 // TODO: johbo: Avoids breaking "Repositories" chooser
252 // TODO: johbo: Avoids breaking "Repositories" chooser
253 .select2-container .select2-choice .select2-arrow {
253 .select2-container .select2-choice .select2-arrow {
254 display: none;
254 display: none;
255 }
255 }
256 }
256 }
257
257
258 #header-inner {
258 #header-inner {
259 &.title {
259 &.title {
260 margin: 0;
260 margin: 0;
261 }
261 }
262 &:before,
262 &:before,
263 &:after {
263 &:after {
264 content: "";
264 content: "";
265 clear: both;
265 clear: both;
266 }
266 }
267 }
267 }
268
268
269 // Gists
269 // Gists
270 #files_data {
270 #files_data {
271 clear: both; //for firefox
271 clear: both; //for firefox
272 }
272 }
273 #gistid {
273 #gistid {
274 margin-right: @padding;
274 margin-right: @padding;
275 }
275 }
276
276
277 // Global Settings Editor
277 // Global Settings Editor
278 .textarea.editor {
278 .textarea.editor {
279 float: left;
279 float: left;
280 position: relative;
280 position: relative;
281 max-width: @texteditor-width;
281 max-width: @texteditor-width;
282
282
283 select {
283 select {
284 position: absolute;
284 position: absolute;
285 top:10px;
285 top:10px;
286 right:0;
286 right:0;
287 }
287 }
288
288
289 .CodeMirror {
289 .CodeMirror {
290 margin: 0;
290 margin: 0;
291 }
291 }
292
292
293 .help-block {
293 .help-block {
294 margin: 0 0 @padding;
294 margin: 0 0 @padding;
295 padding:.5em;
295 padding:.5em;
296 background-color: @grey6;
296 background-color: @grey6;
297 &.pre-formatting {
297 &.pre-formatting {
298 white-space: pre;
298 white-space: pre;
299 }
299 }
300 }
300 }
301 }
301 }
302
302
303 ul.auth_plugins {
303 ul.auth_plugins {
304 margin: @padding 0 @padding @legend-width;
304 margin: @padding 0 @padding @legend-width;
305 padding: 0;
305 padding: 0;
306
306
307 li {
307 li {
308 margin-bottom: @padding;
308 margin-bottom: @padding;
309 line-height: 1em;
309 line-height: 1em;
310 list-style-type: none;
310 list-style-type: none;
311
311
312 .auth_buttons .btn {
312 .auth_buttons .btn {
313 margin-right: @padding;
313 margin-right: @padding;
314 }
314 }
315
315
316 &:before { content: none; }
316 &:before { content: none; }
317 }
317 }
318 }
318 }
319
319
320
320
321 // My Account PR list
321 // My Account PR list
322
322
323 #show_closed {
323 #show_closed {
324 margin: 0 1em 0 0;
324 margin: 0 1em 0 0;
325 }
325 }
326
326
327 .pullrequestlist {
327 .pullrequestlist {
328 .closed {
328 .closed {
329 background-color: @grey6;
329 background-color: @grey6;
330 }
330 }
331 .td-status {
331 .td-status {
332 padding-left: .5em;
332 padding-left: .5em;
333 }
333 }
334 .log-container .truncate {
334 .log-container .truncate {
335 height: 2.75em;
335 height: 2.75em;
336 white-space: pre-line;
336 white-space: pre-line;
337 }
337 }
338 table.rctable .user {
338 table.rctable .user {
339 padding-left: 0;
339 padding-left: 0;
340 }
340 }
341 table.rctable {
341 table.rctable {
342 td.td-description,
342 td.td-description,
343 .rc-user {
343 .rc-user {
344 min-width: auto;
344 min-width: auto;
345 }
345 }
346 }
346 }
347 }
347 }
348
348
349 // Pull Requests
349 // Pull Requests
350
350
351 .pullrequests_section_head {
351 .pullrequests_section_head {
352 display: block;
352 display: block;
353 clear: both;
353 clear: both;
354 margin: @padding 0;
354 margin: @padding 0;
355 font-family: @text-bold;
355 font-family: @text-bold;
356 }
356 }
357
357
358 .pr-origininfo, .pr-targetinfo {
358 .pr-origininfo, .pr-targetinfo {
359 position: relative;
359 position: relative;
360
360
361 .tag {
361 .tag {
362 display: inline-block;
362 display: inline-block;
363 margin: 0 1em .5em 0;
363 margin: 0 1em .5em 0;
364 }
364 }
365
365
366 .clone-url {
366 .clone-url {
367 display: inline-block;
367 display: inline-block;
368 margin: 0 0 .5em 0;
368 margin: 0 0 .5em 0;
369 padding: 0;
369 padding: 0;
370 line-height: 1.2em;
370 line-height: 1.2em;
371 }
371 }
372 }
372 }
373
373
374 .pr-mergeinfo {
374 .pr-mergeinfo {
375 min-width: 95% !important;
375 min-width: 95% !important;
376 padding: 0 !important;
376 padding: 0 !important;
377 border: 0;
377 border: 0;
378 }
378 }
379 .pr-mergeinfo-copy {
379 .pr-mergeinfo-copy {
380 padding: 0 0;
380 padding: 0 0;
381 }
381 }
382
382
383 .pr-pullinfo {
383 .pr-pullinfo {
384 min-width: 95% !important;
384 min-width: 95% !important;
385 padding: 0 !important;
385 padding: 0 !important;
386 border: 0;
386 border: 0;
387 }
387 }
388 .pr-pullinfo-copy {
388 .pr-pullinfo-copy {
389 padding: 0 0;
389 padding: 0 0;
390 }
390 }
391
391
392
392
393 #pr-title-input {
393 #pr-title-input {
394 width: 72%;
394 width: 72%;
395 font-size: 1em;
395 font-size: 1em;
396 font-family: @text-bold;
396 font-family: @text-bold;
397 margin: 0;
397 margin: 0;
398 padding: 0 0 0 @padding/4;
398 padding: 0 0 0 @padding/4;
399 line-height: 1.7em;
399 line-height: 1.7em;
400 color: @text-color;
400 color: @text-color;
401 letter-spacing: .02em;
401 letter-spacing: .02em;
402 }
402 }
403
403
404 #pullrequest_title {
404 #pullrequest_title {
405 width: 100%;
405 width: 100%;
406 box-sizing: border-box;
406 box-sizing: border-box;
407 }
407 }
408
408
409 #pr_open_message {
409 #pr_open_message {
410 border: @border-thickness solid #fff;
410 border: @border-thickness solid #fff;
411 border-radius: @border-radius;
411 border-radius: @border-radius;
412 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
412 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
413 text-align: left;
413 text-align: left;
414 overflow: hidden;
414 overflow: hidden;
415 }
415 }
416
416
417 .pr-submit-button {
417 .pr-submit-button {
418 float: right;
418 float: right;
419 margin: 0 0 0 5px;
419 margin: 0 0 0 5px;
420 }
420 }
421
421
422 .pr-spacing-container {
422 .pr-spacing-container {
423 padding: 20px;
423 padding: 20px;
424 clear: both
424 clear: both
425 }
425 }
426
426
427 #pr-description-input {
427 #pr-description-input {
428 margin-bottom: 0;
428 margin-bottom: 0;
429 }
429 }
430
430
431 .pr-description-label {
431 .pr-description-label {
432 vertical-align: top;
432 vertical-align: top;
433 }
433 }
434
434
435 .perms_section_head {
435 .perms_section_head {
436 min-width: 625px;
436 min-width: 625px;
437
437
438 h2 {
438 h2 {
439 margin-bottom: 0;
439 margin-bottom: 0;
440 }
440 }
441
441
442 .label-checkbox {
442 .label-checkbox {
443 float: left;
443 float: left;
444 }
444 }
445
445
446 &.field {
446 &.field {
447 margin: @space 0 @padding;
447 margin: @space 0 @padding;
448 }
448 }
449
449
450 &:first-child.field {
450 &:first-child.field {
451 margin-top: 0;
451 margin-top: 0;
452
452
453 .label {
453 .label {
454 margin-top: 0;
454 margin-top: 0;
455 padding-top: 0;
455 padding-top: 0;
456 }
456 }
457
457
458 .radios {
458 .radios {
459 padding-top: 0;
459 padding-top: 0;
460 }
460 }
461 }
461 }
462
462
463 .radios {
463 .radios {
464 position: relative;
464 position: relative;
465 width: 405px;
465 width: 405px;
466 }
466 }
467 }
467 }
468
468
469 //--- MODULES ------------------//
469 //--- MODULES ------------------//
470
470
471
471
472 // Server Announcement
472 // Server Announcement
473 #server-announcement {
473 #server-announcement {
474 width: 95%;
474 width: 95%;
475 margin: @padding auto;
475 margin: @padding auto;
476 padding: @padding;
476 padding: @padding;
477 border-width: 2px;
477 border-width: 2px;
478 border-style: solid;
478 border-style: solid;
479 .border-radius(2px);
479 .border-radius(2px);
480 font-family: @text-bold;
480 font-family: @text-bold;
481
481
482 &.info { border-color: @alert4; background-color: @alert4-inner; }
482 &.info { border-color: @alert4; background-color: @alert4-inner; }
483 &.warning { border-color: @alert3; background-color: @alert3-inner; }
483 &.warning { border-color: @alert3; background-color: @alert3-inner; }
484 &.error { border-color: @alert2; background-color: @alert2-inner; }
484 &.error { border-color: @alert2; background-color: @alert2-inner; }
485 &.success { border-color: @alert1; background-color: @alert1-inner; }
485 &.success { border-color: @alert1; background-color: @alert1-inner; }
486 &.neutral { border-color: @grey3; background-color: @grey6; }
486 &.neutral { border-color: @grey3; background-color: @grey6; }
487 }
487 }
488
488
489 // Fixed Sidebar Column
489 // Fixed Sidebar Column
490 .sidebar-col-wrapper {
490 .sidebar-col-wrapper {
491 padding-left: @sidebar-all-width;
491 padding-left: @sidebar-all-width;
492
492
493 .sidebar {
493 .sidebar {
494 width: @sidebar-width;
494 width: @sidebar-width;
495 margin-left: -@sidebar-all-width;
495 margin-left: -@sidebar-all-width;
496 }
496 }
497 }
497 }
498
498
499 .sidebar-col-wrapper.scw-small {
499 .sidebar-col-wrapper.scw-small {
500 padding-left: @sidebar-small-all-width;
500 padding-left: @sidebar-small-all-width;
501
501
502 .sidebar {
502 .sidebar {
503 width: @sidebar-small-width;
503 width: @sidebar-small-width;
504 margin-left: -@sidebar-small-all-width;
504 margin-left: -@sidebar-small-all-width;
505 }
505 }
506 }
506 }
507
507
508
508
509 // FOOTER
509 // FOOTER
510 #footer {
510 #footer {
511 padding: 0;
511 padding: 0;
512 text-align: center;
512 text-align: center;
513 vertical-align: middle;
513 vertical-align: middle;
514 color: @grey2;
514 color: @grey2;
515 background-color: @grey6;
515 background-color: @grey6;
516
516
517 p {
517 p {
518 margin: 0;
518 margin: 0;
519 padding: 1em;
519 padding: 1em;
520 line-height: 1em;
520 line-height: 1em;
521 }
521 }
522
522
523 .server-instance { //server instance
523 .server-instance { //server instance
524 display: none;
524 display: none;
525 }
525 }
526
526
527 .title {
527 .title {
528 float: none;
528 float: none;
529 margin: 0 auto;
529 margin: 0 auto;
530 }
530 }
531 }
531 }
532
532
533 button.close {
533 button.close {
534 padding: 0;
534 padding: 0;
535 cursor: pointer;
535 cursor: pointer;
536 background: transparent;
536 background: transparent;
537 border: 0;
537 border: 0;
538 .box-shadow(none);
538 .box-shadow(none);
539 -webkit-appearance: none;
539 -webkit-appearance: none;
540 }
540 }
541
541
542 .close {
542 .close {
543 float: right;
543 float: right;
544 font-size: 21px;
544 font-size: 21px;
545 font-family: @text-bootstrap;
545 font-family: @text-bootstrap;
546 line-height: 1em;
546 line-height: 1em;
547 font-weight: bold;
547 font-weight: bold;
548 color: @grey2;
548 color: @grey2;
549
549
550 &:hover,
550 &:hover,
551 &:focus {
551 &:focus {
552 color: @grey1;
552 color: @grey1;
553 text-decoration: none;
553 text-decoration: none;
554 cursor: pointer;
554 cursor: pointer;
555 }
555 }
556 }
556 }
557
557
558 // GRID
558 // GRID
559 .sorting,
559 .sorting,
560 .sorting_desc,
560 .sorting_desc,
561 .sorting_asc {
561 .sorting_asc {
562 cursor: pointer;
562 cursor: pointer;
563 }
563 }
564 .sorting_desc:after {
564 .sorting_desc:after {
565 content: "\00A0\25B2";
565 content: "\00A0\25B2";
566 font-size: .75em;
566 font-size: .75em;
567 }
567 }
568 .sorting_asc:after {
568 .sorting_asc:after {
569 content: "\00A0\25BC";
569 content: "\00A0\25BC";
570 font-size: .68em;
570 font-size: .68em;
571 }
571 }
572
572
573
573
574 .user_auth_tokens {
574 .user_auth_tokens {
575
575
576 &.truncate {
576 &.truncate {
577 white-space: nowrap;
577 white-space: nowrap;
578 overflow: hidden;
578 overflow: hidden;
579 text-overflow: ellipsis;
579 text-overflow: ellipsis;
580 }
580 }
581
581
582 .fields .field .input {
582 .fields .field .input {
583 margin: 0;
583 margin: 0;
584 }
584 }
585
585
586 input#description {
586 input#description {
587 width: 100px;
587 width: 100px;
588 margin: 0;
588 margin: 0;
589 }
589 }
590
590
591 .drop-menu {
591 .drop-menu {
592 // TODO: johbo: Remove this, should work out of the box when
592 // TODO: johbo: Remove this, should work out of the box when
593 // having multiple inputs inline
593 // having multiple inputs inline
594 margin: 0 0 0 5px;
594 margin: 0 0 0 5px;
595 }
595 }
596 }
596 }
597 #user_list_table {
597 #user_list_table {
598 .closed {
598 .closed {
599 background-color: @grey6;
599 background-color: @grey6;
600 }
600 }
601 }
601 }
602
602
603
603
604 input {
604 input {
605 &.disabled {
605 &.disabled {
606 opacity: .5;
606 opacity: .5;
607 }
607 }
608 }
608 }
609
609
610 // remove extra padding in firefox
610 // remove extra padding in firefox
611 input::-moz-focus-inner { border:0; padding:0 }
611 input::-moz-focus-inner { border:0; padding:0 }
612
612
613 .adjacent input {
613 .adjacent input {
614 margin-bottom: @padding;
614 margin-bottom: @padding;
615 }
615 }
616
616
617 .permissions_boxes {
617 .permissions_boxes {
618 display: block;
618 display: block;
619 }
619 }
620
620
621 //TODO: lisa: this should be in tables
621 //TODO: lisa: this should be in tables
622 .show_more_col {
622 .show_more_col {
623 width: 20px;
623 width: 20px;
624 }
624 }
625
625
626 //FORMS
626 //FORMS
627
627
628 .medium-inline,
628 .medium-inline,
629 input#description.medium-inline {
629 input#description.medium-inline {
630 display: inline;
630 display: inline;
631 width: @medium-inline-input-width;
631 width: @medium-inline-input-width;
632 min-width: 100px;
632 min-width: 100px;
633 }
633 }
634
634
635 select {
635 select {
636 //reset
636 //reset
637 -webkit-appearance: none;
637 -webkit-appearance: none;
638 -moz-appearance: none;
638 -moz-appearance: none;
639
639
640 display: inline-block;
640 display: inline-block;
641 height: 28px;
641 height: 28px;
642 width: auto;
642 width: auto;
643 margin: 0 @padding @padding 0;
643 margin: 0 @padding @padding 0;
644 padding: 0 18px 0 8px;
644 padding: 0 18px 0 8px;
645 line-height:1em;
645 line-height:1em;
646 font-size: @basefontsize;
646 font-size: @basefontsize;
647 border: @border-thickness solid @rcblue;
647 border: @border-thickness solid @rcblue;
648 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
648 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
649 color: @rcblue;
649 color: @rcblue;
650
650
651 &:after {
651 &:after {
652 content: "\00A0\25BE";
652 content: "\00A0\25BE";
653 }
653 }
654
654
655 &:focus {
655 &:focus {
656 outline: none;
656 outline: none;
657 }
657 }
658 }
658 }
659
659
660 option {
660 option {
661 &:focus {
661 &:focus {
662 outline: none;
662 outline: none;
663 }
663 }
664 }
664 }
665
665
666 input,
666 input,
667 textarea {
667 textarea {
668 padding: @input-padding;
668 padding: @input-padding;
669 border: @input-border-thickness solid @border-highlight-color;
669 border: @input-border-thickness solid @border-highlight-color;
670 .border-radius (@border-radius);
670 .border-radius (@border-radius);
671 font-family: @text-light;
671 font-family: @text-light;
672 font-size: @basefontsize;
672 font-size: @basefontsize;
673
673
674 &.input-sm {
674 &.input-sm {
675 padding: 5px;
675 padding: 5px;
676 }
676 }
677
677
678 &#description {
678 &#description {
679 min-width: @input-description-minwidth;
679 min-width: @input-description-minwidth;
680 min-height: 1em;
680 min-height: 1em;
681 padding: 10px;
681 padding: 10px;
682 }
682 }
683 }
683 }
684
684
685 .field-sm {
685 .field-sm {
686 input,
686 input,
687 textarea {
687 textarea {
688 padding: 5px;
688 padding: 5px;
689 }
689 }
690 }
690 }
691
691
692 textarea {
692 textarea {
693 display: block;
693 display: block;
694 clear: both;
694 clear: both;
695 width: 100%;
695 width: 100%;
696 min-height: 100px;
696 min-height: 100px;
697 margin-bottom: @padding;
697 margin-bottom: @padding;
698 .box-sizing(border-box);
698 .box-sizing(border-box);
699 overflow: auto;
699 overflow: auto;
700 }
700 }
701
701
702 label {
702 label {
703 font-family: @text-light;
703 font-family: @text-light;
704 }
704 }
705
705
706 // GRAVATARS
706 // GRAVATARS
707 // centers gravatar on username to the right
707 // centers gravatar on username to the right
708
708
709 .gravatar {
709 .gravatar {
710 display: inline;
710 display: inline;
711 min-width: 16px;
711 min-width: 16px;
712 min-height: 16px;
712 min-height: 16px;
713 margin: -5px 0;
713 margin: -5px 0;
714 padding: 0;
714 padding: 0;
715 line-height: 1em;
715 line-height: 1em;
716 border: 1px solid @grey4;
716 border: 1px solid @grey4;
717 box-sizing: content-box;
717 box-sizing: content-box;
718
718
719 &.gravatar-large {
719 &.gravatar-large {
720 margin: -0.5em .25em -0.5em 0;
720 margin: -0.5em .25em -0.5em 0;
721 }
721 }
722
722
723 & + .user {
723 & + .user {
724 display: inline;
724 display: inline;
725 margin: 0;
725 margin: 0;
726 padding: 0 0 0 .17em;
726 padding: 0 0 0 .17em;
727 line-height: 1em;
727 line-height: 1em;
728 }
728 }
729 }
729 }
730
730
731 .user-inline-data {
731 .user-inline-data {
732 display: inline-block;
732 display: inline-block;
733 float: left;
733 float: left;
734 padding-left: .5em;
734 padding-left: .5em;
735 line-height: 1.3em;
735 line-height: 1.3em;
736 }
736 }
737
737
738 .rc-user { // gravatar + user wrapper
738 .rc-user { // gravatar + user wrapper
739 float: left;
739 float: left;
740 position: relative;
740 position: relative;
741 min-width: 100px;
741 min-width: 100px;
742 max-width: 200px;
742 max-width: 200px;
743 min-height: (@gravatar-size + @border-thickness * 2); // account for border
743 min-height: (@gravatar-size + @border-thickness * 2); // account for border
744 display: block;
744 display: block;
745 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
745 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
746
746
747
747
748 .gravatar {
748 .gravatar {
749 display: block;
749 display: block;
750 position: absolute;
750 position: absolute;
751 top: 0;
751 top: 0;
752 left: 0;
752 left: 0;
753 min-width: @gravatar-size;
753 min-width: @gravatar-size;
754 min-height: @gravatar-size;
754 min-height: @gravatar-size;
755 margin: 0;
755 margin: 0;
756 }
756 }
757
757
758 .user {
758 .user {
759 display: block;
759 display: block;
760 max-width: 175px;
760 max-width: 175px;
761 padding-top: 2px;
761 padding-top: 2px;
762 overflow: hidden;
762 overflow: hidden;
763 text-overflow: ellipsis;
763 text-overflow: ellipsis;
764 }
764 }
765 }
765 }
766
766
767 .gist-gravatar,
767 .gist-gravatar,
768 .journal_container {
768 .journal_container {
769 .gravatar-large {
769 .gravatar-large {
770 margin: 0 .5em -10px 0;
770 margin: 0 .5em -10px 0;
771 }
771 }
772 }
772 }
773
773
774
774
775 // ADMIN SETTINGS
775 // ADMIN SETTINGS
776
776
777 // Tag Patterns
777 // Tag Patterns
778 .tag_patterns {
778 .tag_patterns {
779 .tag_input {
779 .tag_input {
780 margin-bottom: @padding;
780 margin-bottom: @padding;
781 }
781 }
782 }
782 }
783
783
784 .locked_input {
784 .locked_input {
785 position: relative;
785 position: relative;
786
786
787 input {
787 input {
788 display: inline;
788 display: inline;
789 margin: 3px 5px 0px 0px;
789 margin: 3px 5px 0px 0px;
790 }
790 }
791
791
792 br {
792 br {
793 display: none;
793 display: none;
794 }
794 }
795
795
796 .error-message {
796 .error-message {
797 float: left;
797 float: left;
798 width: 100%;
798 width: 100%;
799 }
799 }
800
800
801 .lock_input_button {
801 .lock_input_button {
802 display: inline;
802 display: inline;
803 }
803 }
804
804
805 .help-block {
805 .help-block {
806 clear: both;
806 clear: both;
807 }
807 }
808 }
808 }
809
809
810 // Notifications
810 // Notifications
811
811
812 .notifications_buttons {
812 .notifications_buttons {
813 margin: 0 0 @space 0;
813 margin: 0 0 @space 0;
814 padding: 0;
814 padding: 0;
815
815
816 .btn {
816 .btn {
817 display: inline-block;
817 display: inline-block;
818 }
818 }
819 }
819 }
820
820
821 .notification-list {
821 .notification-list {
822
822
823 div {
823 div {
824 display: inline-block;
824 display: inline-block;
825 vertical-align: middle;
825 vertical-align: middle;
826 }
826 }
827
827
828 .container {
828 .container {
829 display: block;
829 display: block;
830 margin: 0 0 @padding 0;
830 margin: 0 0 @padding 0;
831 }
831 }
832
832
833 .delete-notifications {
833 .delete-notifications {
834 margin-left: @padding;
834 margin-left: @padding;
835 text-align: right;
835 text-align: right;
836 cursor: pointer;
836 cursor: pointer;
837 }
837 }
838
838
839 .read-notifications {
839 .read-notifications {
840 margin-left: @padding/2;
840 margin-left: @padding/2;
841 text-align: right;
841 text-align: right;
842 width: 35px;
842 width: 35px;
843 cursor: pointer;
843 cursor: pointer;
844 }
844 }
845
845
846 .icon-minus-sign {
846 .icon-minus-sign {
847 color: @alert2;
847 color: @alert2;
848 }
848 }
849
849
850 .icon-ok-sign {
850 .icon-ok-sign {
851 color: @alert1;
851 color: @alert1;
852 }
852 }
853 }
853 }
854
854
855 .user_settings {
855 .user_settings {
856 float: left;
856 float: left;
857 clear: both;
857 clear: both;
858 display: block;
858 display: block;
859 width: 100%;
859 width: 100%;
860
860
861 .gravatar_box {
861 .gravatar_box {
862 margin-bottom: @padding;
862 margin-bottom: @padding;
863
863
864 &:after {
864 &:after {
865 content: " ";
865 content: " ";
866 clear: both;
866 clear: both;
867 width: 100%;
867 width: 100%;
868 }
868 }
869 }
869 }
870
870
871 .fields .field {
871 .fields .field {
872 clear: both;
872 clear: both;
873 }
873 }
874 }
874 }
875
875
876 .advanced_settings {
876 .advanced_settings {
877 margin-bottom: @space;
877 margin-bottom: @space;
878
878
879 .help-block {
879 .help-block {
880 margin-left: 0;
880 margin-left: 0;
881 }
881 }
882
882
883 button + .help-block {
883 button + .help-block {
884 margin-top: @padding;
884 margin-top: @padding;
885 }
885 }
886 }
886 }
887
887
888 // admin settings radio buttons and labels
888 // admin settings radio buttons and labels
889 .label-2 {
889 .label-2 {
890 float: left;
890 float: left;
891 width: @label2-width;
891 width: @label2-width;
892
892
893 label {
893 label {
894 color: @grey1;
894 color: @grey1;
895 }
895 }
896 }
896 }
897 .checkboxes {
897 .checkboxes {
898 float: left;
898 float: left;
899 width: @checkboxes-width;
899 width: @checkboxes-width;
900 margin-bottom: @padding;
900 margin-bottom: @padding;
901
901
902 .checkbox {
902 .checkbox {
903 width: 100%;
903 width: 100%;
904
904
905 label {
905 label {
906 margin: 0;
906 margin: 0;
907 padding: 0;
907 padding: 0;
908 }
908 }
909 }
909 }
910
910
911 .checkbox + .checkbox {
911 .checkbox + .checkbox {
912 display: inline-block;
912 display: inline-block;
913 }
913 }
914
914
915 label {
915 label {
916 margin-right: 1em;
916 margin-right: 1em;
917 }
917 }
918 }
918 }
919
919
920 // CHANGELOG
920 // CHANGELOG
921 .container_header {
921 .container_header {
922 float: left;
922 float: left;
923 display: block;
923 display: block;
924 width: 100%;
924 width: 100%;
925 margin: @padding 0 @padding;
925 margin: @padding 0 @padding;
926
926
927 #filter_changelog {
927 #filter_changelog {
928 float: left;
928 float: left;
929 margin-right: @padding;
929 margin-right: @padding;
930 }
930 }
931
931
932 .breadcrumbs_light {
932 .breadcrumbs_light {
933 display: inline-block;
933 display: inline-block;
934 }
934 }
935 }
935 }
936
936
937 .info_box {
937 .info_box {
938 float: right;
938 float: right;
939 }
939 }
940
940
941
941
942 #graph_nodes {
942 #graph_nodes {
943 padding-top: 43px;
943 padding-top: 43px;
944 }
944 }
945
945
946 #graph_content{
946 #graph_content{
947
947
948 // adjust for table headers so that graph renders properly
948 // adjust for table headers so that graph renders properly
949 // #graph_nodes padding - table cell padding
949 // #graph_nodes padding - table cell padding
950 padding-top: (@space - (@basefontsize * 2.4));
950 padding-top: (@space - (@basefontsize * 2.4));
951
951
952 &.graph_full_width {
952 &.graph_full_width {
953 width: 100%;
953 width: 100%;
954 max-width: 100%;
954 max-width: 100%;
955 }
955 }
956 }
956 }
957
957
958 #graph {
958 #graph {
959 .flag_status {
959 .flag_status {
960 margin: 0;
960 margin: 0;
961 }
961 }
962
962
963 .pagination-left {
963 .pagination-left {
964 float: left;
964 float: left;
965 clear: both;
965 clear: both;
966 }
966 }
967
967
968 .log-container {
968 .log-container {
969 max-width: 345px;
969 max-width: 345px;
970
970
971 .message{
971 .message{
972 max-width: 340px;
972 max-width: 340px;
973 }
973 }
974 }
974 }
975
975
976 .graph-col-wrapper {
976 .graph-col-wrapper {
977 padding-left: 110px;
977 padding-left: 110px;
978
978
979 #graph_nodes {
979 #graph_nodes {
980 width: 100px;
980 width: 100px;
981 margin-left: -110px;
981 margin-left: -110px;
982 float: left;
982 float: left;
983 clear: left;
983 clear: left;
984 }
984 }
985 }
985 }
986
986
987 .load-more-commits {
987 .load-more-commits {
988 text-align: center;
988 text-align: center;
989 }
989 }
990 .load-more-commits:hover {
990 .load-more-commits:hover {
991 background-color: @grey7;
991 background-color: @grey7;
992 }
992 }
993 .load-more-commits {
993 .load-more-commits {
994 a {
994 a {
995 display: block;
995 display: block;
996 }
996 }
997 }
997 }
998 }
998 }
999
999
1000 #filter_changelog {
1000 #filter_changelog {
1001 float: left;
1001 float: left;
1002 }
1002 }
1003
1003
1004
1004
1005 //--- THEME ------------------//
1005 //--- THEME ------------------//
1006
1006
1007 #logo {
1007 #logo {
1008 float: left;
1008 float: left;
1009 margin: 9px 0 0 0;
1009 margin: 9px 0 0 0;
1010
1010
1011 .header {
1011 .header {
1012 background-color: transparent;
1012 background-color: transparent;
1013 }
1013 }
1014
1014
1015 a {
1015 a {
1016 display: inline-block;
1016 display: inline-block;
1017 }
1017 }
1018
1018
1019 img {
1019 img {
1020 height:30px;
1020 height:30px;
1021 }
1021 }
1022 }
1022 }
1023
1023
1024 .logo-wrapper {
1024 .logo-wrapper {
1025 float:left;
1025 float:left;
1026 }
1026 }
1027
1027
1028 .branding{
1028 .branding{
1029 float: left;
1029 float: left;
1030 padding: 9px 2px;
1030 padding: 9px 2px;
1031 line-height: 1em;
1031 line-height: 1em;
1032 font-size: @navigation-fontsize;
1032 font-size: @navigation-fontsize;
1033 }
1033 }
1034
1034
1035 img {
1035 img {
1036 border: none;
1036 border: none;
1037 outline: none;
1037 outline: none;
1038 }
1038 }
1039 user-profile-header
1039 user-profile-header
1040 label {
1040 label {
1041
1041
1042 input[type="checkbox"] {
1042 input[type="checkbox"] {
1043 margin-right: 1em;
1043 margin-right: 1em;
1044 }
1044 }
1045 input[type="radio"] {
1045 input[type="radio"] {
1046 margin-right: 1em;
1046 margin-right: 1em;
1047 }
1047 }
1048 }
1048 }
1049
1049
1050 .flag_status {
1050 .flag_status {
1051 margin: 2px 8px 6px 2px;
1051 margin: 2px 8px 6px 2px;
1052 &.under_review {
1052 &.under_review {
1053 .circle(5px, @alert3);
1053 .circle(5px, @alert3);
1054 }
1054 }
1055 &.approved {
1055 &.approved {
1056 .circle(5px, @alert1);
1056 .circle(5px, @alert1);
1057 }
1057 }
1058 &.rejected,
1058 &.rejected,
1059 &.forced_closed{
1059 &.forced_closed{
1060 .circle(5px, @alert2);
1060 .circle(5px, @alert2);
1061 }
1061 }
1062 &.not_reviewed {
1062 &.not_reviewed {
1063 .circle(5px, @grey5);
1063 .circle(5px, @grey5);
1064 }
1064 }
1065 }
1065 }
1066
1066
1067 .flag_status_comment_box {
1067 .flag_status_comment_box {
1068 margin: 5px 6px 0px 2px;
1068 margin: 5px 6px 0px 2px;
1069 }
1069 }
1070 .test_pattern_preview {
1070 .test_pattern_preview {
1071 margin: @space 0;
1071 margin: @space 0;
1072
1072
1073 p {
1073 p {
1074 margin-bottom: 0;
1074 margin-bottom: 0;
1075 border-bottom: @border-thickness solid @border-default-color;
1075 border-bottom: @border-thickness solid @border-default-color;
1076 color: @grey3;
1076 color: @grey3;
1077 }
1077 }
1078
1078
1079 .btn {
1079 .btn {
1080 margin-bottom: @padding;
1080 margin-bottom: @padding;
1081 }
1081 }
1082 }
1082 }
1083 #test_pattern_result {
1083 #test_pattern_result {
1084 display: none;
1084 display: none;
1085 &:extend(pre);
1085 &:extend(pre);
1086 padding: .9em;
1086 padding: .9em;
1087 color: @grey3;
1087 color: @grey3;
1088 background-color: @grey7;
1088 background-color: @grey7;
1089 border-right: @border-thickness solid @border-default-color;
1089 border-right: @border-thickness solid @border-default-color;
1090 border-bottom: @border-thickness solid @border-default-color;
1090 border-bottom: @border-thickness solid @border-default-color;
1091 border-left: @border-thickness solid @border-default-color;
1091 border-left: @border-thickness solid @border-default-color;
1092 }
1092 }
1093
1093
1094 #repo_vcs_settings {
1094 #repo_vcs_settings {
1095 #inherit_overlay_vcs_default {
1095 #inherit_overlay_vcs_default {
1096 display: none;
1096 display: none;
1097 }
1097 }
1098 #inherit_overlay_vcs_custom {
1098 #inherit_overlay_vcs_custom {
1099 display: custom;
1099 display: custom;
1100 }
1100 }
1101 &.inherited {
1101 &.inherited {
1102 #inherit_overlay_vcs_default {
1102 #inherit_overlay_vcs_default {
1103 display: block;
1103 display: block;
1104 }
1104 }
1105 #inherit_overlay_vcs_custom {
1105 #inherit_overlay_vcs_custom {
1106 display: none;
1106 display: none;
1107 }
1107 }
1108 }
1108 }
1109 }
1109 }
1110
1110
1111 .issue-tracker-link {
1111 .issue-tracker-link {
1112 color: @rcblue;
1112 color: @rcblue;
1113 }
1113 }
1114
1114
1115 // Issue Tracker Table Show/Hide
1115 // Issue Tracker Table Show/Hide
1116 #repo_issue_tracker {
1116 #repo_issue_tracker {
1117 #inherit_overlay {
1117 #inherit_overlay {
1118 display: none;
1118 display: none;
1119 }
1119 }
1120 #custom_overlay {
1120 #custom_overlay {
1121 display: custom;
1121 display: custom;
1122 }
1122 }
1123 &.inherited {
1123 &.inherited {
1124 #inherit_overlay {
1124 #inherit_overlay {
1125 display: block;
1125 display: block;
1126 }
1126 }
1127 #custom_overlay {
1127 #custom_overlay {
1128 display: none;
1128 display: none;
1129 }
1129 }
1130 }
1130 }
1131 }
1131 }
1132 table.issuetracker {
1132 table.issuetracker {
1133 &.readonly {
1133 &.readonly {
1134 tr, td {
1134 tr, td {
1135 color: @grey3;
1135 color: @grey3;
1136 }
1136 }
1137 }
1137 }
1138 .edit {
1138 .edit {
1139 display: none;
1139 display: none;
1140 }
1140 }
1141 .editopen {
1141 .editopen {
1142 .edit {
1142 .edit {
1143 display: inline;
1143 display: inline;
1144 }
1144 }
1145 .entry {
1145 .entry {
1146 display: none;
1146 display: none;
1147 }
1147 }
1148 }
1148 }
1149 tr td.td-action {
1149 tr td.td-action {
1150 min-width: 117px;
1150 min-width: 117px;
1151 }
1151 }
1152 td input {
1152 td input {
1153 max-width: none;
1153 max-width: none;
1154 min-width: 30px;
1154 min-width: 30px;
1155 width: 80%;
1155 width: 80%;
1156 }
1156 }
1157 .issuetracker_pref input {
1157 .issuetracker_pref input {
1158 width: 40%;
1158 width: 40%;
1159 }
1159 }
1160 input.edit_issuetracker_update {
1160 input.edit_issuetracker_update {
1161 margin-right: 0;
1161 margin-right: 0;
1162 width: auto;
1162 width: auto;
1163 }
1163 }
1164 }
1164 }
1165
1165
1166 table.integrations {
1166 table.integrations {
1167 .td-icon {
1167 .td-icon {
1168 width: 20px;
1168 width: 20px;
1169 .integration-icon {
1169 .integration-icon {
1170 height: 20px;
1170 height: 20px;
1171 width: 20px;
1171 width: 20px;
1172 }
1172 }
1173 }
1173 }
1174 }
1174 }
1175
1175
1176 .integrations {
1176 .integrations {
1177 a.integration-box {
1177 a.integration-box {
1178 color: @text-color;
1178 color: @text-color;
1179 &:hover {
1179 &:hover {
1180 .panel {
1180 .panel {
1181 background: #fbfbfb;
1181 background: #fbfbfb;
1182 }
1182 }
1183 }
1183 }
1184 .integration-icon {
1184 .integration-icon {
1185 width: 30px;
1185 width: 30px;
1186 height: 30px;
1186 height: 30px;
1187 margin-right: 20px;
1187 margin-right: 20px;
1188 float: left;
1188 float: left;
1189 }
1189 }
1190
1190
1191 .panel-body {
1191 .panel-body {
1192 padding: 10px;
1192 padding: 10px;
1193 }
1193 }
1194 .panel {
1194 .panel {
1195 margin-bottom: 10px;
1195 margin-bottom: 10px;
1196 }
1196 }
1197 h2 {
1197 h2 {
1198 display: inline-block;
1198 display: inline-block;
1199 margin: 0;
1199 margin: 0;
1200 min-width: 140px;
1200 min-width: 140px;
1201 }
1201 }
1202 }
1202 }
1203 a.integration-box.dummy-integration {
1203 a.integration-box.dummy-integration {
1204 color: @grey4
1204 color: @grey4
1205 }
1205 }
1206 }
1206 }
1207
1207
1208 //Permissions Settings
1208 //Permissions Settings
1209 #add_perm {
1209 #add_perm {
1210 margin: 0 0 @padding;
1210 margin: 0 0 @padding;
1211 cursor: pointer;
1211 cursor: pointer;
1212 }
1212 }
1213
1213
1214 .perm_ac {
1214 .perm_ac {
1215 input {
1215 input {
1216 width: 95%;
1216 width: 95%;
1217 }
1217 }
1218 }
1218 }
1219
1219
1220 .autocomplete-suggestions {
1220 .autocomplete-suggestions {
1221 width: auto !important; // overrides autocomplete.js
1221 width: auto !important; // overrides autocomplete.js
1222 margin: 0;
1222 margin: 0;
1223 border: @border-thickness solid @rcblue;
1223 border: @border-thickness solid @rcblue;
1224 border-radius: @border-radius;
1224 border-radius: @border-radius;
1225 color: @rcblue;
1225 color: @rcblue;
1226 background-color: white;
1226 background-color: white;
1227 }
1227 }
1228 .autocomplete-selected {
1228 .autocomplete-selected {
1229 background: #F0F0F0;
1229 background: #F0F0F0;
1230 }
1230 }
1231 .ac-container-wrap {
1231 .ac-container-wrap {
1232 margin: 0;
1232 margin: 0;
1233 padding: 8px;
1233 padding: 8px;
1234 border-bottom: @border-thickness solid @rclightblue;
1234 border-bottom: @border-thickness solid @rclightblue;
1235 list-style-type: none;
1235 list-style-type: none;
1236 cursor: pointer;
1236 cursor: pointer;
1237
1237
1238 &:hover {
1238 &:hover {
1239 background-color: @rclightblue;
1239 background-color: @rclightblue;
1240 }
1240 }
1241
1241
1242 img {
1242 img {
1243 height: @gravatar-size;
1243 height: @gravatar-size;
1244 width: @gravatar-size;
1244 width: @gravatar-size;
1245 margin-right: 1em;
1245 margin-right: 1em;
1246 }
1246 }
1247
1247
1248 strong {
1248 strong {
1249 font-weight: normal;
1249 font-weight: normal;
1250 }
1250 }
1251 }
1251 }
1252
1252
1253 // Settings Dropdown
1253 // Settings Dropdown
1254 .user-menu .container {
1254 .user-menu .container {
1255 padding: 0 4px;
1255 padding: 0 4px;
1256 margin: 0;
1256 margin: 0;
1257 }
1257 }
1258
1258
1259 .user-menu .gravatar {
1259 .user-menu .gravatar {
1260 cursor: pointer;
1260 cursor: pointer;
1261 }
1261 }
1262
1262
1263 .codeblock {
1263 .codeblock {
1264 margin-bottom: @padding;
1264 margin-bottom: @padding;
1265 clear: both;
1265 clear: both;
1266
1266
1267 .stats{
1267 .stats{
1268 overflow: hidden;
1268 overflow: hidden;
1269 }
1269 }
1270
1270
1271 .message{
1271 .message{
1272 textarea{
1272 textarea{
1273 margin: 0;
1273 margin: 0;
1274 }
1274 }
1275 }
1275 }
1276
1276
1277 .code-header {
1277 .code-header {
1278 .stats {
1278 .stats {
1279 line-height: 2em;
1279 line-height: 2em;
1280
1280
1281 .revision_id {
1281 .revision_id {
1282 margin-left: 0;
1282 margin-left: 0;
1283 }
1283 }
1284 .buttons {
1284 .buttons {
1285 padding-right: 0;
1285 padding-right: 0;
1286 }
1286 }
1287 }
1287 }
1288
1288
1289 .item{
1289 .item{
1290 margin-right: 0.5em;
1290 margin-right: 0.5em;
1291 }
1291 }
1292 }
1292 }
1293
1293
1294 #editor_container{
1294 #editor_container{
1295 position: relative;
1295 position: relative;
1296 margin: @padding;
1296 margin: @padding;
1297 }
1297 }
1298 }
1298 }
1299
1299
1300 #file_history_container {
1300 #file_history_container {
1301 display: none;
1301 display: none;
1302 }
1302 }
1303
1303
1304 .file-history-inner {
1304 .file-history-inner {
1305 margin-bottom: 10px;
1305 margin-bottom: 10px;
1306 }
1306 }
1307
1307
1308 // Pull Requests
1308 // Pull Requests
1309 .summary-details {
1309 .summary-details {
1310 width: 72%;
1310 width: 72%;
1311 }
1311 }
1312 .pr-summary {
1312 .pr-summary {
1313 border-bottom: @border-thickness solid @grey5;
1313 border-bottom: @border-thickness solid @grey5;
1314 margin-bottom: @space;
1314 margin-bottom: @space;
1315 }
1315 }
1316 .reviewers-title {
1316 .reviewers-title {
1317 width: 25%;
1317 width: 25%;
1318 min-width: 200px;
1318 min-width: 200px;
1319 }
1319 }
1320 .reviewers {
1320 .reviewers {
1321 width: 25%;
1321 width: 25%;
1322 min-width: 200px;
1322 min-width: 200px;
1323 }
1323 }
1324 .reviewers ul li {
1324 .reviewers ul li {
1325 position: relative;
1325 position: relative;
1326 width: 100%;
1326 width: 100%;
1327 padding-bottom: 8px;
1327 padding-bottom: 8px;
1328 }
1328 }
1329
1329
1330 .reviewer_entry {
1330 .reviewer_entry {
1331 min-height: 55px;
1331 min-height: 55px;
1332 }
1332 }
1333
1333
1334 .reviewers_member {
1334 .reviewers_member {
1335 width: 100%;
1335 width: 100%;
1336 overflow: auto;
1336 overflow: auto;
1337 }
1337 }
1338 .reviewer_reason {
1338 .reviewer_reason {
1339 padding-left: 20px;
1339 padding-left: 20px;
1340 line-height: 1.5em;
1340 line-height: 1.5em;
1341 }
1341 }
1342 .reviewer_status {
1342 .reviewer_status {
1343 display: inline-block;
1343 display: inline-block;
1344 vertical-align: top;
1344 vertical-align: top;
1345 width: 25px;
1345 width: 25px;
1346 min-width: 25px;
1346 min-width: 25px;
1347 height: 1.2em;
1347 height: 1.2em;
1348 margin-top: 3px;
1348 margin-top: 3px;
1349 line-height: 1em;
1349 line-height: 1em;
1350 }
1350 }
1351
1351
1352 .reviewer_name {
1352 .reviewer_name {
1353 display: inline-block;
1353 display: inline-block;
1354 max-width: 83%;
1354 max-width: 83%;
1355 padding-right: 20px;
1355 padding-right: 20px;
1356 vertical-align: middle;
1356 vertical-align: middle;
1357 line-height: 1;
1357 line-height: 1;
1358
1358
1359 .rc-user {
1359 .rc-user {
1360 min-width: 0;
1360 min-width: 0;
1361 margin: -2px 1em 0 0;
1361 margin: -2px 1em 0 0;
1362 }
1362 }
1363
1363
1364 .reviewer {
1364 .reviewer {
1365 float: left;
1365 float: left;
1366 }
1366 }
1367 }
1367 }
1368
1368
1369 .reviewer_member_mandatory {
1369 .reviewer_member_mandatory {
1370 position: absolute;
1370 position: absolute;
1371 left: 15px;
1371 left: 15px;
1372 top: 8px;
1372 top: 8px;
1373 width: 16px;
1373 width: 16px;
1374 font-size: 11px;
1374 font-size: 11px;
1375 margin: 0;
1375 margin: 0;
1376 padding: 0;
1376 padding: 0;
1377 color: black;
1377 color: black;
1378 }
1378 }
1379
1379
1380 .reviewer_member_mandatory_remove,
1380 .reviewer_member_mandatory_remove,
1381 .reviewer_member_remove {
1381 .reviewer_member_remove {
1382 position: absolute;
1382 position: absolute;
1383 right: 0;
1383 right: 0;
1384 top: 0;
1384 top: 0;
1385 width: 16px;
1385 width: 16px;
1386 margin-bottom: 10px;
1386 margin-bottom: 10px;
1387 padding: 0;
1387 padding: 0;
1388 color: black;
1388 color: black;
1389 }
1389 }
1390
1390
1391 .reviewer_member_mandatory_remove {
1391 .reviewer_member_mandatory_remove {
1392 color: @grey4;
1392 color: @grey4;
1393 }
1393 }
1394
1394
1395 .reviewer_member_status {
1395 .reviewer_member_status {
1396 margin-top: 5px;
1396 margin-top: 5px;
1397 }
1397 }
1398 .pr-summary #summary{
1398 .pr-summary #summary{
1399 width: 100%;
1399 width: 100%;
1400 }
1400 }
1401 .pr-summary .action_button:hover {
1401 .pr-summary .action_button:hover {
1402 border: 0;
1402 border: 0;
1403 cursor: pointer;
1403 cursor: pointer;
1404 }
1404 }
1405 .pr-details-title {
1405 .pr-details-title {
1406 padding-bottom: 8px;
1406 padding-bottom: 8px;
1407 border-bottom: @border-thickness solid @grey5;
1407 border-bottom: @border-thickness solid @grey5;
1408
1408
1409 .action_button.disabled {
1409 .action_button.disabled {
1410 color: @grey4;
1410 color: @grey4;
1411 cursor: inherit;
1411 cursor: inherit;
1412 }
1412 }
1413 .action_button {
1413 .action_button {
1414 color: @rcblue;
1414 color: @rcblue;
1415 }
1415 }
1416 }
1416 }
1417 .pr-details-content {
1417 .pr-details-content {
1418 margin-top: @textmargin;
1418 margin-top: @textmargin;
1419 margin-bottom: @textmargin;
1419 margin-bottom: @textmargin;
1420 }
1420 }
1421 .pr-description {
1421 .pr-description {
1422 white-space:pre-wrap;
1422 white-space:pre-wrap;
1423 }
1423 }
1424
1424
1425 .pr-reviewer-rules {
1425 .pr-reviewer-rules {
1426 padding: 10px 0px 20px 0px;
1426 padding: 10px 0px 20px 0px;
1427 }
1427 }
1428
1428
1429 .group_members {
1429 .group_members {
1430 margin-top: 0;
1430 margin-top: 0;
1431 padding: 0;
1431 padding: 0;
1432 list-style: outside none none;
1432 list-style: outside none none;
1433
1433
1434 img {
1434 img {
1435 height: @gravatar-size;
1435 height: @gravatar-size;
1436 width: @gravatar-size;
1436 width: @gravatar-size;
1437 margin-right: .5em;
1437 margin-right: .5em;
1438 margin-left: 3px;
1438 margin-left: 3px;
1439 }
1439 }
1440
1440
1441 .to-delete {
1441 .to-delete {
1442 .user {
1442 .user {
1443 text-decoration: line-through;
1443 text-decoration: line-through;
1444 }
1444 }
1445 }
1445 }
1446 }
1446 }
1447
1447
1448 .compare_view_commits_title {
1448 .compare_view_commits_title {
1449 .disabled {
1449 .disabled {
1450 cursor: inherit;
1450 cursor: inherit;
1451 &:hover{
1451 &:hover{
1452 background-color: inherit;
1452 background-color: inherit;
1453 color: inherit;
1453 color: inherit;
1454 }
1454 }
1455 }
1455 }
1456 }
1456 }
1457
1457
1458 .subtitle-compare {
1458 .subtitle-compare {
1459 margin: -15px 0px 0px 0px;
1459 margin: -15px 0px 0px 0px;
1460 }
1460 }
1461
1461
1462 .comments-summary-td {
1462 .comments-summary-td {
1463 border-top: 1px dashed @grey5;
1463 border-top: 1px dashed @grey5;
1464 }
1464 }
1465
1465
1466 // new entry in group_members
1466 // new entry in group_members
1467 .td-author-new-entry {
1467 .td-author-new-entry {
1468 background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
1468 background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
1469 }
1469 }
1470
1470
1471 .usergroup_member_remove {
1471 .usergroup_member_remove {
1472 width: 16px;
1472 width: 16px;
1473 margin-bottom: 10px;
1473 margin-bottom: 10px;
1474 padding: 0;
1474 padding: 0;
1475 color: black !important;
1475 color: black !important;
1476 cursor: pointer;
1476 cursor: pointer;
1477 }
1477 }
1478
1478
1479 .reviewer_ac .ac-input {
1479 .reviewer_ac .ac-input {
1480 width: 92%;
1480 width: 92%;
1481 margin-bottom: 1em;
1481 margin-bottom: 1em;
1482 }
1482 }
1483
1483
1484 .compare_view_commits tr{
1484 .compare_view_commits tr{
1485 height: 20px;
1485 height: 20px;
1486 }
1486 }
1487 .compare_view_commits td {
1487 .compare_view_commits td {
1488 vertical-align: top;
1488 vertical-align: top;
1489 padding-top: 10px;
1489 padding-top: 10px;
1490 }
1490 }
1491 .compare_view_commits .author {
1491 .compare_view_commits .author {
1492 margin-left: 5px;
1492 margin-left: 5px;
1493 }
1493 }
1494
1494
1495 .compare_view_commits {
1495 .compare_view_commits {
1496 .color-a {
1496 .color-a {
1497 color: @alert1;
1497 color: @alert1;
1498 }
1498 }
1499
1499
1500 .color-c {
1500 .color-c {
1501 color: @color3;
1501 color: @color3;
1502 }
1502 }
1503
1503
1504 .color-r {
1504 .color-r {
1505 color: @color5;
1505 color: @color5;
1506 }
1506 }
1507
1507
1508 .color-a-bg {
1508 .color-a-bg {
1509 background-color: @alert1;
1509 background-color: @alert1;
1510 }
1510 }
1511
1511
1512 .color-c-bg {
1512 .color-c-bg {
1513 background-color: @alert3;
1513 background-color: @alert3;
1514 }
1514 }
1515
1515
1516 .color-r-bg {
1516 .color-r-bg {
1517 background-color: @alert2;
1517 background-color: @alert2;
1518 }
1518 }
1519
1519
1520 .color-a-border {
1520 .color-a-border {
1521 border: 1px solid @alert1;
1521 border: 1px solid @alert1;
1522 }
1522 }
1523
1523
1524 .color-c-border {
1524 .color-c-border {
1525 border: 1px solid @alert3;
1525 border: 1px solid @alert3;
1526 }
1526 }
1527
1527
1528 .color-r-border {
1528 .color-r-border {
1529 border: 1px solid @alert2;
1529 border: 1px solid @alert2;
1530 }
1530 }
1531
1531
1532 .commit-change-indicator {
1532 .commit-change-indicator {
1533 width: 15px;
1533 width: 15px;
1534 height: 15px;
1534 height: 15px;
1535 position: relative;
1535 position: relative;
1536 left: 15px;
1536 left: 15px;
1537 }
1537 }
1538
1538
1539 .commit-change-content {
1539 .commit-change-content {
1540 text-align: center;
1540 text-align: center;
1541 vertical-align: middle;
1541 vertical-align: middle;
1542 line-height: 15px;
1542 line-height: 15px;
1543 }
1543 }
1544 }
1544 }
1545
1545
1546 .compare_view_files {
1547 width: 100%;
1548
1549 td {
1550 vertical-align: middle;
1551 }
1552 }
1553
1554 .compare_view_filepath {
1546 .compare_view_filepath {
1555 color: @grey1;
1547 color: @grey1;
1556 }
1548 }
1557
1549
1558 .show_more {
1550 .show_more {
1559 display: inline-block;
1551 display: inline-block;
1560 position: relative;
1552 position: relative;
1561 vertical-align: middle;
1553 vertical-align: middle;
1562 width: 4px;
1554 width: 4px;
1563 height: @basefontsize;
1555 height: @basefontsize;
1564
1556
1565 &:after {
1557 &:after {
1566 content: "\00A0\25BE";
1558 content: "\00A0\25BE";
1567 display: inline-block;
1559 display: inline-block;
1568 width:10px;
1560 width:10px;
1569 line-height: 5px;
1561 line-height: 5px;
1570 font-size: 12px;
1562 font-size: 12px;
1571 cursor: pointer;
1563 cursor: pointer;
1572 }
1564 }
1573 }
1565 }
1574
1566
1575 .journal_more .show_more {
1567 .journal_more .show_more {
1576 display: inline;
1568 display: inline;
1577
1569
1578 &:after {
1570 &:after {
1579 content: none;
1571 content: none;
1580 }
1572 }
1581 }
1573 }
1582
1574
1583 .open .show_more:after,
1575 .open .show_more:after,
1584 .select2-dropdown-open .show_more:after {
1576 .select2-dropdown-open .show_more:after {
1585 .rotate(180deg);
1577 .rotate(180deg);
1586 margin-left: 4px;
1578 margin-left: 4px;
1587 }
1579 }
1588
1580
1589
1581
1590 .compare_view_commits .collapse_commit:after {
1582 .compare_view_commits .collapse_commit:after {
1591 cursor: pointer;
1583 cursor: pointer;
1592 content: "\00A0\25B4";
1584 content: "\00A0\25B4";
1593 margin-left: -3px;
1585 margin-left: -3px;
1594 font-size: 17px;
1586 font-size: 17px;
1595 color: @grey4;
1587 color: @grey4;
1596 }
1588 }
1597
1589
1598 .diff_links {
1590 .diff_links {
1599 margin-left: 8px;
1591 margin-left: 8px;
1600 }
1592 }
1601
1593
1602 div.ancestor {
1594 div.ancestor {
1603 margin: -30px 0px;
1595 margin: -30px 0px;
1604 }
1596 }
1605
1597
1606 .cs_icon_td input[type="checkbox"] {
1598 .cs_icon_td input[type="checkbox"] {
1607 display: none;
1599 display: none;
1608 }
1600 }
1609
1601
1610 .cs_icon_td .expand_file_icon:after {
1602 .cs_icon_td .expand_file_icon:after {
1611 cursor: pointer;
1603 cursor: pointer;
1612 content: "\00A0\25B6";
1604 content: "\00A0\25B6";
1613 font-size: 12px;
1605 font-size: 12px;
1614 color: @grey4;
1606 color: @grey4;
1615 }
1607 }
1616
1608
1617 .cs_icon_td .collapse_file_icon:after {
1609 .cs_icon_td .collapse_file_icon:after {
1618 cursor: pointer;
1610 cursor: pointer;
1619 content: "\00A0\25BC";
1611 content: "\00A0\25BC";
1620 font-size: 12px;
1612 font-size: 12px;
1621 color: @grey4;
1613 color: @grey4;
1622 }
1614 }
1623
1615
1624 /*new binary
1616 /*new binary
1625 NEW_FILENODE = 1
1617 NEW_FILENODE = 1
1626 DEL_FILENODE = 2
1618 DEL_FILENODE = 2
1627 MOD_FILENODE = 3
1619 MOD_FILENODE = 3
1628 RENAMED_FILENODE = 4
1620 RENAMED_FILENODE = 4
1629 COPIED_FILENODE = 5
1621 COPIED_FILENODE = 5
1630 CHMOD_FILENODE = 6
1622 CHMOD_FILENODE = 6
1631 BIN_FILENODE = 7
1623 BIN_FILENODE = 7
1632 */
1624 */
1633 .cs_files_expand {
1625 .cs_files_expand {
1634 font-size: @basefontsize + 5px;
1626 font-size: @basefontsize + 5px;
1635 line-height: 1.8em;
1627 line-height: 1.8em;
1636 float: right;
1628 float: right;
1637 }
1629 }
1638
1630
1639 .cs_files_expand span{
1631 .cs_files_expand span{
1640 color: @rcblue;
1632 color: @rcblue;
1641 cursor: pointer;
1633 cursor: pointer;
1642 }
1634 }
1643 .cs_files {
1635 .cs_files {
1644 clear: both;
1636 clear: both;
1645 padding-bottom: @padding;
1637 padding-bottom: @padding;
1646
1638
1647 .cur_cs {
1639 .cur_cs {
1648 margin: 10px 2px;
1640 margin: 10px 2px;
1649 font-weight: bold;
1641 font-weight: bold;
1650 }
1642 }
1651
1643
1652 .node {
1644 .node {
1653 float: left;
1645 float: left;
1654 }
1646 }
1655
1647
1656 .changes {
1648 .changes {
1657 float: right;
1649 float: right;
1658 color: white;
1650 color: white;
1659 font-size: @basefontsize - 4px;
1651 font-size: @basefontsize - 4px;
1660 margin-top: 4px;
1652 margin-top: 4px;
1661 opacity: 0.6;
1653 opacity: 0.6;
1662 filter: Alpha(opacity=60); /* IE8 and earlier */
1654 filter: Alpha(opacity=60); /* IE8 and earlier */
1663
1655
1664 .added {
1656 .added {
1665 background-color: @alert1;
1657 background-color: @alert1;
1666 float: left;
1658 float: left;
1667 text-align: center;
1659 text-align: center;
1668 }
1660 }
1669
1661
1670 .deleted {
1662 .deleted {
1671 background-color: @alert2;
1663 background-color: @alert2;
1672 float: left;
1664 float: left;
1673 text-align: center;
1665 text-align: center;
1674 }
1666 }
1675
1667
1676 .bin {
1668 .bin {
1677 background-color: @alert1;
1669 background-color: @alert1;
1678 text-align: center;
1670 text-align: center;
1679 }
1671 }
1680
1672
1681 /*new binary*/
1673 /*new binary*/
1682 .bin.bin1 {
1674 .bin.bin1 {
1683 background-color: @alert1;
1675 background-color: @alert1;
1684 text-align: center;
1676 text-align: center;
1685 }
1677 }
1686
1678
1687 /*deleted binary*/
1679 /*deleted binary*/
1688 .bin.bin2 {
1680 .bin.bin2 {
1689 background-color: @alert2;
1681 background-color: @alert2;
1690 text-align: center;
1682 text-align: center;
1691 }
1683 }
1692
1684
1693 /*mod binary*/
1685 /*mod binary*/
1694 .bin.bin3 {
1686 .bin.bin3 {
1695 background-color: @grey2;
1687 background-color: @grey2;
1696 text-align: center;
1688 text-align: center;
1697 }
1689 }
1698
1690
1699 /*rename file*/
1691 /*rename file*/
1700 .bin.bin4 {
1692 .bin.bin4 {
1701 background-color: @alert4;
1693 background-color: @alert4;
1702 text-align: center;
1694 text-align: center;
1703 }
1695 }
1704
1696
1705 /*copied file*/
1697 /*copied file*/
1706 .bin.bin5 {
1698 .bin.bin5 {
1707 background-color: @alert4;
1699 background-color: @alert4;
1708 text-align: center;
1700 text-align: center;
1709 }
1701 }
1710
1702
1711 /*chmod file*/
1703 /*chmod file*/
1712 .bin.bin6 {
1704 .bin.bin6 {
1713 background-color: @grey2;
1705 background-color: @grey2;
1714 text-align: center;
1706 text-align: center;
1715 }
1707 }
1716 }
1708 }
1717 }
1709 }
1718
1710
1719 .cs_files .cs_added, .cs_files .cs_A,
1711 .cs_files .cs_added, .cs_files .cs_A,
1720 .cs_files .cs_added, .cs_files .cs_M,
1712 .cs_files .cs_added, .cs_files .cs_M,
1721 .cs_files .cs_added, .cs_files .cs_D {
1713 .cs_files .cs_added, .cs_files .cs_D {
1722 height: 16px;
1714 height: 16px;
1723 padding-right: 10px;
1715 padding-right: 10px;
1724 margin-top: 7px;
1716 margin-top: 7px;
1725 text-align: left;
1717 text-align: left;
1726 }
1718 }
1727
1719
1728 .cs_icon_td {
1720 .cs_icon_td {
1729 min-width: 16px;
1721 min-width: 16px;
1730 width: 16px;
1722 width: 16px;
1731 }
1723 }
1732
1724
1733 .pull-request-merge {
1725 .pull-request-merge {
1734 border: 1px solid @grey5;
1726 border: 1px solid @grey5;
1735 padding: 10px 0px 20px;
1727 padding: 10px 0px 20px;
1736 margin-top: 10px;
1728 margin-top: 10px;
1737 margin-bottom: 20px;
1729 margin-bottom: 20px;
1738 }
1730 }
1739
1731
1740 .pull-request-merge ul {
1732 .pull-request-merge ul {
1741 padding: 0px 0px;
1733 padding: 0px 0px;
1742 }
1734 }
1743
1735
1744 .pull-request-merge li:before{
1736 .pull-request-merge li:before{
1745 content:none;
1737 content:none;
1746 }
1738 }
1747
1739
1748 .pull-request-merge .pull-request-wrap {
1740 .pull-request-merge .pull-request-wrap {
1749 height: auto;
1741 height: auto;
1750 padding: 0px 0px;
1742 padding: 0px 0px;
1751 text-align: right;
1743 text-align: right;
1752 }
1744 }
1753
1745
1754 .pull-request-merge span {
1746 .pull-request-merge span {
1755 margin-right: 5px;
1747 margin-right: 5px;
1756 }
1748 }
1757
1749
1758 .pull-request-merge-actions {
1750 .pull-request-merge-actions {
1759 min-height: 30px;
1751 min-height: 30px;
1760 padding: 0px 0px;
1752 padding: 0px 0px;
1761 }
1753 }
1762
1754
1763 .pull-request-merge-info {
1755 .pull-request-merge-info {
1764 padding: 0px 5px 5px 0px;
1756 padding: 0px 5px 5px 0px;
1765 }
1757 }
1766
1758
1767 .merge-status {
1759 .merge-status {
1768 margin-right: 5px;
1760 margin-right: 5px;
1769 }
1761 }
1770
1762
1771 .merge-message {
1763 .merge-message {
1772 font-size: 1.2em
1764 font-size: 1.2em
1773 }
1765 }
1774
1766
1775 .merge-message.success i,
1767 .merge-message.success i,
1776 .merge-icon.success i {
1768 .merge-icon.success i {
1777 color:@alert1;
1769 color:@alert1;
1778 }
1770 }
1779
1771
1780 .merge-message.warning i,
1772 .merge-message.warning i,
1781 .merge-icon.warning i {
1773 .merge-icon.warning i {
1782 color: @alert3;
1774 color: @alert3;
1783 }
1775 }
1784
1776
1785 .merge-message.error i,
1777 .merge-message.error i,
1786 .merge-icon.error i {
1778 .merge-icon.error i {
1787 color:@alert2;
1779 color:@alert2;
1788 }
1780 }
1789
1781
1790 .pr-versions {
1782 .pr-versions {
1791 font-size: 1.1em;
1783 font-size: 1.1em;
1792
1784
1793 table {
1785 table {
1794 padding: 0px 5px;
1786 padding: 0px 5px;
1795 }
1787 }
1796
1788
1797 td {
1789 td {
1798 line-height: 15px;
1790 line-height: 15px;
1799 }
1791 }
1800
1792
1801 .flag_status {
1793 .flag_status {
1802 margin: 0;
1794 margin: 0;
1803 }
1795 }
1804
1796
1805 .compare-radio-button {
1797 .compare-radio-button {
1806 position: relative;
1798 position: relative;
1807 top: -3px;
1799 top: -3px;
1808 }
1800 }
1809 }
1801 }
1810
1802
1811
1803
1812 #close_pull_request {
1804 #close_pull_request {
1813 margin-right: 0px;
1805 margin-right: 0px;
1814 }
1806 }
1815
1807
1816 .empty_data {
1808 .empty_data {
1817 color: @grey4;
1809 color: @grey4;
1818 }
1810 }
1819
1811
1820 #changeset_compare_view_content {
1812 #changeset_compare_view_content {
1821 margin-bottom: @space;
1813 margin-bottom: @space;
1822 clear: both;
1814 clear: both;
1823 width: 100%;
1815 width: 100%;
1824 box-sizing: border-box;
1816 box-sizing: border-box;
1825 .border-radius(@border-radius);
1817 .border-radius(@border-radius);
1826
1818
1827 .help-block {
1819 .help-block {
1828 margin: @padding 0;
1820 margin: @padding 0;
1829 color: @text-color;
1821 color: @text-color;
1830 &.pre-formatting {
1822 &.pre-formatting {
1831 white-space: pre;
1823 white-space: pre;
1832 }
1824 }
1833 }
1825 }
1834
1826
1835 .empty_data {
1827 .empty_data {
1836 margin: @padding 0;
1828 margin: @padding 0;
1837 }
1829 }
1838
1830
1839 .alert {
1831 .alert {
1840 margin-bottom: @space;
1832 margin-bottom: @space;
1841 }
1833 }
1842 }
1834 }
1843
1835
1844 .table_disp {
1836 .table_disp {
1845 .status {
1837 .status {
1846 width: auto;
1838 width: auto;
1847
1839
1848 .flag_status {
1840 .flag_status {
1849 float: left;
1841 float: left;
1850 }
1842 }
1851 }
1843 }
1852 }
1844 }
1853
1845
1854
1846
1855 .creation_in_progress {
1847 .creation_in_progress {
1856 color: @grey4
1848 color: @grey4
1857 }
1849 }
1858
1850
1859 .status_box_menu {
1851 .status_box_menu {
1860 margin: 0;
1852 margin: 0;
1861 }
1853 }
1862
1854
1863 .notification-table{
1855 .notification-table{
1864 margin-bottom: @space;
1856 margin-bottom: @space;
1865 display: table;
1857 display: table;
1866 width: 100%;
1858 width: 100%;
1867
1859
1868 .container{
1860 .container{
1869 display: table-row;
1861 display: table-row;
1870
1862
1871 .notification-header{
1863 .notification-header{
1872 border-bottom: @border-thickness solid @border-default-color;
1864 border-bottom: @border-thickness solid @border-default-color;
1873 }
1865 }
1874
1866
1875 .notification-subject{
1867 .notification-subject{
1876 display: table-cell;
1868 display: table-cell;
1877 }
1869 }
1878 }
1870 }
1879 }
1871 }
1880
1872
1881 // Notifications
1873 // Notifications
1882 .notification-header{
1874 .notification-header{
1883 display: table;
1875 display: table;
1884 width: 100%;
1876 width: 100%;
1885 padding: floor(@basefontsize/2) 0;
1877 padding: floor(@basefontsize/2) 0;
1886 line-height: 1em;
1878 line-height: 1em;
1887
1879
1888 .desc, .delete-notifications, .read-notifications{
1880 .desc, .delete-notifications, .read-notifications{
1889 display: table-cell;
1881 display: table-cell;
1890 text-align: left;
1882 text-align: left;
1891 }
1883 }
1892
1884
1893 .desc{
1885 .desc{
1894 width: 1163px;
1886 width: 1163px;
1895 }
1887 }
1896
1888
1897 .delete-notifications, .read-notifications{
1889 .delete-notifications, .read-notifications{
1898 width: 35px;
1890 width: 35px;
1899 min-width: 35px; //fixes when only one button is displayed
1891 min-width: 35px; //fixes when only one button is displayed
1900 }
1892 }
1901 }
1893 }
1902
1894
1903 .notification-body {
1895 .notification-body {
1904 .markdown-block,
1896 .markdown-block,
1905 .rst-block {
1897 .rst-block {
1906 padding: @padding 0;
1898 padding: @padding 0;
1907 }
1899 }
1908
1900
1909 .notification-subject {
1901 .notification-subject {
1910 padding: @textmargin 0;
1902 padding: @textmargin 0;
1911 border-bottom: @border-thickness solid @border-default-color;
1903 border-bottom: @border-thickness solid @border-default-color;
1912 }
1904 }
1913 }
1905 }
1914
1906
1915
1907
1916 .notifications_buttons{
1908 .notifications_buttons{
1917 float: right;
1909 float: right;
1918 }
1910 }
1919
1911
1920 #notification-status{
1912 #notification-status{
1921 display: inline;
1913 display: inline;
1922 }
1914 }
1923
1915
1924 // Repositories
1916 // Repositories
1925
1917
1926 #summary.fields{
1918 #summary.fields{
1927 display: table;
1919 display: table;
1928
1920
1929 .field{
1921 .field{
1930 display: table-row;
1922 display: table-row;
1931
1923
1932 .label-summary{
1924 .label-summary{
1933 display: table-cell;
1925 display: table-cell;
1934 min-width: @label-summary-minwidth;
1926 min-width: @label-summary-minwidth;
1935 padding-top: @padding/2;
1927 padding-top: @padding/2;
1936 padding-bottom: @padding/2;
1928 padding-bottom: @padding/2;
1937 padding-right: @padding/2;
1929 padding-right: @padding/2;
1938 }
1930 }
1939
1931
1940 .input{
1932 .input{
1941 display: table-cell;
1933 display: table-cell;
1942 padding: @padding/2;
1934 padding: @padding/2;
1943
1935
1944 input{
1936 input{
1945 min-width: 29em;
1937 min-width: 29em;
1946 padding: @padding/4;
1938 padding: @padding/4;
1947 }
1939 }
1948 }
1940 }
1949 .statistics, .downloads{
1941 .statistics, .downloads{
1950 .disabled{
1942 .disabled{
1951 color: @grey4;
1943 color: @grey4;
1952 }
1944 }
1953 }
1945 }
1954 }
1946 }
1955 }
1947 }
1956
1948
1957 #summary{
1949 #summary{
1958 width: 70%;
1950 width: 70%;
1959 }
1951 }
1960
1952
1961
1953
1962 // Journal
1954 // Journal
1963 .journal.title {
1955 .journal.title {
1964 h5 {
1956 h5 {
1965 float: left;
1957 float: left;
1966 margin: 0;
1958 margin: 0;
1967 width: 70%;
1959 width: 70%;
1968 }
1960 }
1969
1961
1970 ul {
1962 ul {
1971 float: right;
1963 float: right;
1972 display: inline-block;
1964 display: inline-block;
1973 margin: 0;
1965 margin: 0;
1974 width: 30%;
1966 width: 30%;
1975 text-align: right;
1967 text-align: right;
1976
1968
1977 li {
1969 li {
1978 display: inline;
1970 display: inline;
1979 font-size: @journal-fontsize;
1971 font-size: @journal-fontsize;
1980 line-height: 1em;
1972 line-height: 1em;
1981
1973
1982 &:before { content: none; }
1974 &:before { content: none; }
1983 }
1975 }
1984 }
1976 }
1985 }
1977 }
1986
1978
1987 .filterexample {
1979 .filterexample {
1988 position: absolute;
1980 position: absolute;
1989 top: 95px;
1981 top: 95px;
1990 left: @contentpadding;
1982 left: @contentpadding;
1991 color: @rcblue;
1983 color: @rcblue;
1992 font-size: 11px;
1984 font-size: 11px;
1993 font-family: @text-regular;
1985 font-family: @text-regular;
1994 cursor: help;
1986 cursor: help;
1995
1987
1996 &:hover {
1988 &:hover {
1997 color: @rcdarkblue;
1989 color: @rcdarkblue;
1998 }
1990 }
1999
1991
2000 @media (max-width:768px) {
1992 @media (max-width:768px) {
2001 position: relative;
1993 position: relative;
2002 top: auto;
1994 top: auto;
2003 left: auto;
1995 left: auto;
2004 display: block;
1996 display: block;
2005 }
1997 }
2006 }
1998 }
2007
1999
2008
2000
2009 #journal{
2001 #journal{
2010 margin-bottom: @space;
2002 margin-bottom: @space;
2011
2003
2012 .journal_day{
2004 .journal_day{
2013 margin-bottom: @textmargin/2;
2005 margin-bottom: @textmargin/2;
2014 padding-bottom: @textmargin/2;
2006 padding-bottom: @textmargin/2;
2015 font-size: @journal-fontsize;
2007 font-size: @journal-fontsize;
2016 border-bottom: @border-thickness solid @border-default-color;
2008 border-bottom: @border-thickness solid @border-default-color;
2017 }
2009 }
2018
2010
2019 .journal_container{
2011 .journal_container{
2020 margin-bottom: @space;
2012 margin-bottom: @space;
2021
2013
2022 .journal_user{
2014 .journal_user{
2023 display: inline-block;
2015 display: inline-block;
2024 }
2016 }
2025 .journal_action_container{
2017 .journal_action_container{
2026 display: block;
2018 display: block;
2027 margin-top: @textmargin;
2019 margin-top: @textmargin;
2028
2020
2029 div{
2021 div{
2030 display: inline;
2022 display: inline;
2031 }
2023 }
2032
2024
2033 div.journal_action_params{
2025 div.journal_action_params{
2034 display: block;
2026 display: block;
2035 }
2027 }
2036
2028
2037 div.journal_repo:after{
2029 div.journal_repo:after{
2038 content: "\A";
2030 content: "\A";
2039 white-space: pre;
2031 white-space: pre;
2040 }
2032 }
2041
2033
2042 div.date{
2034 div.date{
2043 display: block;
2035 display: block;
2044 margin-bottom: @textmargin;
2036 margin-bottom: @textmargin;
2045 }
2037 }
2046 }
2038 }
2047 }
2039 }
2048 }
2040 }
2049
2041
2050 // Files
2042 // Files
2051 .edit-file-title {
2043 .edit-file-title {
2052 border-bottom: @border-thickness solid @border-default-color;
2044 border-bottom: @border-thickness solid @border-default-color;
2053
2045
2054 .breadcrumbs {
2046 .breadcrumbs {
2055 margin-bottom: 0;
2047 margin-bottom: 0;
2056 }
2048 }
2057 }
2049 }
2058
2050
2059 .edit-file-fieldset {
2051 .edit-file-fieldset {
2060 margin-top: @sidebarpadding;
2052 margin-top: @sidebarpadding;
2061
2053
2062 .fieldset {
2054 .fieldset {
2063 .left-label {
2055 .left-label {
2064 width: 13%;
2056 width: 13%;
2065 }
2057 }
2066 .right-content {
2058 .right-content {
2067 width: 87%;
2059 width: 87%;
2068 max-width: 100%;
2060 max-width: 100%;
2069 }
2061 }
2070 .filename-label {
2062 .filename-label {
2071 margin-top: 13px;
2063 margin-top: 13px;
2072 }
2064 }
2073 .commit-message-label {
2065 .commit-message-label {
2074 margin-top: 4px;
2066 margin-top: 4px;
2075 }
2067 }
2076 .file-upload-input {
2068 .file-upload-input {
2077 input {
2069 input {
2078 display: none;
2070 display: none;
2079 }
2071 }
2080 margin-top: 10px;
2072 margin-top: 10px;
2081 }
2073 }
2082 .file-upload-label {
2074 .file-upload-label {
2083 margin-top: 10px;
2075 margin-top: 10px;
2084 }
2076 }
2085 p {
2077 p {
2086 margin-top: 5px;
2078 margin-top: 5px;
2087 }
2079 }
2088
2080
2089 }
2081 }
2090 .custom-path-link {
2082 .custom-path-link {
2091 margin-left: 5px;
2083 margin-left: 5px;
2092 }
2084 }
2093 #commit {
2085 #commit {
2094 resize: vertical;
2086 resize: vertical;
2095 }
2087 }
2096 }
2088 }
2097
2089
2098 .delete-file-preview {
2090 .delete-file-preview {
2099 max-height: 250px;
2091 max-height: 250px;
2100 }
2092 }
2101
2093
2102 .new-file,
2094 .new-file,
2103 #filter_activate,
2095 #filter_activate,
2104 #filter_deactivate {
2096 #filter_deactivate {
2105 float: left;
2097 float: left;
2106 margin: 0 0 0 15px;
2098 margin: 0 0 0 15px;
2107 }
2099 }
2108
2100
2109 h3.files_location{
2101 h3.files_location{
2110 line-height: 2.4em;
2102 line-height: 2.4em;
2111 }
2103 }
2112
2104
2113 .browser-nav {
2105 .browser-nav {
2114 display: table;
2106 display: table;
2115 margin-bottom: @space;
2107 margin-bottom: @space;
2116
2108
2117
2109
2118 .info_box {
2110 .info_box {
2119 display: inline-table;
2111 display: inline-table;
2120 height: 2.5em;
2112 height: 2.5em;
2121
2113
2122 .browser-cur-rev, .info_box_elem {
2114 .browser-cur-rev, .info_box_elem {
2123 display: table-cell;
2115 display: table-cell;
2124 vertical-align: middle;
2116 vertical-align: middle;
2125 }
2117 }
2126
2118
2127 .info_box_elem {
2119 .info_box_elem {
2128 border-top: @border-thickness solid @rcblue;
2120 border-top: @border-thickness solid @rcblue;
2129 border-bottom: @border-thickness solid @rcblue;
2121 border-bottom: @border-thickness solid @rcblue;
2130
2122
2131 #at_rev, a {
2123 #at_rev, a {
2132 padding: 0.6em 0.9em;
2124 padding: 0.6em 0.9em;
2133 margin: 0;
2125 margin: 0;
2134 .box-shadow(none);
2126 .box-shadow(none);
2135 border: 0;
2127 border: 0;
2136 height: 12px;
2128 height: 12px;
2137 }
2129 }
2138
2130
2139 input#at_rev {
2131 input#at_rev {
2140 max-width: 50px;
2132 max-width: 50px;
2141 text-align: right;
2133 text-align: right;
2142 }
2134 }
2143
2135
2144 &.previous {
2136 &.previous {
2145 border: @border-thickness solid @rcblue;
2137 border: @border-thickness solid @rcblue;
2146 .disabled {
2138 .disabled {
2147 color: @grey4;
2139 color: @grey4;
2148 cursor: not-allowed;
2140 cursor: not-allowed;
2149 }
2141 }
2150 }
2142 }
2151
2143
2152 &.next {
2144 &.next {
2153 border: @border-thickness solid @rcblue;
2145 border: @border-thickness solid @rcblue;
2154 .disabled {
2146 .disabled {
2155 color: @grey4;
2147 color: @grey4;
2156 cursor: not-allowed;
2148 cursor: not-allowed;
2157 }
2149 }
2158 }
2150 }
2159 }
2151 }
2160
2152
2161 .browser-cur-rev {
2153 .browser-cur-rev {
2162
2154
2163 span{
2155 span{
2164 margin: 0;
2156 margin: 0;
2165 color: @rcblue;
2157 color: @rcblue;
2166 height: 12px;
2158 height: 12px;
2167 display: inline-block;
2159 display: inline-block;
2168 padding: 0.7em 1em ;
2160 padding: 0.7em 1em ;
2169 border: @border-thickness solid @rcblue;
2161 border: @border-thickness solid @rcblue;
2170 margin-right: @padding;
2162 margin-right: @padding;
2171 }
2163 }
2172 }
2164 }
2173 }
2165 }
2174
2166
2175 .search_activate {
2167 .search_activate {
2176 display: table-cell;
2168 display: table-cell;
2177 vertical-align: middle;
2169 vertical-align: middle;
2178
2170
2179 input, label{
2171 input, label{
2180 margin: 0;
2172 margin: 0;
2181 padding: 0;
2173 padding: 0;
2182 }
2174 }
2183
2175
2184 input{
2176 input{
2185 margin-left: @textmargin;
2177 margin-left: @textmargin;
2186 }
2178 }
2187
2179
2188 }
2180 }
2189 }
2181 }
2190
2182
2191 .browser-cur-rev{
2183 .browser-cur-rev{
2192 margin-bottom: @textmargin;
2184 margin-bottom: @textmargin;
2193 }
2185 }
2194
2186
2195 #node_filter_box_loading{
2187 #node_filter_box_loading{
2196 .info_text;
2188 .info_text;
2197 }
2189 }
2198
2190
2199 .browser-search {
2191 .browser-search {
2200 margin: -25px 0px 5px 0px;
2192 margin: -25px 0px 5px 0px;
2201 }
2193 }
2202
2194
2203 .node-filter {
2195 .node-filter {
2204 font-size: @repo-title-fontsize;
2196 font-size: @repo-title-fontsize;
2205 padding: 4px 0px 0px 0px;
2197 padding: 4px 0px 0px 0px;
2206
2198
2207 .node-filter-path {
2199 .node-filter-path {
2208 float: left;
2200 float: left;
2209 color: @grey4;
2201 color: @grey4;
2210 }
2202 }
2211 .node-filter-input {
2203 .node-filter-input {
2212 float: left;
2204 float: left;
2213 margin: -2px 0px 0px 2px;
2205 margin: -2px 0px 0px 2px;
2214 input {
2206 input {
2215 padding: 2px;
2207 padding: 2px;
2216 border: none;
2208 border: none;
2217 font-size: @repo-title-fontsize;
2209 font-size: @repo-title-fontsize;
2218 }
2210 }
2219 }
2211 }
2220 }
2212 }
2221
2213
2222
2214
2223 .browser-result{
2215 .browser-result{
2224 td a{
2216 td a{
2225 margin-left: 0.5em;
2217 margin-left: 0.5em;
2226 display: inline-block;
2218 display: inline-block;
2227
2219
2228 em{
2220 em{
2229 font-family: @text-bold;
2221 font-family: @text-bold;
2230 }
2222 }
2231 }
2223 }
2232 }
2224 }
2233
2225
2234 .browser-highlight{
2226 .browser-highlight{
2235 background-color: @grey5-alpha;
2227 background-color: @grey5-alpha;
2236 }
2228 }
2237
2229
2238
2230
2239 // Search
2231 // Search
2240
2232
2241 .search-form{
2233 .search-form{
2242 #q {
2234 #q {
2243 width: @search-form-width;
2235 width: @search-form-width;
2244 }
2236 }
2245 .fields{
2237 .fields{
2246 margin: 0 0 @space;
2238 margin: 0 0 @space;
2247 }
2239 }
2248
2240
2249 label{
2241 label{
2250 display: inline-block;
2242 display: inline-block;
2251 margin-right: @textmargin;
2243 margin-right: @textmargin;
2252 padding-top: 0.25em;
2244 padding-top: 0.25em;
2253 }
2245 }
2254
2246
2255
2247
2256 .results{
2248 .results{
2257 clear: both;
2249 clear: both;
2258 margin: 0 0 @padding;
2250 margin: 0 0 @padding;
2259 }
2251 }
2260 }
2252 }
2261
2253
2262 div.search-feedback-items {
2254 div.search-feedback-items {
2263 display: inline-block;
2255 display: inline-block;
2264 padding:0px 0px 0px 96px;
2256 padding:0px 0px 0px 96px;
2265 }
2257 }
2266
2258
2267 div.search-code-body {
2259 div.search-code-body {
2268 background-color: #ffffff; padding: 5px 0 5px 10px;
2260 background-color: #ffffff; padding: 5px 0 5px 10px;
2269 pre {
2261 pre {
2270 .match { background-color: #faffa6;}
2262 .match { background-color: #faffa6;}
2271 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
2263 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
2272 }
2264 }
2273 }
2265 }
2274
2266
2275 .expand_commit.search {
2267 .expand_commit.search {
2276 .show_more.open {
2268 .show_more.open {
2277 height: auto;
2269 height: auto;
2278 max-height: none;
2270 max-height: none;
2279 }
2271 }
2280 }
2272 }
2281
2273
2282 .search-results {
2274 .search-results {
2283
2275
2284 h2 {
2276 h2 {
2285 margin-bottom: 0;
2277 margin-bottom: 0;
2286 }
2278 }
2287 .codeblock {
2279 .codeblock {
2288 border: none;
2280 border: none;
2289 background: transparent;
2281 background: transparent;
2290 }
2282 }
2291
2283
2292 .codeblock-header {
2284 .codeblock-header {
2293 border: none;
2285 border: none;
2294 background: transparent;
2286 background: transparent;
2295 }
2287 }
2296
2288
2297 .code-body {
2289 .code-body {
2298 border: @border-thickness solid @border-default-color;
2290 border: @border-thickness solid @border-default-color;
2299 .border-radius(@border-radius);
2291 .border-radius(@border-radius);
2300 }
2292 }
2301
2293
2302 .td-commit {
2294 .td-commit {
2303 &:extend(pre);
2295 &:extend(pre);
2304 border-bottom: @border-thickness solid @border-default-color;
2296 border-bottom: @border-thickness solid @border-default-color;
2305 }
2297 }
2306
2298
2307 .message {
2299 .message {
2308 height: auto;
2300 height: auto;
2309 max-width: 350px;
2301 max-width: 350px;
2310 white-space: normal;
2302 white-space: normal;
2311 text-overflow: initial;
2303 text-overflow: initial;
2312 overflow: visible;
2304 overflow: visible;
2313
2305
2314 .match { background-color: #faffa6;}
2306 .match { background-color: #faffa6;}
2315 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2307 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2316 }
2308 }
2317
2309
2318 }
2310 }
2319
2311
2320 table.rctable td.td-search-results div {
2312 table.rctable td.td-search-results div {
2321 max-width: 100%;
2313 max-width: 100%;
2322 }
2314 }
2323
2315
2324 #tip-box, .tip-box{
2316 #tip-box, .tip-box{
2325 padding: @menupadding/2;
2317 padding: @menupadding/2;
2326 display: block;
2318 display: block;
2327 border: @border-thickness solid @border-highlight-color;
2319 border: @border-thickness solid @border-highlight-color;
2328 .border-radius(@border-radius);
2320 .border-radius(@border-radius);
2329 background-color: white;
2321 background-color: white;
2330 z-index: 99;
2322 z-index: 99;
2331 white-space: pre-wrap;
2323 white-space: pre-wrap;
2332 }
2324 }
2333
2325
2334 #linktt {
2326 #linktt {
2335 width: 79px;
2327 width: 79px;
2336 }
2328 }
2337
2329
2338 #help_kb .modal-content{
2330 #help_kb .modal-content{
2339 max-width: 750px;
2331 max-width: 750px;
2340 margin: 10% auto;
2332 margin: 10% auto;
2341
2333
2342 table{
2334 table{
2343 td,th{
2335 td,th{
2344 border-bottom: none;
2336 border-bottom: none;
2345 line-height: 2.5em;
2337 line-height: 2.5em;
2346 }
2338 }
2347 th{
2339 th{
2348 padding-bottom: @textmargin/2;
2340 padding-bottom: @textmargin/2;
2349 }
2341 }
2350 td.keys{
2342 td.keys{
2351 text-align: center;
2343 text-align: center;
2352 }
2344 }
2353 }
2345 }
2354
2346
2355 .block-left{
2347 .block-left{
2356 width: 45%;
2348 width: 45%;
2357 margin-right: 5%;
2349 margin-right: 5%;
2358 }
2350 }
2359 .modal-footer{
2351 .modal-footer{
2360 clear: both;
2352 clear: both;
2361 }
2353 }
2362 .key.tag{
2354 .key.tag{
2363 padding: 0.5em;
2355 padding: 0.5em;
2364 background-color: @rcblue;
2356 background-color: @rcblue;
2365 color: white;
2357 color: white;
2366 border-color: @rcblue;
2358 border-color: @rcblue;
2367 .box-shadow(none);
2359 .box-shadow(none);
2368 }
2360 }
2369 }
2361 }
2370
2362
2371
2363
2372
2364
2373 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2365 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2374
2366
2375 @import 'statistics-graph';
2367 @import 'statistics-graph';
2376 @import 'tables';
2368 @import 'tables';
2377 @import 'forms';
2369 @import 'forms';
2378 @import 'diff';
2370 @import 'diff';
2379 @import 'summary';
2371 @import 'summary';
2380 @import 'navigation';
2372 @import 'navigation';
2381
2373
2382 //--- SHOW/HIDE SECTIONS --//
2374 //--- SHOW/HIDE SECTIONS --//
2383
2375
2384 .btn-collapse {
2376 .btn-collapse {
2385 float: right;
2377 float: right;
2386 text-align: right;
2378 text-align: right;
2387 font-family: @text-light;
2379 font-family: @text-light;
2388 font-size: @basefontsize;
2380 font-size: @basefontsize;
2389 cursor: pointer;
2381 cursor: pointer;
2390 border: none;
2382 border: none;
2391 color: @rcblue;
2383 color: @rcblue;
2392 }
2384 }
2393
2385
2394 table.rctable,
2386 table.rctable,
2395 table.dataTable {
2387 table.dataTable {
2396 .btn-collapse {
2388 .btn-collapse {
2397 float: right;
2389 float: right;
2398 text-align: right;
2390 text-align: right;
2399 }
2391 }
2400 }
2392 }
2401
2393
2402
2394
2403 // TODO: johbo: Fix for IE10, this avoids that we see a border
2395 // TODO: johbo: Fix for IE10, this avoids that we see a border
2404 // and padding around checkboxes and radio boxes. Move to the right place,
2396 // and padding around checkboxes and radio boxes. Move to the right place,
2405 // or better: Remove this once we did the form refactoring.
2397 // or better: Remove this once we did the form refactoring.
2406 input[type=checkbox],
2398 input[type=checkbox],
2407 input[type=radio] {
2399 input[type=radio] {
2408 padding: 0;
2400 padding: 0;
2409 border: none;
2401 border: none;
2410 }
2402 }
2411
2403
2412 .toggle-ajax-spinner{
2404 .toggle-ajax-spinner{
2413 height: 16px;
2405 height: 16px;
2414 width: 16px;
2406 width: 16px;
2415 }
2407 }
@@ -1,555 +1,503 b''
1
1
2 // tables.less
2 // tables.less
3 // For use in RhodeCode application tables;
3 // For use in RhodeCode application tables;
4 // see style guide documentation for guidelines.
4 // see style guide documentation for guidelines.
5
5
6 // TABLES
6 // TABLES
7
7
8 .rctable,
8 .rctable,
9 table.rctable,
9 table.rctable,
10 table.dataTable {
10 table.dataTable {
11 clear:both;
11 clear:both;
12 width: 100%;
12 width: 100%;
13 margin: 0 auto @padding;
13 margin: 0 auto @padding;
14 padding: 0;
14 padding: 0;
15 vertical-align: baseline;
15 vertical-align: baseline;
16 line-height:1.5em;
16 line-height:1.5em;
17 border: none;
17 border: none;
18 outline: none;
18 outline: none;
19 border-collapse: collapse;
19 border-collapse: collapse;
20 border-spacing: 0;
20 border-spacing: 0;
21 color: @grey2;
21 color: @grey2;
22
22
23 b {
23 b {
24 font-weight: normal;
24 font-weight: normal;
25 }
25 }
26
26
27 em {
27 em {
28 font-weight: bold;
28 font-weight: bold;
29 font-style: normal;
29 font-style: normal;
30 }
30 }
31
31
32 th,
32 th,
33 td {
33 td {
34 height: auto;
34 height: auto;
35 max-width: 20%;
35 max-width: 20%;
36 padding: .65em 1em .65em 0;
36 padding: .65em 1em .65em 0;
37 vertical-align: middle;
37 vertical-align: middle;
38 border-bottom: @border-thickness solid @grey5;
38 border-bottom: @border-thickness solid @grey5;
39 white-space: normal;
39 white-space: normal;
40
40
41 &.td-radio,
41 &.td-radio,
42 &.td-checkbox {
42 &.td-checkbox {
43 padding-right: 0;
43 padding-right: 0;
44 text-align: center;
44 text-align: center;
45
45
46 input {
46 input {
47 margin: 0 1em;
47 margin: 0 1em;
48 }
48 }
49 }
49 }
50
50
51 &.truncate-wrap {
51 &.truncate-wrap {
52 white-space: nowrap !important;
52 white-space: nowrap !important;
53 }
53 }
54
54
55 pre {
55 pre {
56 margin: 0;
56 margin: 0;
57 }
57 }
58
58
59 .show_more {
59 .show_more {
60 height: inherit;
60 height: inherit;
61 }
61 }
62 }
62 }
63
63
64 .expired td {
64 .expired td {
65 background-color: @grey7;
65 background-color: @grey7;
66 }
66 }
67
67
68 .td-radio + .td-owner {
68 .td-radio + .td-owner {
69 padding-left: 1em;
69 padding-left: 1em;
70 }
70 }
71
71
72
72
73 th {
73 th {
74 text-align: left;
74 text-align: left;
75 font-family: @text-semibold;
75 font-family: @text-semibold;
76 }
76 }
77
77
78 .hl {
78 .hl {
79 td {
79 td {
80 background-color: lighten(@alert4,25%);
80 background-color: lighten(@alert4,25%);
81 }
81 }
82 }
82 }
83
83
84 // Special Data Cell Types
84 // Special Data Cell Types
85 // See style guide for desciptions and examples.
85 // See style guide for desciptions and examples.
86
86
87 td {
87 td {
88
88
89 &.user {
89 &.user {
90 padding-left: 1em;
90 padding-left: 1em;
91 }
91 }
92
92
93 &.td-rss {
93 &.td-rss {
94 width: 20px;
94 width: 20px;
95 min-width: 0;
95 min-width: 0;
96 margin: 0;
96 margin: 0;
97 }
97 }
98
98
99 &.quick_repo_menu {
99 &.quick_repo_menu {
100 width: 15px;
100 width: 15px;
101 text-align: center;
101 text-align: center;
102
102
103 &:hover {
103 &:hover {
104 background-color: @grey5;
104 background-color: @grey5;
105 }
105 }
106 }
106 }
107
107
108 &.td-hash {
108 &.td-hash {
109 min-width: 80px;
109 min-width: 80px;
110 width: 200px;
110 width: 200px;
111
111
112 .obsolete {
112 .obsolete {
113 text-decoration: line-through;
113 text-decoration: line-through;
114 color: lighten(@grey2,25%);
114 color: lighten(@grey2,25%);
115 }
115 }
116 }
116 }
117
117
118 &.td-time {
118 &.td-time {
119 width: 160px;
119 width: 160px;
120 white-space: nowrap;
120 white-space: nowrap;
121 }
121 }
122
122
123 &.annotate{
123 &.annotate{
124 padding-right: 0;
124 padding-right: 0;
125
125
126 div.annotatediv{
126 div.annotatediv{
127 margin: 0 0.7em;
127 margin: 0 0.7em;
128 }
128 }
129 }
129 }
130
130
131 &.tags-col {
131 &.tags-col {
132 padding-right: 0;
132 padding-right: 0;
133 }
133 }
134
134
135 &.td-description {
135 &.td-description {
136 min-width: 350px;
136 min-width: 350px;
137
137
138 &.truncate, .truncate-wrap {
138 &.truncate, .truncate-wrap {
139 white-space: nowrap;
139 white-space: nowrap;
140 overflow: hidden;
140 overflow: hidden;
141 text-overflow: ellipsis;
141 text-overflow: ellipsis;
142 max-width: 450px;
142 max-width: 450px;
143 }
143 }
144 }
144 }
145
145
146 &.td-componentname {
146 &.td-componentname {
147 white-space: nowrap;
147 white-space: nowrap;
148 }
148 }
149
149
150 &.td-name {
150 &.td-name {
151
151
152 }
152 }
153
153
154 &.td-journalaction {
154 &.td-journalaction {
155 min-width: 300px;
155 min-width: 300px;
156
156
157 .journal_action_params {
157 .journal_action_params {
158 // waiting for feedback
158 // waiting for feedback
159 }
159 }
160 }
160 }
161
161
162 &.td-active {
162 &.td-active {
163 padding-left: .65em;
163 padding-left: .65em;
164 }
164 }
165
165
166 &.td-url {
166 &.td-url {
167 white-space: nowrap;
167 white-space: nowrap;
168 }
168 }
169
169
170 &.td-comments {
170 &.td-comments {
171 min-width: 3em;
171 min-width: 3em;
172 }
172 }
173
173
174 &.td-buttons {
174 &.td-buttons {
175 padding: .3em 0;
175 padding: .3em 0;
176 }
176 }
177
177
178 &.td-action {
178 &.td-action {
179 // this is for the remove/delete/edit buttons
179 // this is for the remove/delete/edit buttons
180 padding-right: 0;
180 padding-right: 0;
181 min-width: 95px;
181 min-width: 95px;
182 text-transform: capitalize;
182 text-transform: capitalize;
183
183
184 i {
184 i {
185 display: none;
185 display: none;
186 }
186 }
187 }
187 }
188
188
189 // TODO: lisa: this needs to be cleaned up with the buttons
189 // TODO: lisa: this needs to be cleaned up with the buttons
190 .grid_edit,
190 .grid_edit,
191 .grid_delete {
191 .grid_delete {
192 display: inline-block;
192 display: inline-block;
193 margin: 0 @padding/3 0 0;
193 margin: 0 @padding/3 0 0;
194 font-family: @text-light;
194 font-family: @text-light;
195
195
196 i {
196 i {
197 display: none;
197 display: none;
198 }
198 }
199 }
199 }
200
200
201 .grid_edit + .grid_delete {
201 .grid_edit + .grid_delete {
202 border-left: @border-thickness solid @grey5;
202 border-left: @border-thickness solid @grey5;
203 padding-left: @padding/2;
203 padding-left: @padding/2;
204 }
204 }
205
205
206 &.td-compare {
206 &.td-compare {
207
207
208 input {
208 input {
209 margin-right: 1em;
209 margin-right: 1em;
210 }
210 }
211
211
212 .compare-radio-button {
212 .compare-radio-button {
213 margin: 0 1em 0 0;
213 margin: 0 1em 0 0;
214 }
214 }
215
215
216
216
217 }
217 }
218
218
219 &.td-tags {
219 &.td-tags {
220 padding: .5em 1em .5em 0;
220 padding: .5em 1em .5em 0;
221 width: 140px;
221 width: 140px;
222
222
223 .tag {
223 .tag {
224 margin: 1px;
224 margin: 1px;
225 float: left;
225 float: left;
226 }
226 }
227 }
227 }
228
228
229 .icon-svn, .icon-hg, .icon-git {
229 .icon-svn, .icon-hg, .icon-git {
230 font-size: 1.4em;
230 font-size: 1.4em;
231 }
231 }
232
232
233 &.collapse_commit,
233 &.collapse_commit,
234 &.expand_commit {
234 &.expand_commit {
235 padding-right: 0;
235 padding-right: 0;
236 padding-left: 1em;
236 padding-left: 1em;
237 }
237 }
238 }
238 }
239
239
240 .perm_admin_row {
240 .perm_admin_row {
241 color: @grey4;
241 color: @grey4;
242 background-color: @grey6;
242 background-color: @grey6;
243 }
243 }
244
244
245 .noborder {
245 .noborder {
246 border: none;
246 border: none;
247
247
248 td {
248 td {
249 border: none;
249 border: none;
250 }
250 }
251 }
251 }
252 }
252 }
253 .rctable.audit-log {
253 .rctable.audit-log {
254 td {
254 td {
255 vertical-align: top;
255 vertical-align: top;
256 }
256 }
257 }
257 }
258
258
259 // TRUNCATING
259 // TRUNCATING
260 // TODO: lisaq: should this possibly be moved out of tables.less?
260 // TODO: lisaq: should this possibly be moved out of tables.less?
261 // for truncated text
261 // for truncated text
262 // used inside of table cells and in code block headers
262 // used inside of table cells and in code block headers
263 .truncate-wrap {
263 .truncate-wrap {
264 white-space: nowrap !important;
264 white-space: nowrap !important;
265
265
266 //truncated text
266 //truncated text
267 .truncate {
267 .truncate {
268 max-width: 450px;
268 max-width: 450px;
269 width: 300px;
269 width: 300px;
270 overflow: hidden;
270 overflow: hidden;
271 text-overflow: ellipsis;
271 text-overflow: ellipsis;
272 -o-text-overflow: ellipsis;
272 -o-text-overflow: ellipsis;
273 -ms-text-overflow: ellipsis;
273 -ms-text-overflow: ellipsis;
274
274
275 &.autoexpand {
275 &.autoexpand {
276 width: 120px;
276 width: 120px;
277 margin-right: 200px;
277 margin-right: 200px;
278 }
278 }
279 }
279 }
280 &:hover .truncate.autoexpand {
280 &:hover .truncate.autoexpand {
281 overflow: visible;
281 overflow: visible;
282 }
282 }
283
283
284 .tags-truncate {
284 .tags-truncate {
285 width: 150px;
285 width: 150px;
286 height: 22px;
286 height: 22px;
287 overflow: hidden;
287 overflow: hidden;
288
288
289 .tag {
289 .tag {
290 display: inline-block;
290 display: inline-block;
291 }
291 }
292
292
293 &.truncate {
293 &.truncate {
294 height: 22px;
294 height: 22px;
295 max-height:2em;
295 max-height:2em;
296 width: 140px;
296 width: 140px;
297 }
297 }
298 }
298 }
299 }
299 }
300
300
301 .apikeys_wrap {
301 .apikeys_wrap {
302 margin-bottom: @padding;
302 margin-bottom: @padding;
303
303
304 table.rctable td:first-child {
304 table.rctable td:first-child {
305 width: 340px;
305 width: 340px;
306 }
306 }
307 }
307 }
308
308
309
309
310
310
311 // SPECIAL CASES
311 // SPECIAL CASES
312
312
313 // Repository Followers
313 // Repository Followers
314 table.rctable.followers_data {
314 table.rctable.followers_data {
315 width: 75%;
315 width: 75%;
316 margin: 0;
316 margin: 0;
317 }
317 }
318
318
319 // Repository List
319 // Repository List
320 // Group Members List
320 // Group Members List
321 table.rctable.group_members,
321 table.rctable.group_members,
322 table#repo_list_table {
322 table#repo_list_table {
323 min-width: 600px;
323 min-width: 600px;
324 }
324 }
325
325
326 // Keyboard mappings
326 // Keyboard mappings
327 table.keyboard-mappings {
327 table.keyboard-mappings {
328 th {
328 th {
329 text-align: left;
329 text-align: left;
330 font-family: @text-semibold;
330 font-family: @text-semibold;
331 }
331 }
332 }
332 }
333
333
334 // Branches, Tags, and Bookmarks
334 // Branches, Tags, and Bookmarks
335 #obj_list_table.dataTable {
335 #obj_list_table.dataTable {
336 td.td-time {
336 td.td-time {
337 padding-right: 1em;
337 padding-right: 1em;
338 }
338 }
339 }
339 }
340
340
341 // User Admin
341 // User Admin
342 .rctable.useremails,
342 .rctable.useremails,
343 .rctable.account_emails {
343 .rctable.account_emails {
344 .tag,
344 .tag,
345 .btn {
345 .btn {
346 float: right;
346 float: right;
347 }
347 }
348 .btn { //to line up with tags
348 .btn { //to line up with tags
349 margin-right: 1.65em;
349 margin-right: 1.65em;
350 }
350 }
351 }
351 }
352
352
353 // User List
353 // User List
354 #user_list_table {
354 #user_list_table {
355
355
356 td.td-user {
356 td.td-user {
357 min-width: 100px;
357 min-width: 100px;
358 }
358 }
359 }
359 }
360
360
361 // Pull Request List Table
361 // Pull Request List Table
362 #pull_request_list_table.dataTable {
362 #pull_request_list_table.dataTable {
363
363
364 //TODO: lisa: This needs to be removed once the description is adjusted
364 //TODO: lisa: This needs to be removed once the description is adjusted
365 // for using an expand_commit button (see issue 765)
365 // for using an expand_commit button (see issue 765)
366 td {
366 td {
367 vertical-align: middle;
367 vertical-align: middle;
368 }
368 }
369 }
369 }
370
370
371 // Settings (no border)
371 // Settings (no border)
372 table.rctable.dl-settings {
372 table.rctable.dl-settings {
373 td {
373 td {
374 border: none;
374 border: none;
375 }
375 }
376 }
376 }
377
377
378
378
379 // Statistics
379 // Statistics
380 table.trending_language_tbl {
380 table.trending_language_tbl {
381 width: 100%;
381 width: 100%;
382 line-height: 1em;
382 line-height: 1em;
383
383
384 td div {
384 td div {
385 overflow: visible;
385 overflow: visible;
386 }
386 }
387 }
387 }
388
388
389 .trending_language_tbl, .trending_language_tbl td {
389 .trending_language_tbl, .trending_language_tbl td {
390 border: 0;
390 border: 0;
391 margin: 0;
391 margin: 0;
392 padding: 0;
392 padding: 0;
393 background: transparent;
393 background: transparent;
394 }
394 }
395
395
396 .trending_language_tbl, .trending_language_tbl tr {
396 .trending_language_tbl, .trending_language_tbl tr {
397 border-spacing: 0 3px;
397 border-spacing: 0 3px;
398 }
398 }
399
399
400 .trending_language {
400 .trending_language {
401 position: relative;
401 position: relative;
402 width: 100%;
402 width: 100%;
403 height: 19px;
403 height: 19px;
404 overflow: hidden;
404 overflow: hidden;
405 background-color: @grey6;
405 background-color: @grey6;
406
406
407 span, b{
407 span, b{
408 position: absolute;
408 position: absolute;
409 display: block;
409 display: block;
410 height: 12px;
410 height: 12px;
411 margin-bottom: 0px;
411 margin-bottom: 0px;
412 white-space: pre;
412 white-space: pre;
413 padding: floor(@basefontsize/4);
413 padding: floor(@basefontsize/4);
414 top: 0;
414 top: 0;
415 left: 0;
415 left: 0;
416 }
416 }
417
417
418 span{
418 span{
419 color: @text-color;
419 color: @text-color;
420 z-index: 0;
420 z-index: 0;
421 min-width: 20px;
421 min-width: 20px;
422 }
422 }
423
423
424 b {
424 b {
425 z-index: 1;
425 z-index: 1;
426 overflow: hidden;
426 overflow: hidden;
427 background-color: @rcblue;
427 background-color: @rcblue;
428 color: #FFF;
428 color: #FFF;
429 text-decoration: none;
429 text-decoration: none;
430 }
430 }
431
431
432 }
432 }
433
433
434 // Changesets
434 // Changesets
435 #changesets.rctable {
435 #changesets.rctable {
436
436
437 // td must be fixed height for graph
437 // td must be fixed height for graph
438 td {
438 td {
439 height: 32px;
439 height: 32px;
440 padding: 0 1em 0 0;
440 padding: 0 1em 0 0;
441 vertical-align: middle;
441 vertical-align: middle;
442 white-space: nowrap;
442 white-space: nowrap;
443
443
444 &.td-description {
444 &.td-description {
445 white-space: normal;
445 white-space: normal;
446 }
446 }
447
447
448 &.expand_commit {
448 &.expand_commit {
449 padding-right: 0;
449 padding-right: 0;
450 }
450 }
451 }
451 }
452 }
452 }
453
453
454 // Compare
454 // Compare
455 table.compare_view_commits {
455 table.compare_view_commits {
456 margin-top: @space;
456 margin-top: @space;
457
457
458 td.td-time {
458 td.td-time {
459 padding-left: .5em;
459 padding-left: .5em;
460 }
460 }
461
461
462 // special case to not show hover actions on hidden indicator
462 // special case to not show hover actions on hidden indicator
463 tr.compare_select_hidden:hover {
463 tr.compare_select_hidden:hover {
464 cursor: inherit;
464 cursor: inherit;
465
465
466 td {
466 td {
467 background-color: inherit;
467 background-color: inherit;
468 }
468 }
469 }
469 }
470
470
471 tr:hover {
471 tr:hover {
472 cursor: pointer;
472 cursor: pointer;
473
473
474 td {
474 td {
475 background-color: lighten(@alert4,25%);
475 background-color: lighten(@alert4,25%);
476 }
476 }
477 }
477 }
478
478
479
479
480 }
480 }
481
481
482 .file_history {
482 .file_history {
483 td.td-actions {
483 td.td-actions {
484 text-align: right;
484 text-align: right;
485 }
485 }
486 }
486 }
487
487
488 .compare_view_files {
489
490 td.td-actions {
491 text-align: right;
492 }
493
494 .flag_status {
495 margin: 0 0 0 5px;
496 }
497
498 td.injected_diff {
499
500 .code-difftable {
501 border:none;
502 }
503
504 .diff-container {
505 border: @border-thickness solid @border-default-color;
506 .border-radius(@border-radius);
507 }
508
509 div.diffblock {
510 border:none;
511 }
512
513 div.code-body {
514 max-width: 1152px;
515 }
516 }
517
518 .rctable {
519
520 td {
521 padding-top: @space;
522 }
523
524 &:first-child td {
525 padding-top: 0;
526 }
527 }
528
529 .comment-bubble,
530 .show_comments {
531 float: right;
532 visibility: hidden;
533 padding: 0 1em 0 0;
534 }
535
536 .injected_diff {
537 padding-bottom: @padding;
538 }
539 }
540
488
541 // Gist List
489 // Gist List
542 #gist_list_table {
490 #gist_list_table {
543 td {
491 td {
544 vertical-align: middle;
492 vertical-align: middle;
545
493
546 div{
494 div{
547 display: inline-block;
495 display: inline-block;
548 vertical-align: middle;
496 vertical-align: middle;
549 }
497 }
550
498
551 img{
499 img{
552 vertical-align: middle;
500 vertical-align: middle;
553 }
501 }
554 }
502 }
555 }
503 }
@@ -1,591 +1,555 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 Clipboard('.clipboard-action');
219 var clipboard = new Clipboard('.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 $('.compare_view_files').on(
297 'mouseenter mouseleave', 'tr.line .lineno a',function(event) {
298 if (event.type === "mouseenter") {
299 $(this).parents('tr.line').addClass('hover');
300 } else {
301 $(this).parents('tr.line').removeClass('hover');
302 }
303 });
304
296
305 $('.compare_view_files').on(
297 $('body').on('click', '.cb-lineno a', function(event) {
306 'mouseenter mouseleave', 'tr.line .add-comment-line a',function(event){
307 if (event.type === "mouseenter") {
308 $(this).parents('tr.line').addClass('commenting');
309 } else {
310 $(this).parents('tr.line').removeClass('commenting');
311 }
312 });
313
314 $('body').on( /* TODO: replace the $('.compare_view_files').on('click') below
315 when new diffs are integrated */
316 'click', '.cb-lineno a', function(event) {
317
298
318 function sortNumber(a,b) {
299 function sortNumber(a,b) {
319 return a - b;
300 return a - b;
320 }
301 }
321
302
322 if ($(this).attr('data-line-no') !== "") {
303 var lineNo = $(this).data('lineNo');
304 if (lineNo) {
323
305
324 // on shift, we do a range selection, if we got previous line
306 // on shift, we do a range selection, if we got previous line
325 var prevLine = $('.cb-line-selected a').attr('data-line-no');
307 var prevLine = $('.cb-line-selected a').data('lineNo');
326 if (event.shiftKey && prevLine !== undefined) {
308 if (event.shiftKey && prevLine !== undefined) {
327 var prevLine = parseInt(prevLine);
309 var prevLine = parseInt(prevLine);
328 var nextLine = parseInt($(this).attr('data-line-no'));
310 var nextLine = parseInt(lineNo);
329 var pos = [prevLine, nextLine].sort(sortNumber);
311 var pos = [prevLine, nextLine].sort(sortNumber);
330 var anchor = '#L{0}-{1}'.format(pos[0], pos[1]);
312 var anchor = '#L{0}-{1}'.format(pos[0], pos[1]);
331
313
332 } else {
314 } else {
333 var nextLine = parseInt($(this).attr('data-line-no'));
315
316 var nextLine = parseInt(lineNo);
334 var pos = [nextLine, nextLine];
317 var pos = [nextLine, nextLine];
335 var anchor = '#L{0}'.format(pos[0]);
318 var anchor = '#L{0}'.format(pos[0]);
336
319
337 }
320 }
338 // highlight
321 // highlight
339 var range = [];
322 var range = [];
340 for (var i = pos[0]; i <= pos[1]; i++) {
323 for (var i = pos[0]; i <= pos[1]; i++) {
341 range.push(i);
324 range.push(i);
342 }
325 }
343 // clear selection
326 // clear selection
344 $('.cb-line-selected').removeClass('cb-line-selected');
327 $('.cb-line-selected').removeClass('cb-line-selected');
345
328
346 $.each(range, function (i, lineNo) {
329 $.each(range, function (i, lineNo) {
347 var line_td = $('td.cb-lineno#L' + lineNo);
330 var line_td = $('td.cb-lineno#L' + lineNo);
348 if (line_td.length) {
331 if (line_td.length) {
349 line_td.addClass('cb-line-selected'); // line number td
332 line_td.addClass('cb-line-selected'); // line number td
350 line_td.prev().addClass('cb-line-selected'); // line data
333 line_td.prev().addClass('cb-line-selected'); // line data
351 line_td.next().addClass('cb-line-selected'); // line content
334 line_td.next().addClass('cb-line-selected'); // line content
352 }
335 }
353 });
336 });
354
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 }
348
355 // Replace URL without jumping to it if browser supports.
349 // Replace URL without jumping to it if browser supports.
356 // Default otherwise
350 // Default otherwise
357 if (history.pushState) {
351 if (history.pushState && anchor !== undefined) {
358 var new_location = location.href.rstrip('#');
352 var new_location = location.href.rstrip('#');
359 if (location.hash) {
353 if (location.hash) {
360 // location without hash
354 // location without hash
361 new_location = new_location.replace(location.hash, "");
355 new_location = new_location.replace(location.hash, "");
362 }
356 }
363
357
364 // Make new anchor url
358 // Make new anchor url
365 new_location = new_location + anchor;
359 new_location = new_location + anchor;
366 history.pushState(true, document.title, new_location);
360 history.pushState(true, document.title, new_location);
367
361
368 return false;
362 return false;
369 }
363 }
370 }
364
371 });
365 });
372
366
373 $('.compare_view_files').on( /* TODO: replace this with .cb function above
374 when new diffs are integrated */
375 'click', 'tr.line .lineno a',function(event) {
376 if ($(this).text() != ""){
377 $('tr.line').removeClass('selected');
378 $(this).parents("tr.line").addClass('selected');
379
380 // Replace URL without jumping to it if browser supports.
381 // Default otherwise
382 if (history.pushState) {
383 var new_location = location.href;
384 if (location.hash){
385 new_location = new_location.replace(location.hash, "");
386 }
387
388 // Make new anchor url
389 var new_location = new_location+$(this).attr('href');
390 history.pushState(true, document.title, new_location);
391
392 return false;
393 }
394 }
395 });
396
397 $('.compare_view_files').on(
398 'click', 'tr.line .add-comment-line a',function(event) {
399 var tr = $(event.currentTarget).parents('tr.line')[0];
400 injectInlineForm(tr);
401 return false;
402 });
403
367
404 $('.collapse_file').on('click', function(e) {
368 $('.collapse_file').on('click', function(e) {
405 e.stopPropagation();
369 e.stopPropagation();
406 if ($(e.target).is('a')) { return; }
370 if ($(e.target).is('a')) { return; }
407 var node = $(e.delegateTarget).first();
371 var node = $(e.delegateTarget).first();
408 var icon = $($(node.children().first()).children().first());
372 var icon = $($(node.children().first()).children().first());
409 var id = node.attr('fid');
373 var id = node.attr('fid');
410 var target = $('#'+id);
374 var target = $('#'+id);
411 var tr = $('#tr_'+id);
375 var tr = $('#tr_'+id);
412 var diff = $('#diff_'+id);
376 var diff = $('#diff_'+id);
413 if(node.hasClass('expand_file')){
377 if(node.hasClass('expand_file')){
414 node.removeClass('expand_file');
378 node.removeClass('expand_file');
415 icon.removeClass('expand_file_icon');
379 icon.removeClass('expand_file_icon');
416 node.addClass('collapse_file');
380 node.addClass('collapse_file');
417 icon.addClass('collapse_file_icon');
381 icon.addClass('collapse_file_icon');
418 diff.show();
382 diff.show();
419 tr.show();
383 tr.show();
420 target.show();
384 target.show();
421 } else {
385 } else {
422 node.removeClass('collapse_file');
386 node.removeClass('collapse_file');
423 icon.removeClass('collapse_file_icon');
387 icon.removeClass('collapse_file_icon');
424 node.addClass('expand_file');
388 node.addClass('expand_file');
425 icon.addClass('expand_file_icon');
389 icon.addClass('expand_file_icon');
426 diff.hide();
390 diff.hide();
427 tr.hide();
391 tr.hide();
428 target.hide();
392 target.hide();
429 }
393 }
430 });
394 });
431
395
432 $('#expand_all_files').click(function() {
396 $('#expand_all_files').click(function() {
433 $('.expand_file').each(function() {
397 $('.expand_file').each(function() {
434 var node = $(this);
398 var node = $(this);
435 var icon = $($(node.children().first()).children().first());
399 var icon = $($(node.children().first()).children().first());
436 var id = $(this).attr('fid');
400 var id = $(this).attr('fid');
437 var target = $('#'+id);
401 var target = $('#'+id);
438 var tr = $('#tr_'+id);
402 var tr = $('#tr_'+id);
439 var diff = $('#diff_'+id);
403 var diff = $('#diff_'+id);
440 node.removeClass('expand_file');
404 node.removeClass('expand_file');
441 icon.removeClass('expand_file_icon');
405 icon.removeClass('expand_file_icon');
442 node.addClass('collapse_file');
406 node.addClass('collapse_file');
443 icon.addClass('collapse_file_icon');
407 icon.addClass('collapse_file_icon');
444 diff.show();
408 diff.show();
445 tr.show();
409 tr.show();
446 target.show();
410 target.show();
447 });
411 });
448 });
412 });
449
413
450 $('#collapse_all_files').click(function() {
414 $('#collapse_all_files').click(function() {
451 $('.collapse_file').each(function() {
415 $('.collapse_file').each(function() {
452 var node = $(this);
416 var node = $(this);
453 var icon = $($(node.children().first()).children().first());
417 var icon = $($(node.children().first()).children().first());
454 var id = $(this).attr('fid');
418 var id = $(this).attr('fid');
455 var target = $('#'+id);
419 var target = $('#'+id);
456 var tr = $('#tr_'+id);
420 var tr = $('#tr_'+id);
457 var diff = $('#diff_'+id);
421 var diff = $('#diff_'+id);
458 node.removeClass('collapse_file');
422 node.removeClass('collapse_file');
459 icon.removeClass('collapse_file_icon');
423 icon.removeClass('collapse_file_icon');
460 node.addClass('expand_file');
424 node.addClass('expand_file');
461 icon.addClass('expand_file_icon');
425 icon.addClass('expand_file_icon');
462 diff.hide();
426 diff.hide();
463 tr.hide();
427 tr.hide();
464 target.hide();
428 target.hide();
465 });
429 });
466 });
430 });
467
431
468 // Mouse over behavior for comments and line selection
432 // Mouse over behavior for comments and line selection
469
433
470 // Select the line that comes from the url anchor
434 // Select the line that comes from the url anchor
471 // At the time of development, Chrome didn't seem to support jquery's :target
435 // At the time of development, Chrome didn't seem to support jquery's :target
472 // element, so I had to scroll manually
436 // element, so I had to scroll manually
473
437
474 if (location.hash) {
438 if (location.hash) {
475 var result = splitDelimitedHash(location.hash);
439 var result = splitDelimitedHash(location.hash);
476 var loc = result.loc;
440 var loc = result.loc;
477 if (loc.length > 1) {
441 if (loc.length > 1) {
478
442
479 var highlightable_line_tds = [];
443 var highlightable_line_tds = [];
480
444
481 // source code line format
445 // source code line format
482 var page_highlights = loc.substring(
446 var page_highlights = loc.substring(
483 loc.indexOf('#') + 1).split('L');
447 loc.indexOf('#') + 1).split('L');
484
448
485 if (page_highlights.length > 1) {
449 if (page_highlights.length > 1) {
486 var highlight_ranges = page_highlights[1].split(",");
450 var highlight_ranges = page_highlights[1].split(",");
487 var h_lines = [];
451 var h_lines = [];
488 for (var pos in highlight_ranges) {
452 for (var pos in highlight_ranges) {
489 var _range = highlight_ranges[pos].split('-');
453 var _range = highlight_ranges[pos].split('-');
490 if (_range.length === 2) {
454 if (_range.length === 2) {
491 var start = parseInt(_range[0]);
455 var start = parseInt(_range[0]);
492 var end = parseInt(_range[1]);
456 var end = parseInt(_range[1]);
493 if (start < end) {
457 if (start < end) {
494 for (var i = start; i <= end; i++) {
458 for (var i = start; i <= end; i++) {
495 h_lines.push(i);
459 h_lines.push(i);
496 }
460 }
497 }
461 }
498 }
462 }
499 else {
463 else {
500 h_lines.push(parseInt(highlight_ranges[pos]));
464 h_lines.push(parseInt(highlight_ranges[pos]));
501 }
465 }
502 }
466 }
503 for (pos in h_lines) {
467 for (pos in h_lines) {
504 var line_td = $('td.cb-lineno#L' + h_lines[pos]);
468 var line_td = $('td.cb-lineno#L' + h_lines[pos]);
505 if (line_td.length) {
469 if (line_td.length) {
506 highlightable_line_tds.push(line_td);
470 highlightable_line_tds.push(line_td);
507 }
471 }
508 }
472 }
509 }
473 }
510
474
511 // now check a direct id reference (diff page)
475 // now check a direct id reference (diff page)
512 if ($(loc).length && $(loc).hasClass('cb-lineno')) {
476 if ($(loc).length && $(loc).hasClass('cb-lineno')) {
513 highlightable_line_tds.push($(loc));
477 highlightable_line_tds.push($(loc));
514 }
478 }
515 $.each(highlightable_line_tds, function (i, $td) {
479 $.each(highlightable_line_tds, function (i, $td) {
516 $td.addClass('cb-line-selected'); // line number td
480 $td.addClass('cb-line-selected'); // line number td
517 $td.prev().addClass('cb-line-selected'); // line data
481 $td.prev().addClass('cb-line-selected'); // line data
518 $td.next().addClass('cb-line-selected'); // line content
482 $td.next().addClass('cb-line-selected'); // line content
519 });
483 });
520
484
521 if (highlightable_line_tds.length) {
485 if (highlightable_line_tds.length) {
522 var $first_line_td = highlightable_line_tds[0];
486 var $first_line_td = highlightable_line_tds[0];
523 scrollToElement($first_line_td);
487 scrollToElement($first_line_td);
524 $.Topic('/ui/plugins/code/anchor_focus').prepareOrPublish({
488 $.Topic('/ui/plugins/code/anchor_focus').prepareOrPublish({
525 td: $first_line_td,
489 td: $first_line_td,
526 remainder: result.remainder
490 remainder: result.remainder
527 });
491 });
528 }
492 }
529 }
493 }
530 }
494 }
531 collapsableContent();
495 collapsableContent();
532 });
496 });
533
497
534 var feedLifetimeOptions = function(query, initialData){
498 var feedLifetimeOptions = function(query, initialData){
535 var data = {results: []};
499 var data = {results: []};
536 var isQuery = typeof query.term !== 'undefined';
500 var isQuery = typeof query.term !== 'undefined';
537
501
538 var section = _gettext('Lifetime');
502 var section = _gettext('Lifetime');
539 var children = [];
503 var children = [];
540
504
541 //filter results
505 //filter results
542 $.each(initialData.results, function(idx, value) {
506 $.each(initialData.results, function(idx, value) {
543
507
544 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
508 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
545 children.push({
509 children.push({
546 'id': this.id,
510 'id': this.id,
547 'text': this.text
511 'text': this.text
548 })
512 })
549 }
513 }
550
514
551 });
515 });
552 data.results.push({
516 data.results.push({
553 'text': section,
517 'text': section,
554 'children': children
518 'children': children
555 });
519 });
556
520
557 if (isQuery) {
521 if (isQuery) {
558
522
559 var now = moment.utc();
523 var now = moment.utc();
560
524
561 var parseQuery = function(entry, now){
525 var parseQuery = function(entry, now){
562 var fmt = 'DD/MM/YYYY H:mm';
526 var fmt = 'DD/MM/YYYY H:mm';
563 var parsed = moment.utc(entry, fmt);
527 var parsed = moment.utc(entry, fmt);
564 var diffInMin = parsed.diff(now, 'minutes');
528 var diffInMin = parsed.diff(now, 'minutes');
565
529
566 if (diffInMin > 0){
530 if (diffInMin > 0){
567 return {
531 return {
568 id: diffInMin,
532 id: diffInMin,
569 text: parsed.format(fmt)
533 text: parsed.format(fmt)
570 }
534 }
571 } else {
535 } else {
572 return {
536 return {
573 id: undefined,
537 id: undefined,
574 text: parsed.format('DD/MM/YYYY') + ' ' + _gettext('date not in future')
538 text: parsed.format('DD/MM/YYYY') + ' ' + _gettext('date not in future')
575 }
539 }
576 }
540 }
577
541
578
542
579 };
543 };
580
544
581 data.results.push({
545 data.results.push({
582 'text': _gettext('Specified expiration date'),
546 'text': _gettext('Specified expiration date'),
583 'children': [{
547 'children': [{
584 'id': parseQuery(query.term, now).id,
548 'id': parseQuery(query.term, now).id,
585 'text': parseQuery(query.term, now).text
549 'text': parseQuery(query.term, now).text
586 }]
550 }]
587 });
551 });
588 }
552 }
589
553
590 query.callback(data);
554 query.callback(data);
591 };
555 };
@@ -1,811 +1,811 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 var firefoxAnchorFix = function() {
19 var firefoxAnchorFix = function() {
20 // hack to make anchor links behave properly on firefox, in our inline
20 // hack to make anchor links behave properly on firefox, in our inline
21 // comments generation when comments are injected firefox is misbehaving
21 // comments generation when comments are injected firefox is misbehaving
22 // when jumping to anchor links
22 // when jumping to anchor links
23 if (location.href.indexOf('#') > -1) {
23 if (location.href.indexOf('#') > -1) {
24 location.href += '';
24 location.href += '';
25 }
25 }
26 };
26 };
27
27
28 var linkifyComments = function(comments) {
28 var linkifyComments = function(comments) {
29 var firstCommentId = null;
29 var firstCommentId = null;
30 if (comments) {
30 if (comments) {
31 firstCommentId = $(comments[0]).data('comment-id');
31 firstCommentId = $(comments[0]).data('comment-id');
32 }
32 }
33
33
34 if (firstCommentId){
34 if (firstCommentId){
35 $('#inline-comments-counter').attr('href', '#comment-' + firstCommentId);
35 $('#inline-comments-counter').attr('href', '#comment-' + firstCommentId);
36 }
36 }
37 };
37 };
38
38
39 var bindToggleButtons = function() {
39 var bindToggleButtons = function() {
40 $('.comment-toggle').on('click', function() {
40 $('.comment-toggle').on('click', function() {
41 $(this).parent().nextUntil('tr.line').toggle('inline-comments');
41 $(this).parent().nextUntil('tr.line').toggle('inline-comments');
42 });
42 });
43 };
43 };
44
44
45 /* Comment form for main and inline comments */
45 /* Comment form for main and inline comments */
46 (function(mod) {
46 (function(mod) {
47
47
48 if (typeof exports == "object" && typeof module == "object") {
48 if (typeof exports == "object" && typeof module == "object") {
49 // CommonJS
49 // CommonJS
50 module.exports = mod();
50 module.exports = mod();
51 }
51 }
52 else {
52 else {
53 // Plain browser env
53 // Plain browser env
54 (this || window).CommentForm = mod();
54 (this || window).CommentForm = mod();
55 }
55 }
56
56
57 })(function() {
57 })(function() {
58 "use strict";
58 "use strict";
59
59
60 function CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId) {
60 function CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId) {
61 if (!(this instanceof CommentForm)) {
61 if (!(this instanceof CommentForm)) {
62 return new CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId);
62 return new CommentForm(formElement, commitId, pullRequestId, lineNo, initAutocompleteActions, resolvesCommentId);
63 }
63 }
64
64
65 // bind the element instance to our Form
65 // bind the element instance to our Form
66 $(formElement).get(0).CommentForm = this;
66 $(formElement).get(0).CommentForm = this;
67
67
68 this.withLineNo = function(selector) {
68 this.withLineNo = function(selector) {
69 var lineNo = this.lineNo;
69 var lineNo = this.lineNo;
70 if (lineNo === undefined) {
70 if (lineNo === undefined) {
71 return selector
71 return selector
72 } else {
72 } else {
73 return selector + '_' + lineNo;
73 return selector + '_' + lineNo;
74 }
74 }
75 };
75 };
76
76
77 this.commitId = commitId;
77 this.commitId = commitId;
78 this.pullRequestId = pullRequestId;
78 this.pullRequestId = pullRequestId;
79 this.lineNo = lineNo;
79 this.lineNo = lineNo;
80 this.initAutocompleteActions = initAutocompleteActions;
80 this.initAutocompleteActions = initAutocompleteActions;
81
81
82 this.previewButton = this.withLineNo('#preview-btn');
82 this.previewButton = this.withLineNo('#preview-btn');
83 this.previewContainer = this.withLineNo('#preview-container');
83 this.previewContainer = this.withLineNo('#preview-container');
84
84
85 this.previewBoxSelector = this.withLineNo('#preview-box');
85 this.previewBoxSelector = this.withLineNo('#preview-box');
86
86
87 this.editButton = this.withLineNo('#edit-btn');
87 this.editButton = this.withLineNo('#edit-btn');
88 this.editContainer = this.withLineNo('#edit-container');
88 this.editContainer = this.withLineNo('#edit-container');
89 this.cancelButton = this.withLineNo('#cancel-btn');
89 this.cancelButton = this.withLineNo('#cancel-btn');
90 this.commentType = this.withLineNo('#comment_type');
90 this.commentType = this.withLineNo('#comment_type');
91
91
92 this.resolvesId = null;
92 this.resolvesId = null;
93 this.resolvesActionId = null;
93 this.resolvesActionId = null;
94
94
95 this.closesPr = '#close_pull_request';
95 this.closesPr = '#close_pull_request';
96
96
97 this.cmBox = this.withLineNo('#text');
97 this.cmBox = this.withLineNo('#text');
98 this.cm = initCommentBoxCodeMirror(this, this.cmBox, this.initAutocompleteActions);
98 this.cm = initCommentBoxCodeMirror(this, this.cmBox, this.initAutocompleteActions);
99
99
100 this.statusChange = this.withLineNo('#change_status');
100 this.statusChange = this.withLineNo('#change_status');
101
101
102 this.submitForm = formElement;
102 this.submitForm = formElement;
103 this.submitButton = $(this.submitForm).find('input[type="submit"]');
103 this.submitButton = $(this.submitForm).find('input[type="submit"]');
104 this.submitButtonText = this.submitButton.val();
104 this.submitButtonText = this.submitButton.val();
105
105
106 this.previewUrl = pyroutes.url('repo_commit_comment_preview',
106 this.previewUrl = pyroutes.url('repo_commit_comment_preview',
107 {'repo_name': templateContext.repo_name,
107 {'repo_name': templateContext.repo_name,
108 'commit_id': templateContext.commit_data.commit_id});
108 'commit_id': templateContext.commit_data.commit_id});
109
109
110 if (resolvesCommentId){
110 if (resolvesCommentId){
111 this.resolvesId = '#resolve_comment_{0}'.format(resolvesCommentId);
111 this.resolvesId = '#resolve_comment_{0}'.format(resolvesCommentId);
112 this.resolvesActionId = '#resolve_comment_action_{0}'.format(resolvesCommentId);
112 this.resolvesActionId = '#resolve_comment_action_{0}'.format(resolvesCommentId);
113 $(this.commentType).prop('disabled', true);
113 $(this.commentType).prop('disabled', true);
114 $(this.commentType).addClass('disabled');
114 $(this.commentType).addClass('disabled');
115
115
116 // disable select
116 // disable select
117 setTimeout(function() {
117 setTimeout(function() {
118 $(self.statusChange).select2('readonly', true);
118 $(self.statusChange).select2('readonly', true);
119 }, 10);
119 }, 10);
120
120
121 var resolvedInfo = (
121 var resolvedInfo = (
122 '<li class="resolve-action">' +
122 '<li class="resolve-action">' +
123 '<input type="hidden" id="resolve_comment_{0}" name="resolve_comment_{0}" value="{0}">' +
123 '<input type="hidden" id="resolve_comment_{0}" name="resolve_comment_{0}" value="{0}">' +
124 '<button id="resolve_comment_action_{0}" class="resolve-text btn btn-sm" onclick="return Rhodecode.comments.submitResolution({0})">{1} #{0}</button>' +
124 '<button id="resolve_comment_action_{0}" class="resolve-text btn btn-sm" onclick="return Rhodecode.comments.submitResolution({0})">{1} #{0}</button>' +
125 '</li>'
125 '</li>'
126 ).format(resolvesCommentId, _gettext('resolve comment'));
126 ).format(resolvesCommentId, _gettext('resolve comment'));
127 $(resolvedInfo).insertAfter($(this.commentType).parent());
127 $(resolvedInfo).insertAfter($(this.commentType).parent());
128 }
128 }
129
129
130 // based on commitId, or pullRequestId decide where do we submit
130 // based on commitId, or pullRequestId decide where do we submit
131 // out data
131 // out data
132 if (this.commitId){
132 if (this.commitId){
133 this.submitUrl = pyroutes.url('repo_commit_comment_create',
133 this.submitUrl = pyroutes.url('repo_commit_comment_create',
134 {'repo_name': templateContext.repo_name,
134 {'repo_name': templateContext.repo_name,
135 'commit_id': this.commitId});
135 'commit_id': this.commitId});
136 this.selfUrl = pyroutes.url('repo_commit',
136 this.selfUrl = pyroutes.url('repo_commit',
137 {'repo_name': templateContext.repo_name,
137 {'repo_name': templateContext.repo_name,
138 'commit_id': this.commitId});
138 'commit_id': this.commitId});
139
139
140 } else if (this.pullRequestId) {
140 } else if (this.pullRequestId) {
141 this.submitUrl = pyroutes.url('pullrequest_comment_create',
141 this.submitUrl = pyroutes.url('pullrequest_comment_create',
142 {'repo_name': templateContext.repo_name,
142 {'repo_name': templateContext.repo_name,
143 'pull_request_id': this.pullRequestId});
143 'pull_request_id': this.pullRequestId});
144 this.selfUrl = pyroutes.url('pullrequest_show',
144 this.selfUrl = pyroutes.url('pullrequest_show',
145 {'repo_name': templateContext.repo_name,
145 {'repo_name': templateContext.repo_name,
146 'pull_request_id': this.pullRequestId});
146 'pull_request_id': this.pullRequestId});
147
147
148 } else {
148 } else {
149 throw new Error(
149 throw new Error(
150 'CommentForm requires pullRequestId, or commitId to be specified.')
150 'CommentForm requires pullRequestId, or commitId to be specified.')
151 }
151 }
152
152
153 // FUNCTIONS and helpers
153 // FUNCTIONS and helpers
154 var self = this;
154 var self = this;
155
155
156 this.isInline = function(){
156 this.isInline = function(){
157 return this.lineNo && this.lineNo != 'general';
157 return this.lineNo && this.lineNo != 'general';
158 };
158 };
159
159
160 this.getCmInstance = function(){
160 this.getCmInstance = function(){
161 return this.cm
161 return this.cm
162 };
162 };
163
163
164 this.setPlaceholder = function(placeholder) {
164 this.setPlaceholder = function(placeholder) {
165 var cm = this.getCmInstance();
165 var cm = this.getCmInstance();
166 if (cm){
166 if (cm){
167 cm.setOption('placeholder', placeholder);
167 cm.setOption('placeholder', placeholder);
168 }
168 }
169 };
169 };
170
170
171 this.getCommentStatus = function() {
171 this.getCommentStatus = function() {
172 return $(this.submitForm).find(this.statusChange).val();
172 return $(this.submitForm).find(this.statusChange).val();
173 };
173 };
174 this.getCommentType = function() {
174 this.getCommentType = function() {
175 return $(this.submitForm).find(this.commentType).val();
175 return $(this.submitForm).find(this.commentType).val();
176 };
176 };
177
177
178 this.getResolvesId = function() {
178 this.getResolvesId = function() {
179 return $(this.submitForm).find(this.resolvesId).val() || null;
179 return $(this.submitForm).find(this.resolvesId).val() || null;
180 };
180 };
181
181
182 this.getClosePr = function() {
182 this.getClosePr = function() {
183 return $(this.submitForm).find(this.closesPr).val() || null;
183 return $(this.submitForm).find(this.closesPr).val() || null;
184 };
184 };
185
185
186 this.markCommentResolved = function(resolvedCommentId){
186 this.markCommentResolved = function(resolvedCommentId){
187 $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolved').show();
187 $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolved').show();
188 $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolve').hide();
188 $('#comment-label-{0}'.format(resolvedCommentId)).find('.resolve').hide();
189 };
189 };
190
190
191 this.isAllowedToSubmit = function() {
191 this.isAllowedToSubmit = function() {
192 return !$(this.submitButton).prop('disabled');
192 return !$(this.submitButton).prop('disabled');
193 };
193 };
194
194
195 this.initStatusChangeSelector = function(){
195 this.initStatusChangeSelector = function(){
196 var formatChangeStatus = function(state, escapeMarkup) {
196 var formatChangeStatus = function(state, escapeMarkup) {
197 var originalOption = state.element;
197 var originalOption = state.element;
198 return '<div class="flag_status ' + $(originalOption).data('status') + ' pull-left"></div>' +
198 return '<div class="flag_status ' + $(originalOption).data('status') + ' pull-left"></div>' +
199 '<span>' + escapeMarkup(state.text) + '</span>';
199 '<span>' + escapeMarkup(state.text) + '</span>';
200 };
200 };
201 var formatResult = function(result, container, query, escapeMarkup) {
201 var formatResult = function(result, container, query, escapeMarkup) {
202 return formatChangeStatus(result, escapeMarkup);
202 return formatChangeStatus(result, escapeMarkup);
203 };
203 };
204
204
205 var formatSelection = function(data, container, escapeMarkup) {
205 var formatSelection = function(data, container, escapeMarkup) {
206 return formatChangeStatus(data, escapeMarkup);
206 return formatChangeStatus(data, escapeMarkup);
207 };
207 };
208
208
209 $(this.submitForm).find(this.statusChange).select2({
209 $(this.submitForm).find(this.statusChange).select2({
210 placeholder: _gettext('Status Review'),
210 placeholder: _gettext('Status Review'),
211 formatResult: formatResult,
211 formatResult: formatResult,
212 formatSelection: formatSelection,
212 formatSelection: formatSelection,
213 containerCssClass: "drop-menu status_box_menu",
213 containerCssClass: "drop-menu status_box_menu",
214 dropdownCssClass: "drop-menu-dropdown",
214 dropdownCssClass: "drop-menu-dropdown",
215 dropdownAutoWidth: true,
215 dropdownAutoWidth: true,
216 minimumResultsForSearch: -1
216 minimumResultsForSearch: -1
217 });
217 });
218 $(this.submitForm).find(this.statusChange).on('change', function() {
218 $(this.submitForm).find(this.statusChange).on('change', function() {
219 var status = self.getCommentStatus();
219 var status = self.getCommentStatus();
220
220
221 if (status && !self.isInline()) {
221 if (status && !self.isInline()) {
222 $(self.submitButton).prop('disabled', false);
222 $(self.submitButton).prop('disabled', false);
223 }
223 }
224
224
225 var placeholderText = _gettext('Comment text will be set automatically based on currently selected status ({0}) ...').format(status);
225 var placeholderText = _gettext('Comment text will be set automatically based on currently selected status ({0}) ...').format(status);
226 self.setPlaceholder(placeholderText)
226 self.setPlaceholder(placeholderText)
227 })
227 })
228 };
228 };
229
229
230 // reset the comment form into it's original state
230 // reset the comment form into it's original state
231 this.resetCommentFormState = function(content) {
231 this.resetCommentFormState = function(content) {
232 content = content || '';
232 content = content || '';
233
233
234 $(this.editContainer).show();
234 $(this.editContainer).show();
235 $(this.editButton).parent().addClass('active');
235 $(this.editButton).parent().addClass('active');
236
236
237 $(this.previewContainer).hide();
237 $(this.previewContainer).hide();
238 $(this.previewButton).parent().removeClass('active');
238 $(this.previewButton).parent().removeClass('active');
239
239
240 this.setActionButtonsDisabled(true);
240 this.setActionButtonsDisabled(true);
241 self.cm.setValue(content);
241 self.cm.setValue(content);
242 self.cm.setOption("readOnly", false);
242 self.cm.setOption("readOnly", false);
243
243
244 if (this.resolvesId) {
244 if (this.resolvesId) {
245 // destroy the resolve action
245 // destroy the resolve action
246 $(this.resolvesId).parent().remove();
246 $(this.resolvesId).parent().remove();
247 }
247 }
248 // reset closingPR flag
248 // reset closingPR flag
249 $('.close-pr-input').remove();
249 $('.close-pr-input').remove();
250
250
251 $(this.statusChange).select2('readonly', false);
251 $(this.statusChange).select2('readonly', false);
252 };
252 };
253
253
254 this.globalSubmitSuccessCallback = function(){
254 this.globalSubmitSuccessCallback = function(){
255 // default behaviour is to call GLOBAL hook, if it's registered.
255 // default behaviour is to call GLOBAL hook, if it's registered.
256 if (window.commentFormGlobalSubmitSuccessCallback !== undefined){
256 if (window.commentFormGlobalSubmitSuccessCallback !== undefined){
257 commentFormGlobalSubmitSuccessCallback()
257 commentFormGlobalSubmitSuccessCallback()
258 }
258 }
259 };
259 };
260
260
261 this.submitAjaxPOST = function(url, postData, successHandler, failHandler) {
261 this.submitAjaxPOST = function(url, postData, successHandler, failHandler) {
262 failHandler = failHandler || function() {};
262 failHandler = failHandler || function() {};
263 var postData = toQueryString(postData);
263 var postData = toQueryString(postData);
264 var request = $.ajax({
264 var request = $.ajax({
265 url: url,
265 url: url,
266 type: 'POST',
266 type: 'POST',
267 data: postData,
267 data: postData,
268 headers: {'X-PARTIAL-XHR': true}
268 headers: {'X-PARTIAL-XHR': true}
269 })
269 })
270 .done(function(data) {
270 .done(function(data) {
271 successHandler(data);
271 successHandler(data);
272 })
272 })
273 .fail(function(data, textStatus, errorThrown){
273 .fail(function(data, textStatus, errorThrown){
274 alert(
274 alert(
275 "Error while submitting comment.\n" +
275 "Error while submitting comment.\n" +
276 "Error code {0} ({1}).".format(data.status, data.statusText));
276 "Error code {0} ({1}).".format(data.status, data.statusText));
277 failHandler()
277 failHandler()
278 });
278 });
279 return request;
279 return request;
280 };
280 };
281
281
282 // overwrite a submitHandler, we need to do it for inline comments
282 // overwrite a submitHandler, we need to do it for inline comments
283 this.setHandleFormSubmit = function(callback) {
283 this.setHandleFormSubmit = function(callback) {
284 this.handleFormSubmit = callback;
284 this.handleFormSubmit = callback;
285 };
285 };
286
286
287 // overwrite a submitSuccessHandler
287 // overwrite a submitSuccessHandler
288 this.setGlobalSubmitSuccessCallback = function(callback) {
288 this.setGlobalSubmitSuccessCallback = function(callback) {
289 this.globalSubmitSuccessCallback = callback;
289 this.globalSubmitSuccessCallback = callback;
290 };
290 };
291
291
292 // default handler for for submit for main comments
292 // default handler for for submit for main comments
293 this.handleFormSubmit = function() {
293 this.handleFormSubmit = function() {
294 var text = self.cm.getValue();
294 var text = self.cm.getValue();
295 var status = self.getCommentStatus();
295 var status = self.getCommentStatus();
296 var commentType = self.getCommentType();
296 var commentType = self.getCommentType();
297 var resolvesCommentId = self.getResolvesId();
297 var resolvesCommentId = self.getResolvesId();
298 var closePullRequest = self.getClosePr();
298 var closePullRequest = self.getClosePr();
299
299
300 if (text === "" && !status) {
300 if (text === "" && !status) {
301 return;
301 return;
302 }
302 }
303
303
304 var excludeCancelBtn = false;
304 var excludeCancelBtn = false;
305 var submitEvent = true;
305 var submitEvent = true;
306 self.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
306 self.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
307 self.cm.setOption("readOnly", true);
307 self.cm.setOption("readOnly", true);
308
308
309 var postData = {
309 var postData = {
310 'text': text,
310 'text': text,
311 'changeset_status': status,
311 'changeset_status': status,
312 'comment_type': commentType,
312 'comment_type': commentType,
313 'csrf_token': CSRF_TOKEN
313 'csrf_token': CSRF_TOKEN
314 };
314 };
315
315
316 if (resolvesCommentId) {
316 if (resolvesCommentId) {
317 postData['resolves_comment_id'] = resolvesCommentId;
317 postData['resolves_comment_id'] = resolvesCommentId;
318 }
318 }
319
319
320 if (closePullRequest) {
320 if (closePullRequest) {
321 postData['close_pull_request'] = true;
321 postData['close_pull_request'] = true;
322 }
322 }
323
323
324 var submitSuccessCallback = function(o) {
324 var submitSuccessCallback = function(o) {
325 // reload page if we change status for single commit.
325 // reload page if we change status for single commit.
326 if (status && self.commitId) {
326 if (status && self.commitId) {
327 location.reload(true);
327 location.reload(true);
328 } else {
328 } else {
329 $('#injected_page_comments').append(o.rendered_text);
329 $('#injected_page_comments').append(o.rendered_text);
330 self.resetCommentFormState();
330 self.resetCommentFormState();
331 timeagoActivate();
331 timeagoActivate();
332
332
333 // mark visually which comment was resolved
333 // mark visually which comment was resolved
334 if (resolvesCommentId) {
334 if (resolvesCommentId) {
335 self.markCommentResolved(resolvesCommentId);
335 self.markCommentResolved(resolvesCommentId);
336 }
336 }
337 }
337 }
338
338
339 // run global callback on submit
339 // run global callback on submit
340 self.globalSubmitSuccessCallback();
340 self.globalSubmitSuccessCallback();
341
341
342 };
342 };
343 var submitFailCallback = function(){
343 var submitFailCallback = function(){
344 self.resetCommentFormState(text);
344 self.resetCommentFormState(text);
345 };
345 };
346 self.submitAjaxPOST(
346 self.submitAjaxPOST(
347 self.submitUrl, postData, submitSuccessCallback, submitFailCallback);
347 self.submitUrl, postData, submitSuccessCallback, submitFailCallback);
348 };
348 };
349
349
350 this.previewSuccessCallback = function(o) {
350 this.previewSuccessCallback = function(o) {
351 $(self.previewBoxSelector).html(o);
351 $(self.previewBoxSelector).html(o);
352 $(self.previewBoxSelector).removeClass('unloaded');
352 $(self.previewBoxSelector).removeClass('unloaded');
353
353
354 // swap buttons, making preview active
354 // swap buttons, making preview active
355 $(self.previewButton).parent().addClass('active');
355 $(self.previewButton).parent().addClass('active');
356 $(self.editButton).parent().removeClass('active');
356 $(self.editButton).parent().removeClass('active');
357
357
358 // unlock buttons
358 // unlock buttons
359 self.setActionButtonsDisabled(false);
359 self.setActionButtonsDisabled(false);
360 };
360 };
361
361
362 this.setActionButtonsDisabled = function(state, excludeCancelBtn, submitEvent) {
362 this.setActionButtonsDisabled = function(state, excludeCancelBtn, submitEvent) {
363 excludeCancelBtn = excludeCancelBtn || false;
363 excludeCancelBtn = excludeCancelBtn || false;
364 submitEvent = submitEvent || false;
364 submitEvent = submitEvent || false;
365
365
366 $(this.editButton).prop('disabled', state);
366 $(this.editButton).prop('disabled', state);
367 $(this.previewButton).prop('disabled', state);
367 $(this.previewButton).prop('disabled', state);
368
368
369 if (!excludeCancelBtn) {
369 if (!excludeCancelBtn) {
370 $(this.cancelButton).prop('disabled', state);
370 $(this.cancelButton).prop('disabled', state);
371 }
371 }
372
372
373 var submitState = state;
373 var submitState = state;
374 if (!submitEvent && this.getCommentStatus() && !self.isInline()) {
374 if (!submitEvent && this.getCommentStatus() && !self.isInline()) {
375 // if the value of commit review status is set, we allow
375 // if the value of commit review status is set, we allow
376 // submit button, but only on Main form, isInline means inline
376 // submit button, but only on Main form, isInline means inline
377 submitState = false
377 submitState = false
378 }
378 }
379
379
380 $(this.submitButton).prop('disabled', submitState);
380 $(this.submitButton).prop('disabled', submitState);
381 if (submitEvent) {
381 if (submitEvent) {
382 $(this.submitButton).val(_gettext('Submitting...'));
382 $(this.submitButton).val(_gettext('Submitting...'));
383 } else {
383 } else {
384 $(this.submitButton).val(this.submitButtonText);
384 $(this.submitButton).val(this.submitButtonText);
385 }
385 }
386
386
387 };
387 };
388
388
389 // lock preview/edit/submit buttons on load, but exclude cancel button
389 // lock preview/edit/submit buttons on load, but exclude cancel button
390 var excludeCancelBtn = true;
390 var excludeCancelBtn = true;
391 this.setActionButtonsDisabled(true, excludeCancelBtn);
391 this.setActionButtonsDisabled(true, excludeCancelBtn);
392
392
393 // anonymous users don't have access to initialized CM instance
393 // anonymous users don't have access to initialized CM instance
394 if (this.cm !== undefined){
394 if (this.cm !== undefined){
395 this.cm.on('change', function(cMirror) {
395 this.cm.on('change', function(cMirror) {
396 if (cMirror.getValue() === "") {
396 if (cMirror.getValue() === "") {
397 self.setActionButtonsDisabled(true, excludeCancelBtn)
397 self.setActionButtonsDisabled(true, excludeCancelBtn)
398 } else {
398 } else {
399 self.setActionButtonsDisabled(false, excludeCancelBtn)
399 self.setActionButtonsDisabled(false, excludeCancelBtn)
400 }
400 }
401 });
401 });
402 }
402 }
403
403
404 $(this.editButton).on('click', function(e) {
404 $(this.editButton).on('click', function(e) {
405 e.preventDefault();
405 e.preventDefault();
406
406
407 $(self.previewButton).parent().removeClass('active');
407 $(self.previewButton).parent().removeClass('active');
408 $(self.previewContainer).hide();
408 $(self.previewContainer).hide();
409
409
410 $(self.editButton).parent().addClass('active');
410 $(self.editButton).parent().addClass('active');
411 $(self.editContainer).show();
411 $(self.editContainer).show();
412
412
413 });
413 });
414
414
415 $(this.previewButton).on('click', function(e) {
415 $(this.previewButton).on('click', function(e) {
416 e.preventDefault();
416 e.preventDefault();
417 var text = self.cm.getValue();
417 var text = self.cm.getValue();
418
418
419 if (text === "") {
419 if (text === "") {
420 return;
420 return;
421 }
421 }
422
422
423 var postData = {
423 var postData = {
424 'text': text,
424 'text': text,
425 'renderer': templateContext.visual.default_renderer,
425 'renderer': templateContext.visual.default_renderer,
426 'csrf_token': CSRF_TOKEN
426 'csrf_token': CSRF_TOKEN
427 };
427 };
428
428
429 // lock ALL buttons on preview
429 // lock ALL buttons on preview
430 self.setActionButtonsDisabled(true);
430 self.setActionButtonsDisabled(true);
431
431
432 $(self.previewBoxSelector).addClass('unloaded');
432 $(self.previewBoxSelector).addClass('unloaded');
433 $(self.previewBoxSelector).html(_gettext('Loading ...'));
433 $(self.previewBoxSelector).html(_gettext('Loading ...'));
434
434
435 $(self.editContainer).hide();
435 $(self.editContainer).hide();
436 $(self.previewContainer).show();
436 $(self.previewContainer).show();
437
437
438 // by default we reset state of comment preserving the text
438 // by default we reset state of comment preserving the text
439 var previewFailCallback = function(){
439 var previewFailCallback = function(){
440 self.resetCommentFormState(text)
440 self.resetCommentFormState(text)
441 };
441 };
442 self.submitAjaxPOST(
442 self.submitAjaxPOST(
443 self.previewUrl, postData, self.previewSuccessCallback,
443 self.previewUrl, postData, self.previewSuccessCallback,
444 previewFailCallback);
444 previewFailCallback);
445
445
446 $(self.previewButton).parent().addClass('active');
446 $(self.previewButton).parent().addClass('active');
447 $(self.editButton).parent().removeClass('active');
447 $(self.editButton).parent().removeClass('active');
448 });
448 });
449
449
450 $(this.submitForm).submit(function(e) {
450 $(this.submitForm).submit(function(e) {
451 e.preventDefault();
451 e.preventDefault();
452 var allowedToSubmit = self.isAllowedToSubmit();
452 var allowedToSubmit = self.isAllowedToSubmit();
453 if (!allowedToSubmit){
453 if (!allowedToSubmit){
454 return false;
454 return false;
455 }
455 }
456 self.handleFormSubmit();
456 self.handleFormSubmit();
457 });
457 });
458
458
459 }
459 }
460
460
461 return CommentForm;
461 return CommentForm;
462 });
462 });
463
463
464 /* comments controller */
464 /* comments controller */
465 var CommentsController = function() {
465 var CommentsController = function() {
466 var mainComment = '#text';
466 var mainComment = '#text';
467 var self = this;
467 var self = this;
468
468
469 this.cancelComment = function(node) {
469 this.cancelComment = function(node) {
470 var $node = $(node);
470 var $node = $(node);
471 var $td = $node.closest('td');
471 var $td = $node.closest('td');
472 $node.closest('.comment-inline-form').remove();
472 $node.closest('.comment-inline-form').remove();
473 return false;
473 return false;
474 };
474 };
475
475
476 this.getLineNumber = function(node) {
476 this.getLineNumber = function(node) {
477 var $node = $(node);
477 var $node = $(node);
478 var lineNo = $node.closest('td').attr('data-line-number');
478 var lineNo = $node.closest('td').attr('data-line-no');
479 if (lineNo === undefined && $node.data('commentInline')){
479 if (lineNo === undefined && $node.data('commentInline')){
480 lineNo = $node.data('commentLineNo')
480 lineNo = $node.data('commentLineNo')
481 }
481 }
482
482
483 return lineNo
483 return lineNo
484 };
484 };
485
485
486 this.scrollToComment = function(node, offset, outdated) {
486 this.scrollToComment = function(node, offset, outdated) {
487 if (offset === undefined) {
487 if (offset === undefined) {
488 offset = 0;
488 offset = 0;
489 }
489 }
490 var outdated = outdated || false;
490 var outdated = outdated || false;
491 var klass = outdated ? 'div.comment-outdated' : 'div.comment-current';
491 var klass = outdated ? 'div.comment-outdated' : 'div.comment-current';
492
492
493 if (!node) {
493 if (!node) {
494 node = $('.comment-selected');
494 node = $('.comment-selected');
495 if (!node.length) {
495 if (!node.length) {
496 node = $('comment-current')
496 node = $('comment-current')
497 }
497 }
498 }
498 }
499 $wrapper = $(node).closest('div.comment');
499 $wrapper = $(node).closest('div.comment');
500 $comment = $(node).closest(klass);
500 $comment = $(node).closest(klass);
501 $comments = $(klass);
501 $comments = $(klass);
502
502
503 // show hidden comment when referenced.
503 // show hidden comment when referenced.
504 if (!$wrapper.is(':visible')){
504 if (!$wrapper.is(':visible')){
505 $wrapper.show();
505 $wrapper.show();
506 }
506 }
507
507
508 $('.comment-selected').removeClass('comment-selected');
508 $('.comment-selected').removeClass('comment-selected');
509
509
510 var nextIdx = $(klass).index($comment) + offset;
510 var nextIdx = $(klass).index($comment) + offset;
511 if (nextIdx >= $comments.length) {
511 if (nextIdx >= $comments.length) {
512 nextIdx = 0;
512 nextIdx = 0;
513 }
513 }
514 var $next = $(klass).eq(nextIdx);
514 var $next = $(klass).eq(nextIdx);
515
515
516 var $cb = $next.closest('.cb');
516 var $cb = $next.closest('.cb');
517 $cb.removeClass('cb-collapsed');
517 $cb.removeClass('cb-collapsed');
518
518
519 var $filediffCollapseState = $cb.closest('.filediff').prev();
519 var $filediffCollapseState = $cb.closest('.filediff').prev();
520 $filediffCollapseState.prop('checked', false);
520 $filediffCollapseState.prop('checked', false);
521 $next.addClass('comment-selected');
521 $next.addClass('comment-selected');
522 scrollToElement($next);
522 scrollToElement($next);
523 return false;
523 return false;
524 };
524 };
525
525
526 this.nextComment = function(node) {
526 this.nextComment = function(node) {
527 return self.scrollToComment(node, 1);
527 return self.scrollToComment(node, 1);
528 };
528 };
529
529
530 this.prevComment = function(node) {
530 this.prevComment = function(node) {
531 return self.scrollToComment(node, -1);
531 return self.scrollToComment(node, -1);
532 };
532 };
533
533
534 this.nextOutdatedComment = function(node) {
534 this.nextOutdatedComment = function(node) {
535 return self.scrollToComment(node, 1, true);
535 return self.scrollToComment(node, 1, true);
536 };
536 };
537
537
538 this.prevOutdatedComment = function(node) {
538 this.prevOutdatedComment = function(node) {
539 return self.scrollToComment(node, -1, true);
539 return self.scrollToComment(node, -1, true);
540 };
540 };
541
541
542 this.deleteComment = function(node) {
542 this.deleteComment = function(node) {
543 if (!confirm(_gettext('Delete this comment?'))) {
543 if (!confirm(_gettext('Delete this comment?'))) {
544 return false;
544 return false;
545 }
545 }
546 var $node = $(node);
546 var $node = $(node);
547 var $td = $node.closest('td');
547 var $td = $node.closest('td');
548 var $comment = $node.closest('.comment');
548 var $comment = $node.closest('.comment');
549 var comment_id = $comment.attr('data-comment-id');
549 var comment_id = $comment.attr('data-comment-id');
550 var url = AJAX_COMMENT_DELETE_URL.replace('__COMMENT_ID__', comment_id);
550 var url = AJAX_COMMENT_DELETE_URL.replace('__COMMENT_ID__', comment_id);
551 var postData = {
551 var postData = {
552 'csrf_token': CSRF_TOKEN
552 'csrf_token': CSRF_TOKEN
553 };
553 };
554
554
555 $comment.addClass('comment-deleting');
555 $comment.addClass('comment-deleting');
556 $comment.hide('fast');
556 $comment.hide('fast');
557
557
558 var success = function(response) {
558 var success = function(response) {
559 $comment.remove();
559 $comment.remove();
560 return false;
560 return false;
561 };
561 };
562 var failure = function(data, textStatus, xhr) {
562 var failure = function(data, textStatus, xhr) {
563 alert("error processing request: " + textStatus);
563 alert("error processing request: " + textStatus);
564 $comment.show('fast');
564 $comment.show('fast');
565 $comment.removeClass('comment-deleting');
565 $comment.removeClass('comment-deleting');
566 return false;
566 return false;
567 };
567 };
568 ajaxPOST(url, postData, success, failure);
568 ajaxPOST(url, postData, success, failure);
569 };
569 };
570
570
571 this.toggleWideMode = function (node) {
571 this.toggleWideMode = function (node) {
572 if ($('#content').hasClass('wrapper')) {
572 if ($('#content').hasClass('wrapper')) {
573 $('#content').removeClass("wrapper");
573 $('#content').removeClass("wrapper");
574 $('#content').addClass("wide-mode-wrapper");
574 $('#content').addClass("wide-mode-wrapper");
575 $(node).addClass('btn-success');
575 $(node).addClass('btn-success');
576 } else {
576 } else {
577 $('#content').removeClass("wide-mode-wrapper");
577 $('#content').removeClass("wide-mode-wrapper");
578 $('#content').addClass("wrapper");
578 $('#content').addClass("wrapper");
579 $(node).removeClass('btn-success');
579 $(node).removeClass('btn-success');
580 }
580 }
581 return false;
581 return false;
582 };
582 };
583
583
584 this.toggleComments = function(node, show) {
584 this.toggleComments = function(node, show) {
585 var $filediff = $(node).closest('.filediff');
585 var $filediff = $(node).closest('.filediff');
586 if (show === true) {
586 if (show === true) {
587 $filediff.removeClass('hide-comments');
587 $filediff.removeClass('hide-comments');
588 } else if (show === false) {
588 } else if (show === false) {
589 $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
589 $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
590 $filediff.addClass('hide-comments');
590 $filediff.addClass('hide-comments');
591 } else {
591 } else {
592 $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
592 $filediff.find('.hide-line-comments').removeClass('hide-line-comments');
593 $filediff.toggleClass('hide-comments');
593 $filediff.toggleClass('hide-comments');
594 }
594 }
595 return false;
595 return false;
596 };
596 };
597
597
598 this.toggleLineComments = function(node) {
598 this.toggleLineComments = function(node) {
599 self.toggleComments(node, true);
599 self.toggleComments(node, true);
600 var $node = $(node);
600 var $node = $(node);
601 // mark outdated comments as visible before the toggle;
601 // mark outdated comments as visible before the toggle;
602 $(node.closest('tr')).find('.comment-outdated').show();
602 $(node.closest('tr')).find('.comment-outdated').show();
603 $node.closest('tr').toggleClass('hide-line-comments');
603 $node.closest('tr').toggleClass('hide-line-comments');
604 };
604 };
605
605
606 this.createCommentForm = function(formElement, lineno, placeholderText, initAutocompleteActions, resolvesCommentId){
606 this.createCommentForm = function(formElement, lineno, placeholderText, initAutocompleteActions, resolvesCommentId){
607 var pullRequestId = templateContext.pull_request_data.pull_request_id;
607 var pullRequestId = templateContext.pull_request_data.pull_request_id;
608 var commitId = templateContext.commit_data.commit_id;
608 var commitId = templateContext.commit_data.commit_id;
609
609
610 var commentForm = new CommentForm(
610 var commentForm = new CommentForm(
611 formElement, commitId, pullRequestId, lineno, initAutocompleteActions, resolvesCommentId);
611 formElement, commitId, pullRequestId, lineno, initAutocompleteActions, resolvesCommentId);
612 var cm = commentForm.getCmInstance();
612 var cm = commentForm.getCmInstance();
613
613
614 if (resolvesCommentId){
614 if (resolvesCommentId){
615 var placeholderText = _gettext('Leave a comment, or click resolve button to resolve TODO comment #{0}').format(resolvesCommentId);
615 var placeholderText = _gettext('Leave a comment, or click resolve button to resolve TODO comment #{0}').format(resolvesCommentId);
616 }
616 }
617
617
618 setTimeout(function() {
618 setTimeout(function() {
619 // callbacks
619 // callbacks
620 if (cm !== undefined) {
620 if (cm !== undefined) {
621 commentForm.setPlaceholder(placeholderText);
621 commentForm.setPlaceholder(placeholderText);
622 if (commentForm.isInline()) {
622 if (commentForm.isInline()) {
623 cm.focus();
623 cm.focus();
624 cm.refresh();
624 cm.refresh();
625 }
625 }
626 }
626 }
627 }, 10);
627 }, 10);
628
628
629 // trigger scrolldown to the resolve comment, since it might be away
629 // trigger scrolldown to the resolve comment, since it might be away
630 // from the clicked
630 // from the clicked
631 if (resolvesCommentId){
631 if (resolvesCommentId){
632 var actionNode = $(commentForm.resolvesActionId).offset();
632 var actionNode = $(commentForm.resolvesActionId).offset();
633
633
634 setTimeout(function() {
634 setTimeout(function() {
635 if (actionNode) {
635 if (actionNode) {
636 $('body, html').animate({scrollTop: actionNode.top}, 10);
636 $('body, html').animate({scrollTop: actionNode.top}, 10);
637 }
637 }
638 }, 100);
638 }, 100);
639 }
639 }
640
640
641 return commentForm;
641 return commentForm;
642 };
642 };
643
643
644 this.createGeneralComment = function (lineNo, placeholderText, resolvesCommentId) {
644 this.createGeneralComment = function (lineNo, placeholderText, resolvesCommentId) {
645
645
646 var tmpl = $('#cb-comment-general-form-template').html();
646 var tmpl = $('#cb-comment-general-form-template').html();
647 tmpl = tmpl.format(null, 'general');
647 tmpl = tmpl.format(null, 'general');
648 var $form = $(tmpl);
648 var $form = $(tmpl);
649
649
650 var $formPlaceholder = $('#cb-comment-general-form-placeholder');
650 var $formPlaceholder = $('#cb-comment-general-form-placeholder');
651 var curForm = $formPlaceholder.find('form');
651 var curForm = $formPlaceholder.find('form');
652 if (curForm){
652 if (curForm){
653 curForm.remove();
653 curForm.remove();
654 }
654 }
655 $formPlaceholder.append($form);
655 $formPlaceholder.append($form);
656
656
657 var _form = $($form[0]);
657 var _form = $($form[0]);
658 var autocompleteActions = ['approve', 'reject', 'as_note', 'as_todo'];
658 var autocompleteActions = ['approve', 'reject', 'as_note', 'as_todo'];
659 var commentForm = this.createCommentForm(
659 var commentForm = this.createCommentForm(
660 _form, lineNo, placeholderText, autocompleteActions, resolvesCommentId);
660 _form, lineNo, placeholderText, autocompleteActions, resolvesCommentId);
661 commentForm.initStatusChangeSelector();
661 commentForm.initStatusChangeSelector();
662
662
663 return commentForm;
663 return commentForm;
664 };
664 };
665
665
666 this.createComment = function(node, resolutionComment) {
666 this.createComment = function(node, resolutionComment) {
667 var resolvesCommentId = resolutionComment || null;
667 var resolvesCommentId = resolutionComment || null;
668 var $node = $(node);
668 var $node = $(node);
669 var $td = $node.closest('td');
669 var $td = $node.closest('td');
670 var $form = $td.find('.comment-inline-form');
670 var $form = $td.find('.comment-inline-form');
671
671
672 if (!$form.length) {
672 if (!$form.length) {
673
673
674 var $filediff = $node.closest('.filediff');
674 var $filediff = $node.closest('.filediff');
675 $filediff.removeClass('hide-comments');
675 $filediff.removeClass('hide-comments');
676 var f_path = $filediff.attr('data-f-path');
676 var f_path = $filediff.attr('data-f-path');
677 var lineno = self.getLineNumber(node);
677 var lineno = self.getLineNumber(node);
678 // create a new HTML from template
678 // create a new HTML from template
679 var tmpl = $('#cb-comment-inline-form-template').html();
679 var tmpl = $('#cb-comment-inline-form-template').html();
680 tmpl = tmpl.format(escapeHtml(f_path), lineno);
680 tmpl = tmpl.format(escapeHtml(f_path), lineno);
681 $form = $(tmpl);
681 $form = $(tmpl);
682
682
683 var $comments = $td.find('.inline-comments');
683 var $comments = $td.find('.inline-comments');
684 if (!$comments.length) {
684 if (!$comments.length) {
685 $comments = $(
685 $comments = $(
686 $('#cb-comments-inline-container-template').html());
686 $('#cb-comments-inline-container-template').html());
687 $td.append($comments);
687 $td.append($comments);
688 }
688 }
689
689
690 $td.find('.cb-comment-add-button').before($form);
690 $td.find('.cb-comment-add-button').before($form);
691
691
692 var placeholderText = _gettext('Leave a comment on line {0}.').format(lineno);
692 var placeholderText = _gettext('Leave a comment on line {0}.').format(lineno);
693 var _form = $($form[0]).find('form');
693 var _form = $($form[0]).find('form');
694 var autocompleteActions = ['as_note', 'as_todo'];
694 var autocompleteActions = ['as_note', 'as_todo'];
695 var commentForm = this.createCommentForm(
695 var commentForm = this.createCommentForm(
696 _form, lineno, placeholderText, autocompleteActions, resolvesCommentId);
696 _form, lineno, placeholderText, autocompleteActions, resolvesCommentId);
697
697
698 $.Topic('/ui/plugins/code/comment_form_built').prepareOrPublish({
698 $.Topic('/ui/plugins/code/comment_form_built').prepareOrPublish({
699 form: _form,
699 form: _form,
700 parent: $td[0],
700 parent: $td[0],
701 lineno: lineno,
701 lineno: lineno,
702 f_path: f_path}
702 f_path: f_path}
703 );
703 );
704
704
705 // set a CUSTOM submit handler for inline comments.
705 // set a CUSTOM submit handler for inline comments.
706 commentForm.setHandleFormSubmit(function(o) {
706 commentForm.setHandleFormSubmit(function(o) {
707 var text = commentForm.cm.getValue();
707 var text = commentForm.cm.getValue();
708 var commentType = commentForm.getCommentType();
708 var commentType = commentForm.getCommentType();
709 var resolvesCommentId = commentForm.getResolvesId();
709 var resolvesCommentId = commentForm.getResolvesId();
710
710
711 if (text === "") {
711 if (text === "") {
712 return;
712 return;
713 }
713 }
714
714
715 if (lineno === undefined) {
715 if (lineno === undefined) {
716 alert('missing line !');
716 alert('missing line !');
717 return;
717 return;
718 }
718 }
719 if (f_path === undefined) {
719 if (f_path === undefined) {
720 alert('missing file path !');
720 alert('missing file path !');
721 return;
721 return;
722 }
722 }
723
723
724 var excludeCancelBtn = false;
724 var excludeCancelBtn = false;
725 var submitEvent = true;
725 var submitEvent = true;
726 commentForm.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
726 commentForm.setActionButtonsDisabled(true, excludeCancelBtn, submitEvent);
727 commentForm.cm.setOption("readOnly", true);
727 commentForm.cm.setOption("readOnly", true);
728 var postData = {
728 var postData = {
729 'text': text,
729 'text': text,
730 'f_path': f_path,
730 'f_path': f_path,
731 'line': lineno,
731 'line': lineno,
732 'comment_type': commentType,
732 'comment_type': commentType,
733 'csrf_token': CSRF_TOKEN
733 'csrf_token': CSRF_TOKEN
734 };
734 };
735 if (resolvesCommentId){
735 if (resolvesCommentId){
736 postData['resolves_comment_id'] = resolvesCommentId;
736 postData['resolves_comment_id'] = resolvesCommentId;
737 }
737 }
738
738
739 var submitSuccessCallback = function(json_data) {
739 var submitSuccessCallback = function(json_data) {
740 $form.remove();
740 $form.remove();
741 try {
741 try {
742 var html = json_data.rendered_text;
742 var html = json_data.rendered_text;
743 var lineno = json_data.line_no;
743 var lineno = json_data.line_no;
744 var target_id = json_data.target_id;
744 var target_id = json_data.target_id;
745
745
746 $comments.find('.cb-comment-add-button').before(html);
746 $comments.find('.cb-comment-add-button').before(html);
747
747
748 //mark visually which comment was resolved
748 //mark visually which comment was resolved
749 if (resolvesCommentId) {
749 if (resolvesCommentId) {
750 commentForm.markCommentResolved(resolvesCommentId);
750 commentForm.markCommentResolved(resolvesCommentId);
751 }
751 }
752
752
753 // run global callback on submit
753 // run global callback on submit
754 commentForm.globalSubmitSuccessCallback();
754 commentForm.globalSubmitSuccessCallback();
755
755
756 } catch (e) {
756 } catch (e) {
757 console.error(e);
757 console.error(e);
758 }
758 }
759
759
760 // re trigger the linkification of next/prev navigation
760 // re trigger the linkification of next/prev navigation
761 linkifyComments($('.inline-comment-injected'));
761 linkifyComments($('.inline-comment-injected'));
762 timeagoActivate();
762 timeagoActivate();
763 commentForm.setActionButtonsDisabled(false);
763 commentForm.setActionButtonsDisabled(false);
764
764
765 };
765 };
766 var submitFailCallback = function(){
766 var submitFailCallback = function(){
767 commentForm.resetCommentFormState(text)
767 commentForm.resetCommentFormState(text)
768 };
768 };
769 commentForm.submitAjaxPOST(
769 commentForm.submitAjaxPOST(
770 commentForm.submitUrl, postData, submitSuccessCallback, submitFailCallback);
770 commentForm.submitUrl, postData, submitSuccessCallback, submitFailCallback);
771 });
771 });
772 }
772 }
773
773
774 $form.addClass('comment-inline-form-open');
774 $form.addClass('comment-inline-form-open');
775 };
775 };
776
776
777 this.createResolutionComment = function(commentId){
777 this.createResolutionComment = function(commentId){
778 // hide the trigger text
778 // hide the trigger text
779 $('#resolve-comment-{0}'.format(commentId)).hide();
779 $('#resolve-comment-{0}'.format(commentId)).hide();
780
780
781 var comment = $('#comment-'+commentId);
781 var comment = $('#comment-'+commentId);
782 var commentData = comment.data();
782 var commentData = comment.data();
783 if (commentData.commentInline) {
783 if (commentData.commentInline) {
784 this.createComment(comment, commentId)
784 this.createComment(comment, commentId)
785 } else {
785 } else {
786 Rhodecode.comments.createGeneralComment('general', "$placeholder", commentId)
786 Rhodecode.comments.createGeneralComment('general', "$placeholder", commentId)
787 }
787 }
788
788
789 return false;
789 return false;
790 };
790 };
791
791
792 this.submitResolution = function(commentId){
792 this.submitResolution = function(commentId){
793 var form = $('#resolve_comment_{0}'.format(commentId)).closest('form');
793 var form = $('#resolve_comment_{0}'.format(commentId)).closest('form');
794 var commentForm = form.get(0).CommentForm;
794 var commentForm = form.get(0).CommentForm;
795
795
796 var cm = commentForm.getCmInstance();
796 var cm = commentForm.getCmInstance();
797 var renderer = templateContext.visual.default_renderer;
797 var renderer = templateContext.visual.default_renderer;
798 if (renderer == 'rst'){
798 if (renderer == 'rst'){
799 var commentUrl = '`#{0} <{1}#comment-{0}>`_'.format(commentId, commentForm.selfUrl);
799 var commentUrl = '`#{0} <{1}#comment-{0}>`_'.format(commentId, commentForm.selfUrl);
800 } else if (renderer == 'markdown') {
800 } else if (renderer == 'markdown') {
801 var commentUrl = '[#{0}]({1}#comment-{0})'.format(commentId, commentForm.selfUrl);
801 var commentUrl = '[#{0}]({1}#comment-{0})'.format(commentId, commentForm.selfUrl);
802 } else {
802 } else {
803 var commentUrl = '{1}#comment-{0}'.format(commentId, commentForm.selfUrl);
803 var commentUrl = '{1}#comment-{0}'.format(commentId, commentForm.selfUrl);
804 }
804 }
805
805
806 cm.setValue(_gettext('TODO from comment {0} was fixed.').format(commentUrl));
806 cm.setValue(_gettext('TODO from comment {0} was fixed.').format(commentUrl));
807 form.submit();
807 form.submit();
808 return false;
808 return false;
809 };
809 };
810
810
811 };
811 };
@@ -1,695 +1,695 b''
1 <%namespace name="commentblock" file="/changeset/changeset_file_comment.mako"/>
1 <%namespace name="commentblock" file="/changeset/changeset_file_comment.mako"/>
2
2
3 <%def name="diff_line_anchor(filename, line, type)"><%
3 <%def name="diff_line_anchor(filename, line, type)"><%
4 return '%s_%s_%i' % (h.safeid(filename), type, line)
4 return '%s_%s_%i' % (h.safeid(filename), type, line)
5 %></%def>
5 %></%def>
6
6
7 <%def name="action_class(action)">
7 <%def name="action_class(action)">
8 <%
8 <%
9 return {
9 return {
10 '-': 'cb-deletion',
10 '-': 'cb-deletion',
11 '+': 'cb-addition',
11 '+': 'cb-addition',
12 ' ': 'cb-context',
12 ' ': 'cb-context',
13 }.get(action, 'cb-empty')
13 }.get(action, 'cb-empty')
14 %>
14 %>
15 </%def>
15 </%def>
16
16
17 <%def name="op_class(op_id)">
17 <%def name="op_class(op_id)">
18 <%
18 <%
19 return {
19 return {
20 DEL_FILENODE: 'deletion', # file deleted
20 DEL_FILENODE: 'deletion', # file deleted
21 BIN_FILENODE: 'warning' # binary diff hidden
21 BIN_FILENODE: 'warning' # binary diff hidden
22 }.get(op_id, 'addition')
22 }.get(op_id, 'addition')
23 %>
23 %>
24 </%def>
24 </%def>
25
25
26
26
27
27
28 <%def name="render_diffset(diffset, commit=None,
28 <%def name="render_diffset(diffset, commit=None,
29
29
30 # collapse all file diff entries when there are more than this amount of files in the diff
30 # collapse all file diff entries when there are more than this amount of files in the diff
31 collapse_when_files_over=20,
31 collapse_when_files_over=20,
32
32
33 # collapse lines in the diff when more than this amount of lines changed in the file diff
33 # collapse lines in the diff when more than this amount of lines changed in the file diff
34 lines_changed_limit=500,
34 lines_changed_limit=500,
35
35
36 # add a ruler at to the output
36 # add a ruler at to the output
37 ruler_at_chars=0,
37 ruler_at_chars=0,
38
38
39 # show inline comments
39 # show inline comments
40 use_comments=False,
40 use_comments=False,
41
41
42 # disable new comments
42 # disable new comments
43 disable_new_comments=False,
43 disable_new_comments=False,
44
44
45 # special file-comments that were deleted in previous versions
45 # special file-comments that were deleted in previous versions
46 # it's used for showing outdated comments for deleted files in a PR
46 # it's used for showing outdated comments for deleted files in a PR
47 deleted_files_comments=None
47 deleted_files_comments=None
48
48
49 )">
49 )">
50
50
51 %if use_comments:
51 %if use_comments:
52 <div id="cb-comments-inline-container-template" class="js-template">
52 <div id="cb-comments-inline-container-template" class="js-template">
53 ${inline_comments_container([])}
53 ${inline_comments_container([])}
54 </div>
54 </div>
55 <div class="js-template" id="cb-comment-inline-form-template">
55 <div class="js-template" id="cb-comment-inline-form-template">
56 <div class="comment-inline-form ac">
56 <div class="comment-inline-form ac">
57
57
58 %if c.rhodecode_user.username != h.DEFAULT_USER:
58 %if c.rhodecode_user.username != h.DEFAULT_USER:
59 ## render template for inline comments
59 ## render template for inline comments
60 ${commentblock.comment_form(form_type='inline')}
60 ${commentblock.comment_form(form_type='inline')}
61 %else:
61 %else:
62 ${h.form('', class_='inline-form comment-form-login', method='get')}
62 ${h.form('', class_='inline-form comment-form-login', method='get')}
63 <div class="pull-left">
63 <div class="pull-left">
64 <div class="comment-help pull-right">
64 <div class="comment-help pull-right">
65 ${_('You need to be logged in to leave comments.')} <a href="${h.route_path('login', _query={'came_from': h.current_route_path(request)})}">${_('Login now')}</a>
65 ${_('You need to be logged in to leave comments.')} <a href="${h.route_path('login', _query={'came_from': h.current_route_path(request)})}">${_('Login now')}</a>
66 </div>
66 </div>
67 </div>
67 </div>
68 <div class="comment-button pull-right">
68 <div class="comment-button pull-right">
69 <button type="button" class="cb-comment-cancel" onclick="return Rhodecode.comments.cancelComment(this);">
69 <button type="button" class="cb-comment-cancel" onclick="return Rhodecode.comments.cancelComment(this);">
70 ${_('Cancel')}
70 ${_('Cancel')}
71 </button>
71 </button>
72 </div>
72 </div>
73 <div class="clearfix"></div>
73 <div class="clearfix"></div>
74 ${h.end_form()}
74 ${h.end_form()}
75 %endif
75 %endif
76 </div>
76 </div>
77 </div>
77 </div>
78
78
79 %endif
79 %endif
80 <%
80 <%
81 collapse_all = len(diffset.files) > collapse_when_files_over
81 collapse_all = len(diffset.files) > collapse_when_files_over
82 %>
82 %>
83
83
84 %if c.diffmode == 'sideside':
84 %if c.diffmode == 'sideside':
85 <style>
85 <style>
86 .wrapper {
86 .wrapper {
87 max-width: 1600px !important;
87 max-width: 1600px !important;
88 }
88 }
89 </style>
89 </style>
90 %endif
90 %endif
91
91
92 %if ruler_at_chars:
92 %if ruler_at_chars:
93 <style>
93 <style>
94 .diff table.cb .cb-content:after {
94 .diff table.cb .cb-content:after {
95 content: "";
95 content: "";
96 border-left: 1px solid blue;
96 border-left: 1px solid blue;
97 position: absolute;
97 position: absolute;
98 top: 0;
98 top: 0;
99 height: 18px;
99 height: 18px;
100 opacity: .2;
100 opacity: .2;
101 z-index: 10;
101 z-index: 10;
102 //## +5 to account for diff action (+/-)
102 //## +5 to account for diff action (+/-)
103 left: ${ruler_at_chars + 5}ch;
103 left: ${ruler_at_chars + 5}ch;
104 </style>
104 </style>
105 %endif
105 %endif
106
106
107 <div class="diffset ${disable_new_comments and 'diffset-comments-disabled'}">
107 <div class="diffset ${disable_new_comments and 'diffset-comments-disabled'}">
108 <div class="diffset-heading ${diffset.limited_diff and 'diffset-heading-warning' or ''}">
108 <div class="diffset-heading ${diffset.limited_diff and 'diffset-heading-warning' or ''}">
109 %if commit:
109 %if commit:
110 <div class="pull-right">
110 <div class="pull-right">
111 <a class="btn tooltip" title="${h.tooltip(_('Browse Files at revision {}').format(commit.raw_id))}" href="${h.route_path('repo_files',repo_name=diffset.repo_name, commit_id=commit.raw_id, f_path='')}">
111 <a class="btn tooltip" title="${h.tooltip(_('Browse Files at revision {}').format(commit.raw_id))}" href="${h.route_path('repo_files',repo_name=diffset.repo_name, commit_id=commit.raw_id, f_path='')}">
112 ${_('Browse Files')}
112 ${_('Browse Files')}
113 </a>
113 </a>
114 </div>
114 </div>
115 %endif
115 %endif
116 <h2 class="clearinner">
116 <h2 class="clearinner">
117 %if commit:
117 %if commit:
118 <a class="tooltip revision" title="${h.tooltip(commit.message)}" href="${h.route_path('repo_commit',repo_name=c.repo_name,commit_id=commit.raw_id)}">${'r%s:%s' % (commit.revision,h.short_id(commit.raw_id))}</a> -
118 <a class="tooltip revision" title="${h.tooltip(commit.message)}" href="${h.route_path('repo_commit',repo_name=c.repo_name,commit_id=commit.raw_id)}">${'r%s:%s' % (commit.revision,h.short_id(commit.raw_id))}</a> -
119 ${h.age_component(commit.date)} -
119 ${h.age_component(commit.date)} -
120 %endif
120 %endif
121
121
122 %if diffset.limited_diff:
122 %if diffset.limited_diff:
123 ${_('The requested commit is too big and content was truncated.')}
123 ${_('The requested commit is too big and content was truncated.')}
124
124
125 ${_ungettext('%(num)s file changed.', '%(num)s files changed.', diffset.changed_files) % {'num': diffset.changed_files}}
125 ${_ungettext('%(num)s file changed.', '%(num)s files changed.', diffset.changed_files) % {'num': diffset.changed_files}}
126 <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
126 <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
127 %else:
127 %else:
128 ${_ungettext('%(num)s file changed: %(linesadd)s inserted, ''%(linesdel)s deleted',
128 ${_ungettext('%(num)s file changed: %(linesadd)s inserted, ''%(linesdel)s deleted',
129 '%(num)s files changed: %(linesadd)s inserted, %(linesdel)s deleted', diffset.changed_files) % {'num': diffset.changed_files, 'linesadd': diffset.lines_added, 'linesdel': diffset.lines_deleted}}
129 '%(num)s files changed: %(linesadd)s inserted, %(linesdel)s deleted', diffset.changed_files) % {'num': diffset.changed_files, 'linesadd': diffset.lines_added, 'linesdel': diffset.lines_deleted}}
130 %endif
130 %endif
131
131
132 </h2>
132 </h2>
133 </div>
133 </div>
134
134
135 %if diffset.has_hidden_changes:
135 %if diffset.has_hidden_changes:
136 <p class="empty_data">${_('Some changes may be hidden')}</p>
136 <p class="empty_data">${_('Some changes may be hidden')}</p>
137 %elif not diffset.files:
137 %elif not diffset.files:
138 <p class="empty_data">${_('No files')}</p>
138 <p class="empty_data">${_('No files')}</p>
139 %endif
139 %endif
140
140
141 <div class="filediffs">
141 <div class="filediffs">
142 ## initial value could be marked as False later on
142 ## initial value could be marked as False later on
143 <% over_lines_changed_limit = False %>
143 <% over_lines_changed_limit = False %>
144 %for i, filediff in enumerate(diffset.files):
144 %for i, filediff in enumerate(diffset.files):
145
145
146 <%
146 <%
147 lines_changed = filediff.patch['stats']['added'] + filediff.patch['stats']['deleted']
147 lines_changed = filediff.patch['stats']['added'] + filediff.patch['stats']['deleted']
148 over_lines_changed_limit = lines_changed > lines_changed_limit
148 over_lines_changed_limit = lines_changed > lines_changed_limit
149 %>
149 %>
150 <input ${collapse_all and 'checked' or ''} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox">
150 <input ${collapse_all and 'checked' or ''} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox">
151 <div
151 <div
152 class="filediff"
152 class="filediff"
153 data-f-path="${filediff.patch['filename']}"
153 data-f-path="${filediff.patch['filename']}"
154 id="a_${h.FID('', filediff.patch['filename'])}">
154 id="a_${h.FID('', filediff.patch['filename'])}">
155 <label for="filediff-collapse-${id(filediff)}" class="filediff-heading">
155 <label for="filediff-collapse-${id(filediff)}" class="filediff-heading">
156 <div class="filediff-collapse-indicator"></div>
156 <div class="filediff-collapse-indicator"></div>
157 ${diff_ops(filediff)}
157 ${diff_ops(filediff)}
158 </label>
158 </label>
159 ${diff_menu(filediff, use_comments=use_comments)}
159 ${diff_menu(filediff, use_comments=use_comments)}
160 <table class="cb cb-diff-${c.diffmode} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
160 <table class="cb cb-diff-${c.diffmode} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
161 %if not filediff.hunks:
161 %if not filediff.hunks:
162 %for op_id, op_text in filediff.patch['stats']['ops'].items():
162 %for op_id, op_text in filediff.patch['stats']['ops'].items():
163 <tr>
163 <tr>
164 <td class="cb-text cb-${op_class(op_id)}" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
164 <td class="cb-text cb-${op_class(op_id)}" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
165 %if op_id == DEL_FILENODE:
165 %if op_id == DEL_FILENODE:
166 ${_('File was deleted')}
166 ${_('File was deleted')}
167 %elif op_id == BIN_FILENODE:
167 %elif op_id == BIN_FILENODE:
168 ${_('Binary file hidden')}
168 ${_('Binary file hidden')}
169 %else:
169 %else:
170 ${op_text}
170 ${op_text}
171 %endif
171 %endif
172 </td>
172 </td>
173 </tr>
173 </tr>
174 %endfor
174 %endfor
175 %endif
175 %endif
176 %if filediff.limited_diff:
176 %if filediff.limited_diff:
177 <tr class="cb-warning cb-collapser">
177 <tr class="cb-warning cb-collapser">
178 <td class="cb-text" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
178 <td class="cb-text" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
179 ${_('The requested commit is too big and content was truncated.')} <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
179 ${_('The requested commit is too big and content was truncated.')} <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
180 </td>
180 </td>
181 </tr>
181 </tr>
182 %else:
182 %else:
183 %if over_lines_changed_limit:
183 %if over_lines_changed_limit:
184 <tr class="cb-warning cb-collapser">
184 <tr class="cb-warning cb-collapser">
185 <td class="cb-text" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
185 <td class="cb-text" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=6'}>
186 ${_('This diff has been collapsed as it changes many lines, (%i lines changed)' % lines_changed)}
186 ${_('This diff has been collapsed as it changes many lines, (%i lines changed)' % lines_changed)}
187 <a href="#" class="cb-expand"
187 <a href="#" class="cb-expand"
188 onclick="$(this).closest('table').removeClass('cb-collapsed'); return false;">${_('Show them')}
188 onclick="$(this).closest('table').removeClass('cb-collapsed'); return false;">${_('Show them')}
189 </a>
189 </a>
190 <a href="#" class="cb-collapse"
190 <a href="#" class="cb-collapse"
191 onclick="$(this).closest('table').addClass('cb-collapsed'); return false;">${_('Hide them')}
191 onclick="$(this).closest('table').addClass('cb-collapsed'); return false;">${_('Hide them')}
192 </a>
192 </a>
193 </td>
193 </td>
194 </tr>
194 </tr>
195 %endif
195 %endif
196 %endif
196 %endif
197
197
198 %for hunk in filediff.hunks:
198 %for hunk in filediff.hunks:
199 <tr class="cb-hunk">
199 <tr class="cb-hunk">
200 <td ${c.diffmode == 'unified' and 'colspan=3' or ''}>
200 <td ${c.diffmode == 'unified' and 'colspan=3' or ''}>
201 ## TODO: dan: add ajax loading of more context here
201 ## TODO: dan: add ajax loading of more context here
202 ## <a href="#">
202 ## <a href="#">
203 <i class="icon-more"></i>
203 <i class="icon-more"></i>
204 ## </a>
204 ## </a>
205 </td>
205 </td>
206 <td ${c.diffmode == 'sideside' and 'colspan=5' or ''}>
206 <td ${c.diffmode == 'sideside' and 'colspan=5' or ''}>
207 @@
207 @@
208 -${hunk.source_start},${hunk.source_length}
208 -${hunk.source_start},${hunk.source_length}
209 +${hunk.target_start},${hunk.target_length}
209 +${hunk.target_start},${hunk.target_length}
210 ${hunk.section_header}
210 ${hunk.section_header}
211 </td>
211 </td>
212 </tr>
212 </tr>
213 %if c.diffmode == 'unified':
213 %if c.diffmode == 'unified':
214 ${render_hunk_lines_unified(hunk, use_comments=use_comments)}
214 ${render_hunk_lines_unified(hunk, use_comments=use_comments)}
215 %elif c.diffmode == 'sideside':
215 %elif c.diffmode == 'sideside':
216 ${render_hunk_lines_sideside(hunk, use_comments=use_comments)}
216 ${render_hunk_lines_sideside(hunk, use_comments=use_comments)}
217 %else:
217 %else:
218 <tr class="cb-line">
218 <tr class="cb-line">
219 <td>unknown diff mode</td>
219 <td>unknown diff mode</td>
220 </tr>
220 </tr>
221 %endif
221 %endif
222 %endfor
222 %endfor
223
223
224 ## outdated comments that do not fit into currently displayed lines
224 ## outdated comments that do not fit into currently displayed lines
225 % for lineno, comments in filediff.left_comments.items():
225 % for lineno, comments in filediff.left_comments.items():
226
226
227 %if c.diffmode == 'unified':
227 %if c.diffmode == 'unified':
228 <tr class="cb-line">
228 <tr class="cb-line">
229 <td class="cb-data cb-context"></td>
229 <td class="cb-data cb-context"></td>
230 <td class="cb-lineno cb-context"></td>
230 <td class="cb-lineno cb-context"></td>
231 <td class="cb-lineno cb-context"></td>
231 <td class="cb-lineno cb-context"></td>
232 <td class="cb-content cb-context">
232 <td class="cb-content cb-context">
233 ${inline_comments_container(comments)}
233 ${inline_comments_container(comments)}
234 </td>
234 </td>
235 </tr>
235 </tr>
236 %elif c.diffmode == 'sideside':
236 %elif c.diffmode == 'sideside':
237 <tr class="cb-line">
237 <tr class="cb-line">
238 <td class="cb-data cb-context"></td>
238 <td class="cb-data cb-context"></td>
239 <td class="cb-lineno cb-context"></td>
239 <td class="cb-lineno cb-context"></td>
240 <td class="cb-content cb-context">
240 <td class="cb-content cb-context">
241 % if lineno.startswith('o'):
241 % if lineno.startswith('o'):
242 ${inline_comments_container(comments)}
242 ${inline_comments_container(comments)}
243 % endif
243 % endif
244 </td>
244 </td>
245
245
246 <td class="cb-data cb-context"></td>
246 <td class="cb-data cb-context"></td>
247 <td class="cb-lineno cb-context"></td>
247 <td class="cb-lineno cb-context"></td>
248 <td class="cb-content cb-context">
248 <td class="cb-content cb-context">
249 % if lineno.startswith('n'):
249 % if lineno.startswith('n'):
250 ${inline_comments_container(comments)}
250 ${inline_comments_container(comments)}
251 % endif
251 % endif
252 </td>
252 </td>
253 </tr>
253 </tr>
254 %endif
254 %endif
255
255
256 % endfor
256 % endfor
257
257
258 </table>
258 </table>
259 </div>
259 </div>
260 %endfor
260 %endfor
261
261
262 ## outdated comments that are made for a file that has been deleted
262 ## outdated comments that are made for a file that has been deleted
263 % for filename, comments_dict in (deleted_files_comments or {}).items():
263 % for filename, comments_dict in (deleted_files_comments or {}).items():
264
264
265 <div class="filediffs filediff-outdated" style="display: none">
265 <div class="filediffs filediff-outdated" style="display: none">
266 <input ${collapse_all and 'checked' or ''} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox">
266 <input ${collapse_all and 'checked' or ''} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox">
267 <div class="filediff" data-f-path="${filename}" id="a_${h.FID('', filename)}">
267 <div class="filediff" data-f-path="${filename}" id="a_${h.FID('', filename)}">
268 <label for="filediff-collapse-${id(filename)}" class="filediff-heading">
268 <label for="filediff-collapse-${id(filename)}" class="filediff-heading">
269 <div class="filediff-collapse-indicator"></div>
269 <div class="filediff-collapse-indicator"></div>
270 <span class="pill">
270 <span class="pill">
271 ## file was deleted
271 ## file was deleted
272 <strong>${filename}</strong>
272 <strong>${filename}</strong>
273 </span>
273 </span>
274 <span class="pill-group" style="float: left">
274 <span class="pill-group" style="float: left">
275 ## file op, doesn't need translation
275 ## file op, doesn't need translation
276 <span class="pill" op="removed">removed in this version</span>
276 <span class="pill" op="removed">removed in this version</span>
277 </span>
277 </span>
278 <a class="pill filediff-anchor" href="#a_${h.FID('', filename)}">ΒΆ</a>
278 <a class="pill filediff-anchor" href="#a_${h.FID('', filename)}">ΒΆ</a>
279 <span class="pill-group" style="float: right">
279 <span class="pill-group" style="float: right">
280 <span class="pill" op="deleted">-${comments_dict['stats']}</span>
280 <span class="pill" op="deleted">-${comments_dict['stats']}</span>
281 </span>
281 </span>
282 </label>
282 </label>
283
283
284 <table class="cb cb-diff-${c.diffmode} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
284 <table class="cb cb-diff-${c.diffmode} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
285 <tr>
285 <tr>
286 % if c.diffmode == 'unified':
286 % if c.diffmode == 'unified':
287 <td></td>
287 <td></td>
288 %endif
288 %endif
289
289
290 <td></td>
290 <td></td>
291 <td class="cb-text cb-${op_class(BIN_FILENODE)}" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=5'}>
291 <td class="cb-text cb-${op_class(BIN_FILENODE)}" ${c.diffmode == 'unified' and 'colspan=4' or 'colspan=5'}>
292 ${_('File was deleted in this version, and outdated comments were made on it')}
292 ${_('File was deleted in this version, and outdated comments were made on it')}
293 </td>
293 </td>
294 </tr>
294 </tr>
295 %if c.diffmode == 'unified':
295 %if c.diffmode == 'unified':
296 <tr class="cb-line">
296 <tr class="cb-line">
297 <td class="cb-data cb-context"></td>
297 <td class="cb-data cb-context"></td>
298 <td class="cb-lineno cb-context"></td>
298 <td class="cb-lineno cb-context"></td>
299 <td class="cb-lineno cb-context"></td>
299 <td class="cb-lineno cb-context"></td>
300 <td class="cb-content cb-context">
300 <td class="cb-content cb-context">
301 ${inline_comments_container(comments_dict['comments'])}
301 ${inline_comments_container(comments_dict['comments'])}
302 </td>
302 </td>
303 </tr>
303 </tr>
304 %elif c.diffmode == 'sideside':
304 %elif c.diffmode == 'sideside':
305 <tr class="cb-line">
305 <tr class="cb-line">
306 <td class="cb-data cb-context"></td>
306 <td class="cb-data cb-context"></td>
307 <td class="cb-lineno cb-context"></td>
307 <td class="cb-lineno cb-context"></td>
308 <td class="cb-content cb-context"></td>
308 <td class="cb-content cb-context"></td>
309
309
310 <td class="cb-data cb-context"></td>
310 <td class="cb-data cb-context"></td>
311 <td class="cb-lineno cb-context"></td>
311 <td class="cb-lineno cb-context"></td>
312 <td class="cb-content cb-context">
312 <td class="cb-content cb-context">
313 ${inline_comments_container(comments_dict['comments'])}
313 ${inline_comments_container(comments_dict['comments'])}
314 </td>
314 </td>
315 </tr>
315 </tr>
316 %endif
316 %endif
317 </table>
317 </table>
318 </div>
318 </div>
319 </div>
319 </div>
320 % endfor
320 % endfor
321
321
322 </div>
322 </div>
323 </div>
323 </div>
324 </%def>
324 </%def>
325
325
326 <%def name="diff_ops(filediff)">
326 <%def name="diff_ops(filediff)">
327 <%
327 <%
328 from rhodecode.lib.diffs import NEW_FILENODE, DEL_FILENODE, \
328 from rhodecode.lib.diffs import NEW_FILENODE, DEL_FILENODE, \
329 MOD_FILENODE, RENAMED_FILENODE, CHMOD_FILENODE, BIN_FILENODE, COPIED_FILENODE
329 MOD_FILENODE, RENAMED_FILENODE, CHMOD_FILENODE, BIN_FILENODE, COPIED_FILENODE
330 %>
330 %>
331 <span class="pill">
331 <span class="pill">
332 %if filediff.source_file_path and filediff.target_file_path:
332 %if filediff.source_file_path and filediff.target_file_path:
333 %if filediff.source_file_path != filediff.target_file_path:
333 %if filediff.source_file_path != filediff.target_file_path:
334 ## file was renamed, or copied
334 ## file was renamed, or copied
335 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
335 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
336 <strong>${filediff.target_file_path}</strong> β¬… <del>${filediff.source_file_path}</del>
336 <strong>${filediff.target_file_path}</strong> β¬… <del>${filediff.source_file_path}</del>
337 <% final_path = filediff.target_file_path %>
337 <% final_path = filediff.target_file_path %>
338 %elif COPIED_FILENODE in filediff.patch['stats']['ops']:
338 %elif COPIED_FILENODE in filediff.patch['stats']['ops']:
339 <strong>${filediff.target_file_path}</strong> β¬… ${filediff.source_file_path}
339 <strong>${filediff.target_file_path}</strong> β¬… ${filediff.source_file_path}
340 <% final_path = filediff.target_file_path %>
340 <% final_path = filediff.target_file_path %>
341 %endif
341 %endif
342 %else:
342 %else:
343 ## file was modified
343 ## file was modified
344 <strong>${filediff.source_file_path}</strong>
344 <strong>${filediff.source_file_path}</strong>
345 <% final_path = filediff.source_file_path %>
345 <% final_path = filediff.source_file_path %>
346 %endif
346 %endif
347 %else:
347 %else:
348 %if filediff.source_file_path:
348 %if filediff.source_file_path:
349 ## file was deleted
349 ## file was deleted
350 <strong>${filediff.source_file_path}</strong>
350 <strong>${filediff.source_file_path}</strong>
351 <% final_path = filediff.source_file_path %>
351 <% final_path = filediff.source_file_path %>
352 %else:
352 %else:
353 ## file was added
353 ## file was added
354 <strong>${filediff.target_file_path}</strong>
354 <strong>${filediff.target_file_path}</strong>
355 <% final_path = filediff.target_file_path %>
355 <% final_path = filediff.target_file_path %>
356 %endif
356 %endif
357 %endif
357 %endif
358 <i style="color: #aaa" class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${final_path}" title="${_('Copy the full path')}" onclick="return false;"></i>
358 <i style="color: #aaa" class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${final_path}" title="${_('Copy the full path')}" onclick="return false;"></i>
359 </span>
359 </span>
360 <span class="pill-group" style="float: left">
360 <span class="pill-group" style="float: left">
361 %if filediff.limited_diff:
361 %if filediff.limited_diff:
362 <span class="pill tooltip" op="limited" title="The stats for this diff are not complete">limited diff</span>
362 <span class="pill tooltip" op="limited" title="The stats for this diff are not complete">limited diff</span>
363 %endif
363 %endif
364
364
365 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
365 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
366 <span class="pill" op="renamed">renamed</span>
366 <span class="pill" op="renamed">renamed</span>
367 %endif
367 %endif
368
368
369 %if COPIED_FILENODE in filediff.patch['stats']['ops']:
369 %if COPIED_FILENODE in filediff.patch['stats']['ops']:
370 <span class="pill" op="copied">copied</span>
370 <span class="pill" op="copied">copied</span>
371 %endif
371 %endif
372
372
373 %if NEW_FILENODE in filediff.patch['stats']['ops']:
373 %if NEW_FILENODE in filediff.patch['stats']['ops']:
374 <span class="pill" op="created">created</span>
374 <span class="pill" op="created">created</span>
375 %if filediff['target_mode'].startswith('120'):
375 %if filediff['target_mode'].startswith('120'):
376 <span class="pill" op="symlink">symlink</span>
376 <span class="pill" op="symlink">symlink</span>
377 %else:
377 %else:
378 <span class="pill" op="mode">${nice_mode(filediff['target_mode'])}</span>
378 <span class="pill" op="mode">${nice_mode(filediff['target_mode'])}</span>
379 %endif
379 %endif
380 %endif
380 %endif
381
381
382 %if DEL_FILENODE in filediff.patch['stats']['ops']:
382 %if DEL_FILENODE in filediff.patch['stats']['ops']:
383 <span class="pill" op="removed">removed</span>
383 <span class="pill" op="removed">removed</span>
384 %endif
384 %endif
385
385
386 %if CHMOD_FILENODE in filediff.patch['stats']['ops']:
386 %if CHMOD_FILENODE in filediff.patch['stats']['ops']:
387 <span class="pill" op="mode">
387 <span class="pill" op="mode">
388 ${nice_mode(filediff['source_mode'])} ➑ ${nice_mode(filediff['target_mode'])}
388 ${nice_mode(filediff['source_mode'])} ➑ ${nice_mode(filediff['target_mode'])}
389 </span>
389 </span>
390 %endif
390 %endif
391 </span>
391 </span>
392
392
393 <a class="pill filediff-anchor" href="#a_${h.FID('', filediff.patch['filename'])}">ΒΆ</a>
393 <a class="pill filediff-anchor" href="#a_${h.FID('', filediff.patch['filename'])}">ΒΆ</a>
394
394
395 <span class="pill-group" style="float: right">
395 <span class="pill-group" style="float: right">
396 %if BIN_FILENODE in filediff.patch['stats']['ops']:
396 %if BIN_FILENODE in filediff.patch['stats']['ops']:
397 <span class="pill" op="binary">binary</span>
397 <span class="pill" op="binary">binary</span>
398 %if MOD_FILENODE in filediff.patch['stats']['ops']:
398 %if MOD_FILENODE in filediff.patch['stats']['ops']:
399 <span class="pill" op="modified">modified</span>
399 <span class="pill" op="modified">modified</span>
400 %endif
400 %endif
401 %endif
401 %endif
402 %if filediff.patch['stats']['added']:
402 %if filediff.patch['stats']['added']:
403 <span class="pill" op="added">+${filediff.patch['stats']['added']}</span>
403 <span class="pill" op="added">+${filediff.patch['stats']['added']}</span>
404 %endif
404 %endif
405 %if filediff.patch['stats']['deleted']:
405 %if filediff.patch['stats']['deleted']:
406 <span class="pill" op="deleted">-${filediff.patch['stats']['deleted']}</span>
406 <span class="pill" op="deleted">-${filediff.patch['stats']['deleted']}</span>
407 %endif
407 %endif
408 </span>
408 </span>
409
409
410 </%def>
410 </%def>
411
411
412 <%def name="nice_mode(filemode)">
412 <%def name="nice_mode(filemode)">
413 ${filemode.startswith('100') and filemode[3:] or filemode}
413 ${filemode.startswith('100') and filemode[3:] or filemode}
414 </%def>
414 </%def>
415
415
416 <%def name="diff_menu(filediff, use_comments=False)">
416 <%def name="diff_menu(filediff, use_comments=False)">
417 <div class="filediff-menu">
417 <div class="filediff-menu">
418 %if filediff.diffset.source_ref:
418 %if filediff.diffset.source_ref:
419 %if filediff.operation in ['D', 'M']:
419 %if filediff.operation in ['D', 'M']:
420 <a
420 <a
421 class="tooltip"
421 class="tooltip"
422 href="${h.route_path('repo_files',repo_name=filediff.diffset.repo_name,commit_id=filediff.diffset.source_ref,f_path=filediff.source_file_path)}"
422 href="${h.route_path('repo_files',repo_name=filediff.diffset.repo_name,commit_id=filediff.diffset.source_ref,f_path=filediff.source_file_path)}"
423 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
423 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
424 >
424 >
425 ${_('Show file before')}
425 ${_('Show file before')}
426 </a> |
426 </a> |
427 %else:
427 %else:
428 <span
428 <span
429 class="tooltip"
429 class="tooltip"
430 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
430 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
431 >
431 >
432 ${_('Show file before')}
432 ${_('Show file before')}
433 </span> |
433 </span> |
434 %endif
434 %endif
435 %if filediff.operation in ['A', 'M']:
435 %if filediff.operation in ['A', 'M']:
436 <a
436 <a
437 class="tooltip"
437 class="tooltip"
438 href="${h.route_path('repo_files',repo_name=filediff.diffset.source_repo_name,commit_id=filediff.diffset.target_ref,f_path=filediff.target_file_path)}"
438 href="${h.route_path('repo_files',repo_name=filediff.diffset.source_repo_name,commit_id=filediff.diffset.target_ref,f_path=filediff.target_file_path)}"
439 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
439 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
440 >
440 >
441 ${_('Show file after')}
441 ${_('Show file after')}
442 </a> |
442 </a> |
443 %else:
443 %else:
444 <span
444 <span
445 class="tooltip"
445 class="tooltip"
446 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
446 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
447 >
447 >
448 ${_('Show file after')}
448 ${_('Show file after')}
449 </span> |
449 </span> |
450 %endif
450 %endif
451 <a
451 <a
452 class="tooltip"
452 class="tooltip"
453 title="${h.tooltip(_('Raw diff'))}"
453 title="${h.tooltip(_('Raw diff'))}"
454 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='raw'))}"
454 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='raw'))}"
455 >
455 >
456 ${_('Raw diff')}
456 ${_('Raw diff')}
457 </a> |
457 </a> |
458 <a
458 <a
459 class="tooltip"
459 class="tooltip"
460 title="${h.tooltip(_('Download diff'))}"
460 title="${h.tooltip(_('Download diff'))}"
461 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='download'))}"
461 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='download'))}"
462 >
462 >
463 ${_('Download diff')}
463 ${_('Download diff')}
464 </a>
464 </a>
465 % if use_comments:
465 % if use_comments:
466 |
466 |
467 % endif
467 % endif
468
468
469 ## TODO: dan: refactor ignorews_url and context_url into the diff renderer same as diffmode=unified/sideside. Also use ajax to load more context (by clicking hunks)
469 ## TODO: dan: refactor ignorews_url and context_url into the diff renderer same as diffmode=unified/sideside. Also use ajax to load more context (by clicking hunks)
470 %if hasattr(c, 'ignorews_url'):
470 %if hasattr(c, 'ignorews_url'):
471 ${c.ignorews_url(request, h.FID('', filediff.patch['filename']))}
471 ${c.ignorews_url(request, h.FID('', filediff.patch['filename']))}
472 %endif
472 %endif
473 %if hasattr(c, 'context_url'):
473 %if hasattr(c, 'context_url'):
474 ${c.context_url(request, h.FID('', filediff.patch['filename']))}
474 ${c.context_url(request, h.FID('', filediff.patch['filename']))}
475 %endif
475 %endif
476
476
477 %if use_comments:
477 %if use_comments:
478 <a href="#" onclick="return Rhodecode.comments.toggleComments(this);">
478 <a href="#" onclick="return Rhodecode.comments.toggleComments(this);">
479 <span class="show-comment-button">${_('Show comments')}</span><span class="hide-comment-button">${_('Hide comments')}</span>
479 <span class="show-comment-button">${_('Show comments')}</span><span class="hide-comment-button">${_('Hide comments')}</span>
480 </a>
480 </a>
481 %endif
481 %endif
482 %endif
482 %endif
483 </div>
483 </div>
484 </%def>
484 </%def>
485
485
486
486
487 <%def name="inline_comments_container(comments)">
487 <%def name="inline_comments_container(comments)">
488 <div class="inline-comments">
488 <div class="inline-comments">
489 %for comment in comments:
489 %for comment in comments:
490 ${commentblock.comment_block(comment, inline=True)}
490 ${commentblock.comment_block(comment, inline=True)}
491 %endfor
491 %endfor
492
492
493 % if comments and comments[-1].outdated:
493 % if comments and comments[-1].outdated:
494 <span class="btn btn-secondary cb-comment-add-button comment-outdated}"
494 <span class="btn btn-secondary cb-comment-add-button comment-outdated}"
495 style="display: none;}">
495 style="display: none;}">
496 ${_('Add another comment')}
496 ${_('Add another comment')}
497 </span>
497 </span>
498 % else:
498 % else:
499 <span onclick="return Rhodecode.comments.createComment(this)"
499 <span onclick="return Rhodecode.comments.createComment(this)"
500 class="btn btn-secondary cb-comment-add-button">
500 class="btn btn-secondary cb-comment-add-button">
501 ${_('Add another comment')}
501 ${_('Add another comment')}
502 </span>
502 </span>
503 % endif
503 % endif
504
504
505 </div>
505 </div>
506 </%def>
506 </%def>
507
507
508
508
509 <%def name="render_hunk_lines_sideside(hunk, use_comments=False)">
509 <%def name="render_hunk_lines_sideside(hunk, use_comments=False)">
510 %for i, line in enumerate(hunk.sideside):
510 %for i, line in enumerate(hunk.sideside):
511 <%
511 <%
512 old_line_anchor, new_line_anchor = None, None
512 old_line_anchor, new_line_anchor = None, None
513 if line.original.lineno:
513 if line.original.lineno:
514 old_line_anchor = diff_line_anchor(hunk.source_file_path, line.original.lineno, 'o')
514 old_line_anchor = diff_line_anchor(hunk.source_file_path, line.original.lineno, 'o')
515 if line.modified.lineno:
515 if line.modified.lineno:
516 new_line_anchor = diff_line_anchor(hunk.target_file_path, line.modified.lineno, 'n')
516 new_line_anchor = diff_line_anchor(hunk.target_file_path, line.modified.lineno, 'n')
517 %>
517 %>
518
518
519 <tr class="cb-line">
519 <tr class="cb-line">
520 <td class="cb-data ${action_class(line.original.action)}"
520 <td class="cb-data ${action_class(line.original.action)}"
521 data-line-number="${line.original.lineno}"
521 data-line-no="${line.original.lineno}"
522 >
522 >
523 <div>
523 <div>
524 %if line.original.comments:
524 %if line.original.comments:
525 <% has_outdated = any([x.outdated for x in line.original.comments]) %>
525 <% has_outdated = any([x.outdated for x in line.original.comments]) %>
526 % if has_outdated:
526 % if has_outdated:
527 <i title="${_('comments including outdated')}:${len(line.original.comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
527 <i title="${_('comments including outdated')}:${len(line.original.comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
528 % else:
528 % else:
529 <i title="${_('comments')}: ${len(line.original.comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
529 <i title="${_('comments')}: ${len(line.original.comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
530 % endif
530 % endif
531 %endif
531 %endif
532 </div>
532 </div>
533 </td>
533 </td>
534 <td class="cb-lineno ${action_class(line.original.action)}"
534 <td class="cb-lineno ${action_class(line.original.action)}"
535 data-line-number="${line.original.lineno}"
535 data-line-no="${line.original.lineno}"
536 %if old_line_anchor:
536 %if old_line_anchor:
537 id="${old_line_anchor}"
537 id="${old_line_anchor}"
538 %endif
538 %endif
539 >
539 >
540 %if line.original.lineno:
540 %if line.original.lineno:
541 <a name="${old_line_anchor}" href="#${old_line_anchor}">${line.original.lineno}</a>
541 <a name="${old_line_anchor}" href="#${old_line_anchor}">${line.original.lineno}</a>
542 %endif
542 %endif
543 </td>
543 </td>
544 <td class="cb-content ${action_class(line.original.action)}"
544 <td class="cb-content ${action_class(line.original.action)}"
545 data-line-number="o${line.original.lineno}"
545 data-line-no="o${line.original.lineno}"
546 >
546 >
547 %if use_comments and line.original.lineno:
547 %if use_comments and line.original.lineno:
548 ${render_add_comment_button()}
548 ${render_add_comment_button()}
549 %endif
549 %endif
550 <span class="cb-code">${line.original.action} ${line.original.content or '' | n}</span>
550 <span class="cb-code">${line.original.action} ${line.original.content or '' | n}</span>
551 %if use_comments and line.original.lineno and line.original.comments:
551 %if use_comments and line.original.lineno and line.original.comments:
552 ${inline_comments_container(line.original.comments)}
552 ${inline_comments_container(line.original.comments)}
553 %endif
553 %endif
554 </td>
554 </td>
555 <td class="cb-data ${action_class(line.modified.action)}"
555 <td class="cb-data ${action_class(line.modified.action)}"
556 data-line-number="${line.modified.lineno}"
556 data-line-no="${line.modified.lineno}"
557 >
557 >
558 <div>
558 <div>
559 %if line.modified.comments:
559 %if line.modified.comments:
560 <% has_outdated = any([x.outdated for x in line.modified.comments]) %>
560 <% has_outdated = any([x.outdated for x in line.modified.comments]) %>
561 % if has_outdated:
561 % if has_outdated:
562 <i title="${_('comments including outdated')}:${len(line.modified.comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
562 <i title="${_('comments including outdated')}:${len(line.modified.comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
563 % else:
563 % else:
564 <i title="${_('comments')}: ${len(line.modified.comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
564 <i title="${_('comments')}: ${len(line.modified.comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
565 % endif
565 % endif
566 %endif
566 %endif
567 </div>
567 </div>
568 </td>
568 </td>
569 <td class="cb-lineno ${action_class(line.modified.action)}"
569 <td class="cb-lineno ${action_class(line.modified.action)}"
570 data-line-number="${line.modified.lineno}"
570 data-line-no="${line.modified.lineno}"
571 %if new_line_anchor:
571 %if new_line_anchor:
572 id="${new_line_anchor}"
572 id="${new_line_anchor}"
573 %endif
573 %endif
574 >
574 >
575 %if line.modified.lineno:
575 %if line.modified.lineno:
576 <a name="${new_line_anchor}" href="#${new_line_anchor}">${line.modified.lineno}</a>
576 <a name="${new_line_anchor}" href="#${new_line_anchor}">${line.modified.lineno}</a>
577 %endif
577 %endif
578 </td>
578 </td>
579 <td class="cb-content ${action_class(line.modified.action)}"
579 <td class="cb-content ${action_class(line.modified.action)}"
580 data-line-number="n${line.modified.lineno}"
580 data-line-no="n${line.modified.lineno}"
581 >
581 >
582 %if use_comments and line.modified.lineno:
582 %if use_comments and line.modified.lineno:
583 ${render_add_comment_button()}
583 ${render_add_comment_button()}
584 %endif
584 %endif
585 <span class="cb-code">${line.modified.action} ${line.modified.content or '' | n}</span>
585 <span class="cb-code">${line.modified.action} ${line.modified.content or '' | n}</span>
586 %if use_comments and line.modified.lineno and line.modified.comments:
586 %if use_comments and line.modified.lineno and line.modified.comments:
587 ${inline_comments_container(line.modified.comments)}
587 ${inline_comments_container(line.modified.comments)}
588 %endif
588 %endif
589 </td>
589 </td>
590 </tr>
590 </tr>
591 %endfor
591 %endfor
592 </%def>
592 </%def>
593
593
594
594
595 <%def name="render_hunk_lines_unified(hunk, use_comments=False)">
595 <%def name="render_hunk_lines_unified(hunk, use_comments=False)">
596 %for old_line_no, new_line_no, action, content, comments in hunk.unified:
596 %for old_line_no, new_line_no, action, content, comments in hunk.unified:
597 <%
597 <%
598 old_line_anchor, new_line_anchor = None, None
598 old_line_anchor, new_line_anchor = None, None
599 if old_line_no:
599 if old_line_no:
600 old_line_anchor = diff_line_anchor(hunk.source_file_path, old_line_no, 'o')
600 old_line_anchor = diff_line_anchor(hunk.source_file_path, old_line_no, 'o')
601 if new_line_no:
601 if new_line_no:
602 new_line_anchor = diff_line_anchor(hunk.target_file_path, new_line_no, 'n')
602 new_line_anchor = diff_line_anchor(hunk.target_file_path, new_line_no, 'n')
603 %>
603 %>
604 <tr class="cb-line">
604 <tr class="cb-line">
605 <td class="cb-data ${action_class(action)}">
605 <td class="cb-data ${action_class(action)}">
606 <div>
606 <div>
607 % if comments:
607 % if comments:
608 <% has_outdated = any([x.outdated for x in comments]) %>
608 <% has_outdated = any([x.outdated for x in comments]) %>
609 % if has_outdated:
609 % if has_outdated:
610 <i title="${_('comments including outdated')}:${len(comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
610 <i title="${_('comments including outdated')}:${len(comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
611 % else:
611 % else:
612 <i title="${_('comments')}: ${len(comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
612 <i title="${_('comments')}: ${len(comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
613 % endif
613 % endif
614 % endif
614 % endif
615 </div>
615 </div>
616 </td>
616 </td>
617 <td class="cb-lineno ${action_class(action)}"
617 <td class="cb-lineno ${action_class(action)}"
618 data-line-number="${old_line_no}"
618 data-line-no="${old_line_no}"
619 %if old_line_anchor:
619 %if old_line_anchor:
620 id="${old_line_anchor}"
620 id="${old_line_anchor}"
621 %endif
621 %endif
622 >
622 >
623 %if old_line_anchor:
623 %if old_line_anchor:
624 <a name="${old_line_anchor}" href="#${old_line_anchor}">${old_line_no}</a>
624 <a name="${old_line_anchor}" href="#${old_line_anchor}">${old_line_no}</a>
625 %endif
625 %endif
626 </td>
626 </td>
627 <td class="cb-lineno ${action_class(action)}"
627 <td class="cb-lineno ${action_class(action)}"
628 data-line-number="${new_line_no}"
628 data-line-no="${new_line_no}"
629 %if new_line_anchor:
629 %if new_line_anchor:
630 id="${new_line_anchor}"
630 id="${new_line_anchor}"
631 %endif
631 %endif
632 >
632 >
633 %if new_line_anchor:
633 %if new_line_anchor:
634 <a name="${new_line_anchor}" href="#${new_line_anchor}">${new_line_no}</a>
634 <a name="${new_line_anchor}" href="#${new_line_anchor}">${new_line_no}</a>
635 %endif
635 %endif
636 </td>
636 </td>
637 <td class="cb-content ${action_class(action)}"
637 <td class="cb-content ${action_class(action)}"
638 data-line-number="${new_line_no and 'n' or 'o'}${new_line_no or old_line_no}"
638 data-line-no="${new_line_no and 'n' or 'o'}${new_line_no or old_line_no}"
639 >
639 >
640 %if use_comments:
640 %if use_comments:
641 ${render_add_comment_button()}
641 ${render_add_comment_button()}
642 %endif
642 %endif
643 <span class="cb-code">${action} ${content or '' | n}</span>
643 <span class="cb-code">${action} ${content or '' | n}</span>
644 %if use_comments and comments:
644 %if use_comments and comments:
645 ${inline_comments_container(comments)}
645 ${inline_comments_container(comments)}
646 %endif
646 %endif
647 </td>
647 </td>
648 </tr>
648 </tr>
649 %endfor
649 %endfor
650 </%def>
650 </%def>
651
651
652 <%def name="render_add_comment_button()">
652 <%def name="render_add_comment_button()">
653 <button class="btn btn-small btn-primary cb-comment-box-opener" onclick="return Rhodecode.comments.createComment(this)">
653 <button class="btn btn-small btn-primary cb-comment-box-opener" onclick="return Rhodecode.comments.createComment(this)">
654 <span><i class="icon-comment"></i></span>
654 <span><i class="icon-comment"></i></span>
655 </button>
655 </button>
656 </%def>
656 </%def>
657
657
658 <%def name="render_diffset_menu()">
658 <%def name="render_diffset_menu()">
659
659
660 <div class="diffset-menu clearinner">
660 <div class="diffset-menu clearinner">
661 <div class="pull-right">
661 <div class="pull-right">
662 <div class="btn-group">
662 <div class="btn-group">
663
663
664 <a
664 <a
665 class="btn ${c.diffmode == 'sideside' and 'btn-primary'} tooltip"
665 class="btn ${c.diffmode == 'sideside' and 'btn-primary'} tooltip"
666 title="${h.tooltip(_('View side by side'))}"
666 title="${h.tooltip(_('View side by side'))}"
667 href="${h.current_route_path(request, diffmode='sideside')}">
667 href="${h.current_route_path(request, diffmode='sideside')}">
668 <span>${_('Side by Side')}</span>
668 <span>${_('Side by Side')}</span>
669 </a>
669 </a>
670 <a
670 <a
671 class="btn ${c.diffmode == 'unified' and 'btn-primary'} tooltip"
671 class="btn ${c.diffmode == 'unified' and 'btn-primary'} tooltip"
672 title="${h.tooltip(_('View unified'))}" href="${h.current_route_path(request, diffmode='unified')}">
672 title="${h.tooltip(_('View unified'))}" href="${h.current_route_path(request, diffmode='unified')}">
673 <span>${_('Unified')}</span>
673 <span>${_('Unified')}</span>
674 </a>
674 </a>
675 </div>
675 </div>
676 </div>
676 </div>
677
677
678 <div class="pull-left">
678 <div class="pull-left">
679 <div class="btn-group">
679 <div class="btn-group">
680 <a
680 <a
681 class="btn"
681 class="btn"
682 href="#"
682 href="#"
683 onclick="$('input[class=filediff-collapse-state]').prop('checked', false); return false">${_('Expand All Files')}</a>
683 onclick="$('input[class=filediff-collapse-state]').prop('checked', false); return false">${_('Expand All Files')}</a>
684 <a
684 <a
685 class="btn"
685 class="btn"
686 href="#"
686 href="#"
687 onclick="$('input[class=filediff-collapse-state]').prop('checked', true); return false">${_('Collapse All Files')}</a>
687 onclick="$('input[class=filediff-collapse-state]').prop('checked', true); return false">${_('Collapse All Files')}</a>
688 <a
688 <a
689 class="btn"
689 class="btn"
690 href="#"
690 href="#"
691 onclick="return Rhodecode.comments.toggleWideMode(this)">${_('Wide Mode Diff')}</a>
691 onclick="return Rhodecode.comments.toggleWideMode(this)">${_('Wide Mode Diff')}</a>
692 </div>
692 </div>
693 </div>
693 </div>
694 </div>
694 </div>
695 </%def>
695 </%def>
General Comments 0
You need to be logged in to leave comments. Login now