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