github.com/yrj2011/jx-test-infra@v0.0.0-20190529031832-7a2065ee98eb/prow/cmd/deck/static/style.css (about) 1 body { 2 line-height: 1.4; 3 background: #f4f4f4; 4 color: #444; 5 font-family: 'Roboto', sans-serif !important; 6 font-size: 16px !important; 7 } 8 9 code { 10 background-color: #EEEEEE; 11 border-radius: 3px; 12 padding: 0 6px; 13 } 14 15 a.current { 16 text-decoration: underline !important; 17 } 18 19 a:link { 20 text-decoration: none; 21 color: #3F51B5; 22 } 23 24 .header-title { 25 margin-left: 24px; 26 } 27 28 .logo { 29 height: 48px; 30 width: 48px; 31 } 32 33 h1 { 34 font-weight: normal; 35 font-size: 2em; 36 margin: 2px; 37 } 38 39 h4 { 40 margin: 5px; 41 } 42 43 p, pre, ul, ol { 44 margin: 0; 45 } 46 47 .indented { 48 margin-left: 30px; 49 } 50 51 ul.indented { 52 margin-left: 0; 53 } 54 55 aside { 56 margin: 8px; 57 } 58 59 ul.noBullets { 60 list-style-type: none; 61 margin: 0; 62 padding: 0; 63 } 64 65 ul.noBullets li { 66 margin: 0 8px; 67 display: inline-block; 68 } 69 70 select { 71 height: 1.4em; 72 border: none; 73 border-bottom: 1px solid #e3e3e3; 74 background: transparent; 75 } 76 77 article { 78 overflow: hidden; 79 margin: 8px; 80 } 81 82 table { 83 background: #fff; 84 border-radius: 2px; 85 box-shadow: 0 0 4px #e0e0e0; 86 border-collapse: collapse; 87 width: 100%; 88 } 89 90 tr { 91 border-top: 1px solid #f4f4f4; 92 } 93 94 tr.changed { 95 border-top: 1px solid #a4a4a4; 96 } 97 98 td:first-child, th:first-child { 99 padding-left: 16px; 100 } 101 102 td:last-child, th:last-child { 103 padding-right: 16px; 104 } 105 106 td, th { 107 text-align: left; 108 padding: 8px; 109 } 110 111 th { 112 color: #333; 113 } 114 115 .hidden { 116 display: none; 117 } 118 119 .blocked { 120 color: #EF5350; 121 } 122 123 .icon-cell { 124 width: 32px; 125 } 126 /** 127 * ProwJob State style 128 */ 129 i.state { 130 width: 24px; 131 height: 24px; 132 vertical-align: middle; 133 } 134 135 .state.triggered, .state.pending, .state.triggered.mdl-list__item-icon.material-icons, 136 .state.pending.mdl-list__item-icon.material-icons { 137 color: #FFCA28; 138 } 139 140 .state.success, .state.success.mdl-list__item-icon.material-icons { 141 color: #66BB6A; 142 } 143 144 .state.failure, .state.failure.mdl-list__item-icon.material-icons { 145 color: #EF5350; 146 } 147 148 .state.error, .state.aborted, .state.error.mdl-list__item-icon.material-icons, 149 .state.aborted.mdl-list__item-icon.material-icons { 150 color: #BDBDBD; 151 } 152 153 .state.context-warning.mdl-list__item-icon.material-icons { 154 color: #F4C20D; 155 } 156 157 #filter-list { 158 display: flex; 159 flex-wrap: wrap; 160 } 161 162 #filter-list li:last-child { 163 margin-left: auto; 164 } 165 166 #job-count { 167 float: right; 168 font-size: 12px; 169 } 170 171 #job-bar { 172 align-items: center; 173 color: #ffffff; 174 display: flex; 175 height: 14px; 176 font-size: 12px; 177 font-weight: bold; 178 line-height: 14px; 179 text-align: center; 180 } 181 182 .job-bar-state { 183 cursor: pointer; 184 outline: none; 185 } 186 /** Job bar **/ 187 #job-bar-success { 188 background-color: #66BB6A; 189 } 190 191 #job-bar-pending { 192 background-color: #FBC02D; 193 color: #000000; 194 } 195 196 #job-bar-triggered { 197 background-color: #FFEB3B; 198 color: #000000; 199 } 200 201 #job-bar-failure { 202 background-color: #F44336; 203 } 204 205 #job-bar-error { 206 background-color: #795548; 207 } 208 209 #job-bar-aborted { 210 background-color: #BDBDBD; 211 } 212 213 #job-bar-unknown { 214 background-color: #673AB7; 215 } 216 /** --- **/ 217 #top-navigator { 218 background-color: #e5e5e5; 219 bottom: 32px; 220 height: 52px; 221 min-width: 52px; 222 position: fixed; 223 right: 32px; 224 width: 52px; 225 } 226 227 #rerun { 228 display: none; 229 position: fixed; 230 z-index: 1; 231 padding-top: 100px; 232 margin: 0; 233 left: 0; 234 top: 0; 235 width: 100%; 236 height: 100%; 237 overflow: auto; 238 background-color: rgba(0,0,0,0.4); 239 } 240 241 #rerun-content { 242 font-family: monospace; 243 background-color: #fefefe; 244 margin: auto; 245 padding: 20px; 246 border: 1px solid #888; 247 width: 80%; 248 text-align: center; 249 } 250 251 #queries li { 252 padding: .5em .35em; 253 line-height: 1.75; 254 color: black; 255 list-style-type: disc; 256 } 257 258 #info-div h4 { 259 cursor: pointer; 260 margin-top: 0.6em; 261 } 262 263 264 span.label { 265 padding: .11em .35em; 266 border-radius: .2em; 267 border: .1em solid transparent; 268 transition: opacity 0.2s linear; 269 font-weight: bold; 270 margin: 0 .1em; 271 text-align: center; 272 color: white; 273 box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12); 274 background-color: #ededed; 275 color: #333333; 276 white-space: nowrap; 277 } 278 279 span.label:not(.merge-table-label):hover { 280 opacity: 0.85; 281 } 282 283 .table-container { 284 overflow-x: auto; 285 } 286 287 /** 288 * Command help style sheet. 289 */ 290 .emphasis { 291 font-weight: bold; 292 } 293 294 .card-box { 295 background-color: white; 296 border-radius: 2px; 297 box-shadow: 0 0 4px #e0e0e0; 298 padding: 8px 8px; 299 } 300 301 #command-table { 302 display: none; 303 margin: 8px; 304 width: calc(100% - 16px); 305 } 306 307 .command-examples { 308 background-color: #e5e5e5; 309 border-radius: 2px; 310 box-shadow: 1px 1px 2px #ededed; 311 display: inline-block; 312 font-size: 15px; 313 margin: 4px 0; 314 padding: 2px 8px; 315 } 316 317 .command-usage { 318 color: #757575; 319 font-size: 15px; 320 font-weight: bolder; 321 } 322 323 .command-example-list { 324 list-style-type: none; 325 padding: 0; 326 } 327 328 .table-cell { 329 white-space: pre-wrap; /* css-3 */ 330 white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 331 white-space: -o-pre-wrap; /* Opera 7 */ 332 word-wrap: break-word; /* Internet Explorer 5.5+ */ 333 } 334 335 .command-desc-text { 336 font-size: 15px; 337 overflow-wrap: break-word; 338 } 339 340 #dialog { 341 width: 500px; 342 } 343 344 .dialog-section-title { 345 font-weight: bold; 346 } 347 348 #usage-col { 349 min-width: 200px; 350 } 351 352 .fuzzy-search { 353 position: relative; 354 } 355 356 .fuzzy-search-input { 357 border-width: 0 0 1px 0; 358 outline: none; 359 } 360 361 .fuzzy-search, .fuzzy-search-input { 362 font-size: 14px; 363 width: 450px; 364 } 365 366 #job-list li { 367 display: block; 368 margin: 0; 369 padding: 8px 8px; 370 } 371 372 .job-selected { 373 background-color: #e5e5e5; 374 } 375 376 .fuzzy-search-list { 377 background-color: #fff; 378 box-shadow: 0 0 4px #e0e0e0; 379 display: none; 380 height: 300px; 381 left: 0; 382 overflow-y: scroll; 383 padding: 0; 384 position: absolute; 385 } 386 387 .active-fuzzy-search { 388 display: block; 389 } 390 391 .featured-icon { 392 color: #FDD835; 393 } 394 395 .external-icon, .link-icon { 396 color: #607D8B; 397 } 398 399 .icon-button { 400 color: #757575; 401 } 402 403 /* Known GitHub Labels, can be overridden in extensions/style.css */ 404 /* NOTE: spaces must be stripped from the label name */ 405 .label.area { 406 background-color: #1a53c5; 407 color: #fff; 408 } 409 .label.XS { 410 background-color: #5da447; 411 color: #000; 412 } 413 .label.S { 414 background-color: #99c356; 415 color: #000; 416 } 417 .label.M { 418 background-color: #ebc65d; 419 color: #000; 420 } 421 .label.L { 422 background-color: #e7ab56; 423 color: #000; 424 } 425 .label.XL { 426 background-color: #e27749; 427 color: #000; 428 } 429 .label.XXL { 430 background-color: #e14f43; 431 color: #fff; 432 } 433 .label.lgtm { 434 background-color: #15dd18; 435 color: #000000; 436 } 437 .label.approved { 438 background-color: #0ffa16; 439 color: #000000; 440 } 441 .label.cncf-cla\:yes { 442 background-color: #bfe5bf; 443 color: #000000; 444 } 445 446 .label.needs-ok-to-test { 447 background-color: #b60205; 448 color: #ffffff; 449 } 450 .label.do-not-merge, 451 .label.do-not-merge\/hold, 452 .label.do-not-merge\/work-in-progress, 453 .label.do-not-merge\/release-note-label-needed, 454 .label.do-not-merge\/cherry-pick-not-approved, 455 .label.do-not-merge\/blocked-paths, 456 .label.do-not-merge\/invalid-owners-file { 457 background-color: #e11d21; 458 color: #ffffff; 459 } 460 .label.needs-rebase { 461 background-color: #BDBDBD; 462 color: #000000; 463 } 464 465 /* 466 Plugin Help style 467 */ 468 #plugin-container { 469 display: flex; 470 flex-direction: row; 471 flex-wrap: wrap; 472 justify-content: center; 473 } 474 475 .plugin-help-card.mdl-card { 476 justify-content: space-between; 477 margin: 8px; 478 min-height: 0; 479 width: 400px; 480 } 481 482 .plugin-help-card > .mdl-card__supporting-text { 483 font-size: 15px; 484 } 485 486 .plugin-help-card > .mdl-card__title, .mdl-dialog__title { 487 color: #3f51b5; 488 } 489 490 .plugin-help-card.deprecated > .mdl-card__title { 491 color: #e57373; 492 } 493 494 .plugin-help-command-link { 495 background-color: #e5e5e5; 496 border-radius: 2px; 497 box-shadow: 1px 1px 2px #ededed; 498 color: #757575; 499 display: inline-block; 500 font-size: 15px; 501 font-weight: bold; 502 margin: 0 8px; 503 padding: 8px 16px; 504 } 505 /* 506 * User dashboard style sheet 507 */ 508 #loading-progress { 509 margin: 0 8px; 510 width: calc(100% - 16px); 511 } 512 513 #main-container { 514 display: flex; 515 flex-direction: column; 516 } 517 518 #main-container .message { 519 padding-top: 72px; 520 text-align: center; 521 } 522 523 .pr-status-dialog > .mdl-dialog__content p { 524 font-size: 16px; 525 } 526 527 #merge-help-dialog.mdl-dialog, #status-help-dialog.mdl-dialog, #search-dialog.mdl-dialog { 528 width: 600px; 529 } 530 531 #query-dialog.mdl-dialog { 532 width: 1000px; 533 } 534 535 #search-action { 536 align-items: center; 537 display: flex; 538 justify-content: center; 539 flex-direction: column; 540 margin-left: 8px; 541 } 542 543 #search-input-ctn { 544 display: flex; 545 align-items: center; 546 justify-content: space-between; 547 } 548 549 #search-card h6 { 550 color: #3F51B5; 551 margin: 0; 552 } 553 554 #search-card.mdl-card { 555 min-height: 0; 556 padding: 8px 24px; 557 } 558 559 #search-input { 560 align-self: center; 561 background-color: #FAFAFA; 562 border: 1px solid #E0E0E0; 563 border-radius: 4px; 564 line-height: 40px; 565 font-size: 15px; 566 overflow: hidden; 567 padding: 0 8px; 568 width: 100%; 569 } 570 571 .arrow-icon { 572 margin-left: auto; 573 } 574 575 .help-icon-button .icon-button { 576 color: #607D8B; 577 } 578 579 .job-list a { 580 color: rgba(0, 0, 0, .87); 581 } 582 583 .job-list.mdl-list { 584 border: 1px solid #E0E0E0; 585 border-top: none; 586 max-height: 240px; 587 padding: 0; 588 overflow-y: auto; 589 } 590 591 .job-list-item.mdl-list__item { 592 height: 32px; 593 min-height: 32px; 594 padding: 4px; 595 } 596 597 .job-list-item:hover { 598 background-color: #CFD8DC; 599 } 600 601 .job-list-item.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon { 602 margin-right: 17px; 603 } 604 605 .merge-table { 606 box-shadow: none; 607 background-color: #F5F5F5; 608 user-select: none; 609 } 610 611 .merge-table tbody td:not(.merge-table-icon) { 612 width: 47%; 613 } 614 615 .merge-table-icon { 616 padding: 0; 617 width: 6%; 618 text-align: center; 619 } 620 621 .merge-table thead td { 622 font-weight: bold; 623 } 624 625 .merge-table thead tr:last-child { 626 border-top: 2px solid #BDBDBD; 627 color: #424242; 628 } 629 630 .merge-table-label.label { 631 display: inline-block; 632 margin: 2px 2px; 633 } 634 635 .merge-table thead tr { 636 border-top: none; 637 } 638 639 .merge-table tr { 640 border: 1px solid #E0E0E0; 641 box-shadow: none; 642 height: 40px; 643 min-height: 40px; 644 } 645 646 .message-icon.material-icons { 647 color: #444444; 648 font-size: 28px; 649 margin-left: 12px; 650 } 651 652 .no-status.status { 653 padding-left: 54px; 654 cursor: unset; 655 } 656 657 .title-label { 658 font-size: 13px; 659 font-weight: bold; 660 border-radius: 4px; 661 margin-left: 8px; 662 padding: 4px 8px; 663 } 664 665 .title-label.failed { 666 background-color: #EF5350; 667 color: #ffffff; 668 } 669 670 .title-label.succeeded { 671 background-color: #43A047; 672 color: #ffffff; 673 } 674 .title-label.pending { 675 background-color: #FFD54F; 676 } 677 678 .title-label.batching, .title-label.passing { 679 background-color: #1E88E5; 680 color: #ffffff; 681 } 682 683 .title-label.merging { 684 background-color: #673AB7; 685 color: #ffffff; 686 } 687 688 .title-label.unknown { 689 background-color: #757575; 690 color: #ffffff; 691 } 692 693 .pr-card { 694 align-self: center; 695 flex-shrink: 0; 696 justify-content: center; 697 margin: 4px 0; 698 } 699 700 .pr-card.mdl-card { 701 border: 1px solid #e5e5e5; 702 max-width: 1200px; 703 min-width: 500px; 704 width: 100%; 705 } 706 707 .pr-card > .mdl-card__supporting-text { 708 padding-top: 0; 709 width: auto; 710 } 711 712 .pr-card > .mdl-card__supporting-text h3 { 713 color: #616161; 714 margin: 0 0 12px 0; 715 font-size: 24px; 716 } 717 718 .pr-card > .mdl-card__title { 719 justify-content: space-between; 720 } 721 722 .pr-card > .mdl-card__title h4 { 723 color: #3F51B5; 724 } 725 726 .pr-card > .mdl-card__title a { 727 padding: 0; 728 } 729 730 .pr-title-text { 731 align-items: center; 732 display: flex; 733 justify-content: center; 734 } 735 736 .pr-title-text > .mdl-card__subtitle-text { 737 padding-left: 8px; 738 } 739 740 .status { 741 align-items: center; 742 border-bottom: 1px solid #EFEBE9; 743 cursor: pointer; 744 background-color: #ffffff; 745 display: flex; 746 font-size: 16px; 747 font-weight: bold; 748 height: 24px; 749 line-height: 24px; 750 padding: 12px 16px 2px 17px; 751 user-select: none; 752 } 753 754 .status > .status-icon { 755 margin: 0 12px 4px 0; 756 } 757 758 .status-icon.failed { 759 color: #D32F2F; 760 } 761 762 .status-icon.succeeded { 763 color: #2E7D32; 764 } 765 766 .status-icon.pending { 767 color: #FFB300; 768 } 769 770 .status > .mdl-button--icon > .material-icons { 771 font-size: 20px; 772 user-select: none; 773 } 774 775 .status > .help-icon-button.mdl-button--icon { 776 margin: 0 0 2px 2px; 777 } 778 779 .status-container { 780 background-color: #F5F5F5; 781 position: relative; 782 margin-top: 2px; 783 } 784 785 .state.mdl-list__item-icon.material-icons { 786 font-size: 16px; 787 width: 16px; 788 height: 16px; 789 margin-left: 16px; 790 } 791 792 .search-title { 793 align-items: center; 794 display: flex; 795 margin-top: 8px; 796 } 797 798 .search-title .mdl-button--icon { 799 margin-left: 2px; 800 } 801 802 .search-title .mdl-button--icon .material-icons { 803 font-size: 20px; 804 } 805 806 .query-details-section { 807 font-size: 20px; 808 font-weight: bold; 809 } 810 811 .pr-status-dialog > .mdl-dialog__title { 812 font-size: 32px; 813 } 814 815 @media (max-device-width: 768px) { 816 .job-list-item.mdl-list__item { 817 font-size: 12px; 818 } 819 820 .job-list-item.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon { 821 margin-right: 14px; 822 } 823 824 .no-status.status { 825 padding-left: 40px; 826 } 827 828 .pr-card.mdl-card { 829 margin: 0 0 8px 0; 830 } 831 832 .pr-card.mdl-card { 833 width: 100%; 834 min-width: 0; 835 } 836 837 .pr-card > .mdl-card__title h4 { 838 font-size: 16px; 839 } 840 841 .pr-card > .mdl-card__supporting-text h3 { 842 font-size: 16px; 843 line-height: 24px; 844 margin-bottom: 8px; 845 } 846 847 .pr-title-text { 848 flex-direction: column; 849 align-items: flex-start; 850 } 851 852 .pr-title-text > .mdl-card__subtitle-text { 853 padding-left: 0; 854 } 855 856 .title-label { 857 margin: 0; 858 font-size: 10px; 859 } 860 861 .status { 862 font-size: 14px; 863 padding: 4px 8px; 864 } 865 866 .merge-table-label { 867 font-size: 10px; 868 } 869 870 .merge-table tr { 871 font-size: 12px; 872 } 873 874 .status .material-icons, .status > .mdl-button--icon > .material-icons { 875 font-size: 16px; 876 } 877 878 .status-icon.material-icons { 879 margin: 0 14px 2px 0; 880 } 881 882 .state.mdl-list__item-icon.material-icons { 883 margin-left: 4px; 884 } 885 886 #merge-help-dialog.mdl-dialog, #query-dialog.mdl-dialog, #status-help-dialog.mdl-dialog, 887 #search-dialog.mdl-dialog { 888 width: 320px; 889 } 890 891 }