go.chromium.org/luci@v0.0.0-20240309015107-7cdc2e660f33/milo/frontend/static/buildbot/css/default.css (about) 1 /* Copyright 2020 The LUCI Authors. 2 ** 3 ** Licensed under the Apache License, Version 2.0 (the "License"); 4 ** you may not use this file except in compliance with the License. 5 ** You may obtain a copy of the License at 6 ** 7 ** http://www.apache.org/licenses/LICENSE-2.0 8 ** 9 ** Unless required by applicable law or agreed to in writing, software 10 ** distributed under the License is distributed on an "AS IS" BASIS, 11 ** WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 ** See the License for the specific language governing permissions and 13 ** limitations under the License. 14 */ 15 16 body.interface { 17 margin: 0px; 18 font-family: Verdana, sans-serif; 19 font-size: 10px; 20 background-color: #fff; 21 color: #333; 22 } 23 24 #main { 25 margin-left: 30px; 26 margin-right: 30px; 27 margin-top: 20px; 28 margin-bottom: 50px; 29 padding: 0; 30 } 31 32 header { 33 display: flex; 34 justify-content: space-between; 35 } 36 37 footer { 38 clear: both; 39 } 40 41 .clear { 42 clear: both; 43 margin: 0; 44 } 45 46 .prelude { 47 float: left; 48 } 49 50 .main { 51 float: left; 52 } 53 54 .epiloge { 55 clear: both; 56 } 57 58 .lucy-logo { 59 width: 4em; 60 float: left; 61 margin-right: 10px; 62 } 63 64 .auth { 65 position:absolute; 66 top:5px; 67 right:40px; 68 } 69 70 .alert { 71 color: #c30000; 72 background-color: #f2dcdc; 73 padding: 5px 5px 5px 25px; 74 margin-bottom: 20px; 75 border-top:1px solid #ccc; 76 border-bottom:1px solid #ccc; 77 border-color: #c30000; 78 font-size: 20px; 79 } 80 a:link,a:visited,a:active { 81 color: #444; 82 } 83 84 table { 85 border-spacing: 1px 1px; 86 } 87 88 table td { 89 padding: 3px 4px 3px 4px; 90 text-align: center; 91 } 92 93 .Project { 94 min-width: 6em; 95 } 96 97 .LastBuild,.Activity { 98 padding: 0 0 0 4px; 99 } 100 101 .LastBuild,.Activity,.Builder,.BuildStep { 102 min-width: 5em; 103 } 104 105 /* Chromium Specific styles */ 106 div.BuildResultInfo { 107 color: #444; 108 } 109 110 div.Announcement { 111 margin-bottom: 1em; 112 } 113 114 div.Announcement>a:hover { 115 color: black; 116 } 117 118 div.Announcement>div.Notice { 119 background-color: #afdaff; 120 padding: 0.5em; 121 font-size: 16px; 122 text-align: center; 123 } 124 125 div.Announcement>div.Open { 126 border: 3px solid #8fdf5f; 127 padding: 0.5em; 128 font-size: 16px; 129 text-align: center; 130 } 131 132 div.Announcement>div.Closed { 133 border: 5px solid #e98080; 134 padding: 0.5em; 135 font-size: 24px; 136 font-weight: bold; 137 text-align: center; 138 } 139 140 .BuildProperties td.middle { 141 max-width: 250px; 142 text-overflow: ellipsis; 143 overflow: hidden; 144 } 145 146 td.Time { 147 color: #000; 148 border-bottom: 1px solid #aaa; 149 background-color: #eee; 150 } 151 152 td.Activity,td.Change,td.Builder { 153 color: #333333; 154 background-color: #CCCCCC; 155 } 156 157 td.Change { 158 border-radius: 5px; 159 -webkit-border-radius: 5px; 160 -moz-border-radius: 5px; 161 } 162 163 td.Event { 164 color: #777; 165 background-color: #ddd; 166 border-radius: 5px; 167 -webkit-border-radius: 5px; 168 -moz-border-radius: 5px; 169 } 170 171 td.Activity { 172 border-top-left-radius: 10px; 173 -webkit-border-top-left-radius: 10px; 174 -moz-border-radius-topleft: 10px; 175 min-height: 20px; 176 padding: 2px 0 2px 0; 177 } 178 179 td.idle,td.waiting,td.offline,td.building { 180 border-top-left-radius: 0px; 181 -webkit-border-top-left-radius: 0px; 182 -moz-border-radius-topleft: 0px; 183 } 184 185 .LastBuild { 186 border-top-left-radius: 5px; 187 -webkit-border-top-left-radius: 5px; 188 -moz-border-radius-topleft: 5px; 189 border-top-right-radius: 5px; 190 -webkit-border-top-right-radius: 5px; 191 -moz-border-radius-topright: 5px; 192 } 193 194 /* Console view styles */ 195 td.DevStatus > table { 196 table-layout: fixed; 197 } 198 199 td.DevRev { 200 padding: 4px 8px 4px 8px; 201 color: #333333; 202 border-top-left-radius: 5px; 203 -webkit-border-top-left-radius: 5px; 204 -moz-border-radius-topleft: 5px; 205 background-color: #eee; 206 width: 1%; 207 } 208 209 td.DevRevCollapse { 210 border-bottom-left-radius: 5px; 211 -webkit-border-bottom-left-radius: 5px; 212 -moz-border-radius-bottomleft: 5px; 213 } 214 215 td.DevName { 216 padding: 4px 8px 4px 8px; 217 color: #333333; 218 background-color: #eee; 219 width: 1%; 220 text-align: left; 221 } 222 223 td.DevStatus { 224 padding: 4px 4px 4px 4px; 225 color: #333333; 226 background-color: #eee; 227 } 228 229 td.first { 230 border-top-left-radius: 5px; 231 -webkit-border-top-left-radius: 5px; 232 -moz-border-radius-topleft: 5px; 233 } 234 235 td.last { 236 border-top-right-radius: 5px; 237 -webkit-border-top-right-radius: 5px; 238 -moz-border-radius-topright: 5px; 239 } 240 241 td.DevStatusCategory { 242 border-radius: 5px; 243 -webkit-border-radius: 5px; 244 -moz-border-radius: 5px; 245 border-width: 1px; 246 border-style: solid; 247 } 248 249 td.DevStatusCollapse { 250 border-bottom-right-radius: 5px; 251 -webkit-border-bottom-right-radius: 5px; 252 -moz-border-radius-bottomright: 5px; 253 } 254 255 td.DevDetails { 256 font-weight: normal; 257 padding: 8px 8px 8px 8px; 258 color: #333333; 259 background-color: #eee; 260 text-align: left; 261 } 262 263 td.DevDetails li a { 264 padding-right: 5px; 265 } 266 267 td.DevComment { 268 font-weight: normal; 269 padding: 8px 8px 8px 8px; 270 color: #333333; 271 background-color: #eee; 272 text-align: left; 273 } 274 275 td.DevBottom { 276 border-bottom-right-radius: 5px; 277 -webkit-border-bottom-right-radius: 5px; 278 -moz-border-radius-bottomright: 5px; 279 border-bottom-left-radius: 5px; 280 -webkit-border-bottom-left-radius: 5px; 281 -moz-border-radius-bottomleft: 5px; 282 } 283 284 td.Alt { 285 background-color: #ddd; 286 } 287 288 tr:nth-child(even) { 289 background-color: #ddd; 290 } 291 292 li.sublink:nth-child(odd) { 293 background-color: #eee; 294 } 295 296 .graph { 297 width: 200px; 298 text-align: left; 299 } 300 301 .bar { 302 display: inline-block; 303 height: 10px; 304 border: 1px solid black; 305 } 306 307 .idle { 308 background-color: #8d4; 309 } 310 311 .busy { 312 background-color: #fd3; 313 } 314 315 .quarantined { 316 background-color: #66c; 317 } 318 319 .offline { 320 background-color: #c6c; 321 } 322 323 .account-picture { 324 border-radius: 6px; 325 width: 25px; 326 height: 25px; 327 vertical-align: middle; 328 } 329 330 .legend { 331 border-radius: 5px !important; 332 -webkit-border-radius: 5px !important; 333 -moz-border-radius: 5px !important; 334 width: 100px; 335 max-width: 100px; 336 text-align: center; 337 padding: 2px 2px 2px 2px; 338 height: 14px; 339 white-space: nowrap; 340 } 341 342 .DevStatusBox { 343 text-align: center; 344 height: 20px; 345 padding: 0 2px; 346 line-height: 0; 347 white-space: nowrap; 348 } 349 350 .DevStatusBox a { 351 opacity: 0.85; 352 border-width: 1px; 353 border-style: solid; 354 border-radius: 4px; 355 -webkit-border-radius: 4px; 356 -moz-border-radius: 4px; 357 display: block; 358 width: 90%; 359 height: 20px; 360 line-height: 20px; 361 margin-left: auto; 362 margin-right: auto; 363 } 364 365 .DevStatusBox a.notinbuilder { 366 border-style: none; 367 } 368 369 a.noround { 370 border-radius: 0px; 371 -webkit-border-radius: 0px; 372 -moz-border-radius: 0px; 373 position: relative; 374 margin-top: -8px; 375 margin-bottom: -8px; 376 height: 36px; 377 border-top-width: 0; 378 border-bottom-width: 0; 379 } 380 381 a.begin { 382 border-top-width: 1px; 383 position: relative; 384 margin-top: 0px; 385 margin-bottom: -7px; 386 height: 27px; 387 border-top-left-radius: 4px; 388 -webkit-border-top-left-radius: 4px; 389 -moz-border-radius-topleft: 4px; 390 border-top-right-radius: 4px; 391 -webkit-border-top-right-radius: 4px; 392 -moz-border-radius-topright: 4px; 393 } 394 395 a.end { 396 border-bottom-width: 1px; 397 position: relative; 398 margin-top: -7px; 399 margin-bottom: 0px; 400 height: 27px; 401 border-bottom-left-radius: 4px; 402 -webkit-border-bottom-left-radius: 4px; 403 -moz-border-radius-bottomleft: 4px; 404 border-bottom-right-radius: 4px; 405 -webkit-border-bottom-right-radius: 4px; 406 -moz-border-radius-bottomright: 4px; 407 } 408 409 .center_align { 410 text-align: center; 411 } 412 413 .right_align { 414 text-align: right; 415 } 416 417 .left_align { 418 text-align: left; 419 } 420 421 div.BuildWaterfall { 422 border-radius: 7px; 423 -webkit-border-radius: 7px; 424 -moz-border-radius: 7px; 425 position: absolute; 426 left: 0px; 427 top: 0px; 428 background-color: #FFFFFF; 429 padding: 4px 4px 4px 4px; 430 float: left; 431 display: none; 432 border-width: 1px; 433 border-style: solid; 434 } 435 436 .main-status { 437 font-weight: bold; 438 } 439 440 /* LastBuild, BuildStep states */ 441 .success, .status-Success, .status-Idle, .tree-status-open, .status.SUCCESS { 442 color: #000; 443 background-color: #8d4; 444 border-color: #4F8530; 445 } 446 447 .failure, .status-Failure, .tree-status-closed, .status.FAILURE { 448 color: #000; 449 background-color: #e88; 450 border-color: #A77272; 451 border-style: solid; 452 } 453 454 .status-Canceled, .status.CANCELED { 455 color: #000; 456 background-color: #8ef; 457 border-color: #00d8fc; 458 border-style: solid; 459 } 460 461 462 .failure-again { 463 color: #000; 464 background-color: #eA9; 465 border-color: #A77272; 466 border-style: solid; 467 } 468 469 .status-InfraFailure, .status.INFRA_FAILURE { 470 color: #FFFFFF; 471 background-color: #c6c; 472 border-color: #ACA0B3; 473 } 474 475 .expired, .status-Expired { 476 color: #FFFFFF; 477 background-color: #ac39ac; 478 border-color: #ACA0B3; 479 } 480 481 .warning, .status-Warning { 482 color: #FFFFFF; 483 background-color: #fa3; 484 border-color: #C29D46; 485 } 486 487 .skipped { 488 color: #000; 489 background: #AADDEE; 490 border-color: #AADDEE; 491 } 492 493 .exception, .retry, .status-Exception, .status-Offline, .tree-status-maintenance { 494 color: #FFFFFF; 495 background-color: #c6c; 496 border-color: #ACA0B3; 497 } 498 499 .status-Quarantined { 500 color: #FFFFFF; 501 background-color: #66c; 502 border-color: #66A0B3; 503 } 504 505 .start, .status-NotRun, .status.SCHEDULED { 506 color: #000; 507 background-color: #ccc; 508 border-color: #ccc; 509 } 510 511 .running, .waiting, td.building, .status-Running, .status-Busy, .tree-status-throttled, .status.STARTED { 512 color: #000; 513 background-color: #fd3; 514 border-color: #C5C56D; 515 } 516 517 .paused { 518 color: #FFFFFF; 519 background-color: #8080FF; 520 border-color: #dddddd; 521 } 522 523 .offline,td.offline,.pending{ 524 color: #FFFFFF; 525 background-color: #777777; 526 border-color: #dddddd; 527 } 528 529 530 .start { 531 border-bottom-left-radius: 10px; 532 -webkit-border-bottom-left-radius: 10px; 533 -moz-border-radius-bottomleft: 10px; 534 border-bottom-right-radius: 10px; 535 -webkit-border-bottom-right-radius: 10px; 536 -moz-border-radius-bottomright: 10px; 537 } 538 539 .notstarted { 540 border-width: 1px; 541 border-style: solid; 542 border-color: #aaa; 543 background-color: #fff; 544 } 545 546 .closed { 547 background-color: #ff0000; 548 } 549 550 .closed .large { 551 font-size: 1.5em; 552 font-weight: bolder; 553 } 554 555 td.Project a:hover,td.start a:hover { 556 color: #000; 557 } 558 559 .mini-box { 560 text-align: center; 561 height: 20px; 562 padding: 0 2px; 563 line-height: 0; 564 white-space: nowrap; 565 } 566 567 .mini-box a { 568 border-radius: 0; 569 -webkit-border-radius: 0; 570 -moz-border-radius: 0; 571 display: block; 572 width: 100%; 573 height: 20px; 574 line-height: 20px; 575 margin-top: -30px; 576 } 577 578 .mini-closed { 579 -box-sizing: border-box; 580 -webkit-box-sizing: border-box; 581 border: 4px solid red; 582 } 583 584 /* grid styles */ 585 table.Grid { 586 border-collapse: collapse; 587 } 588 589 table.Grid tr td { 590 padding: 0.2em; 591 margin: 0px; 592 text-align: center; 593 } 594 595 table.Grid tr td.title { 596 font-size: 90%; 597 border-right: 1px gray solid; 598 border-bottom: 1px gray solid; 599 } 600 601 table.Grid tr td.sourcestamp { 602 font-size: 90%; 603 } 604 605 table.Grid tr td.builder { 606 text-align: right; 607 font-size: 90%; 608 } 609 610 table.Grid tr td.build { 611 border: 1px gray solid; 612 } 613 614 /* column container */ 615 div.column { 616 margin: 0 2em 2em 0; 617 float: left; 618 } 619 620 /* info tables */ 621 table.info { 622 border-spacing: 1px; 623 } 624 625 table.info td { 626 padding: 0.1em 1em 0.1em 1em; 627 text-align: center; 628 } 629 630 table.info th { 631 padding: 0.2em 1.5em 0.2em 1.5em; 632 text-align: center; 633 } 634 635 table.info .left { 636 text-align: left 637 } 638 639 td.value { 640 font-weight: bold; 641 } 642 643 table.info td .reason { 644 display:block; 645 font-weight: bold; 646 } 647 648 .alt { 649 background-color: #f6f6f6; 650 } 651 652 ul.alternating li:nth-child(even) { 653 background-color: #ddd; 654 } 655 656 li { 657 padding: 0.1em 1em 0.1em 1em; 658 } 659 660 li.substeps > ol { 661 padding-left: 2em; 662 } 663 664 li.collapsed ol { 665 display: none; 666 } 667 668 li.substeps.collapsed > div.result > b:before { 669 content: "\25B6"; 670 padding-right: 4px; 671 } 672 673 li.substeps > div.result > b:before { 674 content: "\25BC"; 675 padding-right: 4px; 676 } 677 678 .file { 679 font-weight: bold; 680 } 681 682 .result, .errors { 683 padding: 0.3em 1em 0.3em 1em; 684 } 685 686 .result li { 687 padding-left: 0; 688 padding-right: 0; 689 } 690 691 .result li p { 692 margin-top: 0.5em; 693 margin-bottom: 0.5em; 694 } 695 696 .ui-tooltip { 697 white-space: pre-line; 698 font-size: medium; 699 } 700 701 /* log view */ 702 .log * { 703 vlink: #800080; 704 font-family: "Courier New", courier, monotype, monospace; 705 font-size: 1.5em; 706 } 707 708 span.duration { 709 text-align: right; 710 float: right; 711 display: inline-block; 712 } 713 714 span.stdout { 715 color: black; 716 } 717 718 span.stderr { 719 color: red; 720 } 721 722 span.header { 723 color: blue; 724 } 725 span.ansi30 { 726 color: black; 727 } 728 span.ansi31 { 729 color: red; 730 } 731 span.ansi32 { 732 color: green; 733 } 734 span.ansi33 { 735 color: orange; 736 } 737 span.ansi34 { 738 color: yellow; 739 } 740 span.ansi35 { 741 color: purple; 742 } 743 span.ansi36 { 744 color: blue; 745 } 746 span.ansi37 { 747 color: white; 748 } 749 span.hidden { 750 display: none; 751 } 752 753 /* revision & email */ 754 .revision .full { 755 display: none; 756 } 757 758 .user .email { 759 display: none; 760 } 761 762 pre { 763 white-space: pre-wrap; 764 } 765 766 /* change comments (use regular colors here) */ 767 pre.comments>a:link,pre.comments>a:visited { 768 color: blue; 769 } 770 771 pre.comments>a:active { 772 color: purple; 773 } 774 775 .project-favicon-text { 776 width: 150px; 777 height: 125px; 778 text-align: center; 779 font-size: 50pt; 780 padding-top: 25px; 781 } 782 783 .project a:link { 784 text-decoration: none; 785 } 786 787 .project a:visited { 788 text-decoration: none; 789 } 790 791 .project a:hover { 792 text-decoration: none; 793 } 794 795 .project a:active { 796 text-decoration: none; 797 } 798 799 .project img { 800 max-width: 140px; 801 height: 140px; 802 padding: 5px; 803 margin-left: auto; 804 margin-right: auto; 805 border-radius: 20px; 806 display: block; 807 } 808 809 .project:hover { 810 background: #cce; 811 } 812 813 .project { 814 font-size: 10pt; 815 width: 150px; 816 height: 200px; 817 background-color: gray; 818 margin: 10px; 819 float: left; 820 padding: .5em; 821 background: #ddd; 822 box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .2); 823 border-radius: 30px 30px 30px 30px; 824 } 825 826 .project-label { 827 margin-top: 10px; 828 text-align: center; 829 } 830 831 .project-console-item img { 832 width: 20px; 833 height: 20px; 834 } 835 836 .project { 837 font-size: 10pt; 838 } 839 840 form.command_forcebuild { 841 border-top: 1px solid black; 842 padding: .5em; 843 margin: .5em; 844 } 845 846 form.command_forcebuild > .row { 847 border-top: 1px dotted gray; 848 padding: .5em 0; 849 } 850 851 form.command_forcebuild .force-textarea > .label { 852 display: block; 853 } 854 855 form.command_forcebuild .force-nested > .label { 856 font-weight: bold; 857 display: list-item; 858 } 859 860 form.command_forcebuild .force-any .force-text { 861 display: inline; 862 } 863 864 .summary-markdown h1 { 865 font-size: 1rem; 866 } 867 868 .summary-markdown h2 { 869 font-size: 0.9rem; 870 } 871 872 .summary-markdown h3 { 873 font-size: 0.8rem; 874 } 875 876 .summary-markdown h4 { 877 font-size: 0.7rem; 878 } 879 880 .summary-markdown h5 { 881 font-size: 0.6rem; 882 } 883 884 .summary-markdown h6 { 885 font-size: 0.5rem; 886 } 887 888 div.step-text:first-child { 889 display: inline; 890 } 891 892 .non-green li.green { 893 display: none; 894 } 895 896 .hide-debug-logs li.debug-log { 897 display: none; 898 } 899 900 .critical-NO { 901 opacity: 0.5; 902 } 903 904 .canary-warning { 905 margin: 5px 0; 906 color: #bb0808; 907 } 908 909 #opt-in-banner>div { 910 background-color: #feb; 911 text-align: center; 912 padding: 3px; 913 color: #333; 914 font-weight: bold; 915 font-size: 12px; 916 } 917 918 #opt-in-link { 919 position: relative; 920 z-index: 2; 921 } 922 923 #feedback-bar { 924 position: absolute; 925 transition-property: top; 926 transition-duration: 0.5s; 927 transition-timing-function: ease; 928 animation: 0.5s ease-out dropdown; 929 z-index: 1; 930 top: 0px; 931 width: 100%; 932 } 933 934 #feedback-bar.show { 935 top: 20px; 936 }