git.sur5r.net Git - bacula/bacula/blob - gui/baculum/themes/Baculum-v1/style.css

   1 body {
   2         background-color: #b5c9d3;
   3         background-image: url('background.png');
   4         background-repeat: repeat-x;
   5         font-family: Arial, Helvetica, sans-serif;
   6         color: white;
   7 }
   8
   9 #message-body {
  10         background-color: #832933;
  11         background-image: none;
  12         background-repeat: repeat-x;
  13         font-family: Arial, Helvetica, sans-serif;
  14         color: black;
  15 }
  16
  17 input.invalidate, select.invalidate {
  18         border: 1px solid red;
  19 }
  20
  21 input[type=text], input[type=password], select, textarea {
  22                 -webkit-border-radius: 4px;
  23                 -moz-border-radius: 4px;
  24                 border-radius: 4px;
  25                 padding: 5px;
  26 }
  27
  28 input[type=checkbox] {
  29                 height: 16px;
  30                 width: 16px;
  31 }
  32
  33 input.textbox, select.textbox {
  34         width: 260px;
  35         border: 1px solid black;
  36         font-size: 11pt;
  37         display: table-cell;
  38 }
  39
  40 input.textbox-short, select.textbox-short {
  41         width: 80px;
  42         border: 1px solid black;
  43         font-size: 11pt;
  44         display: table-cell;
  45 }
  46
  47 input.textbox-auto, select.textbox-auto, textarea.textbox-auto {
  48         border: 1px solid black;
  49         font-size: 14px;
  50         display: table-cell;
  51 }
  52
  53 textarea.textbox-auto {
  54         resize: vertical;
  55         width: 100%;
  56         font-size: 11px;
  57 }
  58
  59 a {
  60         font-size: 12px;
  61         color: white;
  62         padding: 3px 4px;
  63         text-decoration: none;
  64 }
  65
  66 a:hover {
  67         text-decoration: underline;
  68 }
  69 #container {
  70         margin: 0 auto;
  71         min-width: 975px;
  72         max-width: 100%;
  73         border-right: 1px solid black;
  74         background-color: #585758;
  75 }
  76
  77 #top {
  78         margin: 0 auto;
  79         min-width: 975px;
  80         max-width: 100%;
  81         height: 51px;
  82         background-image: url('bls_top.png');
  83         background-repeat: repeat-x;
  84         border-left: 1px solid black;
  85         border-right: 1px solid black;
  86         border-top-left-radius: 7px;
  87         border-top-right-radius: 7px;
  88         clear: both;
  89 }
  90
  91 #top img {
  92         padding: 11px 0 11px 35px;
  93         float: left;
  94 }
  95
  96 #menu-left {
  97         position: absolute;
  98         width: 74px;
  99         height: 600px;
 100         background-color: #546e83;
 101         border-left: 1px solid black;
 102         z-index: 200;
 103         /* Workaround for FF and switch Graphs and Workspace areas */
 104         bottom: auto !important;
 105 }
 106
 107 #content {
 108         position: relative;
 109         top: 0;
 110         left: 75px;
 111         width: 100%;
 112         height: 600px;
 113         z-index: 100;
 114 }
 115
 116 #directors, #panel_switcher, #tray_bar {
 117         float: right;
 118         font-size: 12px;
 119 }
 120
 121 #directors select {
 122         margin: 15px 20px 0 0;
 123         padding: 0;
 124         font-size: 12px
 125 }
 126
 127 #panel_switcher {
 128         margin: 17px 20px 0 0;
 129         font-weight: bold;
 130 }
 131
 132 #tray_bar {
 133         margin: 2px 30px 2px 0;
 134 }
 135
 136 #tray_bar img {
 137         float: none;
 138         margin: 0;
 139         padding: auto 12px;
 140 }
 141
 142 #tray_bar span{
 143         font-size: 14px;
 144 }
 145
 146 div.configuration {
 147         width: 45%;
 148         height: 575px;
 149         margin: 12px;
 150         float: right;
 151         background-color: #898889;
 152         -webkit-border-radius: 10px;
 153         -moz-border-radius: 10px;
 154         border-radius: 10px;
 155         display: none;
 156 }
 157
 158 #configuration {
 159         position: absolute;
 160         width: 100%;
 161 }
 162
 163 #configuration div.field select {
 164         width: 178px;
 165 }
 166
 167 #configuration div.field input[type=text] {
 168         width: 166px;
 169 }
 170
 171 div.configuration-progress {
 172         background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
 173         width: 45%;
 174         height: 575px;
 175         z-index: 10;
 176         position: absolute;
 177         top: 12px;
 178         right: 12px;
 179         display: none;
 180         border-radius: 10px;
 181 }
 182
 183 div.slide-window-progress {
 184         background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
 185         width: 100%;
 186         height: 100%;
 187         z-index: 10;
 188         position: absolute;
 189         top: 0;
 190         left: 0;
 191         display: none;
 192 }
 193
 194 #console {
 195         clear: left;
 196         min-width: 973px;
 197         max-width: 100%;
 198         min-height: 20px;
 199         margin: 0 auto;
 200         padding: 5px 0;
 201         text-align: right;
 202         background-color: #686a6c;
 203         border-left: 1px solid black;
 204         border-right: 1px solid black;
 205 }
 206
 207 #console a.left {
 208         float: left;
 209         padding: 0 5px;
 210         font-weight: bold;
 211 }
 212
 213 #console input[type="text"], #console select {
 214         width: 255px;
 215 }
 216
 217 #console select {
 218         width: 267px;
 219         padding-bottom: 4px;
 220 }
 221
 222 #console input[type="submit"] {
 223         margin: 6px 0;
 224 }
 225
 226 #console div.button {
 227         text-align: right;
 228         margin: 3px 9px 5px 0;
 229 }
 230
 231 #bottom {
 232         max-width: 100%;
 233         min-width: 975px;
 234         height: 11px;
 235         margin: 0 auto;
 236         background: transparent url('bls_bottom.png') repeat-x top left;
 237         border-left: 1px solid black;
 238         border-right: 1px solid black;
 239         border-bottom-left-radius: 7px;
 240         border-bottom-right-radius: 7px;
 241 }
 242
 243 #message-box {
 244         border: 2px solid #a6ac00;
 245         width: 90%;
 246         padding: 8px;
 247         min-height: 200px;
 248         margin: 80px auto;
 249         -webkit-border-radius: 8px;
 250         -moz-border-radius: 8px;
 251         border-radius: 8px;
 252         background-color: #faff74;
 253 }
 254
 255 #message-box h3, #message-box h2 {
 256         margin: 20px 10px;
 257 }
 258
 259 #message-box li {
 260         margin: 10px;
 261 }
 262
 263 #message-box a {
 264         font-size: 16px;
 265         color: red;
 266         font-weight: bold;
 267         text-decoration: underline;
 268 }
 269
 270 .storage-btn, .client-btn, .media-btn, .pool-btn, .setting-btn, .job-btn, .jobrun-btn, .restore-btn {
 271         width: 74px;
 272         height: 74px;
 273         display: block;
 274         cursor: pointer;
 275         border: 0;
 276 }
 277
 278 .storage-btn {
 279         background: transparent url('storage_icon_inactive.png') no-repeat top left;
 280 }
 281
 282 .storage-btn:hover {
 283         background: transparent url('storage_icon.png') no-repeat top left;
 284 }
 285
 286 .client-btn {
 287         background: transparent url('client_icon_inactive.png') no-repeat top left;
 288 }
 289
 290 .client-btn:hover {
 291         background: transparent url('client_icon.png') no-repeat top left;
 292 }
 293
 294 .media-btn {
 295         background: transparent url('media_icon_inactive.png') no-repeat top left;
 296 }
 297
 298 .media-btn:hover {
 299         background: transparent url('media_icon.png') no-repeat top left;
 300 }
 301
 302 .pool-btn {
 303         background: transparent url('pool_icon_inactive.png') no-repeat top left;
 304 }
 305
 306 .pool-btn:hover {
 307         background: transparent url('pool_icon.png') no-repeat top left;
 308 }
 309
 310 .job-btn {
 311         background: transparent url('job_icon_inactive.png') no-repeat top left;
 312 }
 313
 314 .job-btn:hover {
 315         background: transparent url('job_icon.png') no-repeat top left;
 316 }
 317
 318 .jobrun-btn {
 319         background: transparent url('jobrun_icon_inactive.png') no-repeat top left;
 320 }
 321
 322 .jobrun-btn:hover {
 323         background: transparent url('jobrun_icon.png') no-repeat top left;
 324 }
 325
 326 .restore-btn {
 327         background: transparent url('restore_icon_inactive.png') no-repeat top left;
 328 }
 329
 330 .restore-btn:hover {
 331         background: transparent url('restore_icon.png') no-repeat top left;
 332 }
 333
 334 .setting-btn {
 335         background: transparent url('setting_icon_inactive.png') no-repeat top left;
 336 }
 337
 338 .setting-btn:hover {
 339         background: transparent url('setting_icon.png') no-repeat top left;
 340 }
 341
 342 .line {
 343         height: 35px;
 344         clear: both;
 345 }
 346
 347 .text {
 348         width: 240px;
 349         display: table-cell;
 350         vertical-align: middle;
 351         font-size: 15px;
 352 }
 353
 354 .field {
 355         display: table-cell;
 356 }
 357
 358 .field-full {
 359         display: block;
 360         min-height: 200px;
 361         width: 98%;
 362 }
 363
 364 .validator, .validate {
 365         color: #e3454b !important;
 366         font-size: 10pt;
 367         /*margin-left: 5px;*/
 368 }
 369
 370 .validate {
 371         color: #96c600 !important;
 372 }
 373
 374 input.bbutton {
 375         font-size: 12px;
 376         color: black;
 377         height: 25px;
 378         cursor: pointer;
 379         padding: 0;
 380         margin: 0 8px;
 381         border: 0;
 382         padding: 0 9px;
 383         min-width: 65px;
 384         border: 0;
 385         border-radius: 3px;
 386         background: transparent url('button-center.png') repeat-x left 0;
 387 }
 388
 389 input.bbutton:hover {
 390         border: 1px solid red;
 391         padding: 0 8px;
 392         background: transparent url('button-center.png') repeat-x left -25px;
 393 }
 394
 395 div.slide-window-container {
 396         width: 400px;
 397         height: 200px;
 398         font-size: 11px;
 399         font-weight: bold;
 400         background-color: rgba(255,255,255,0.3);
 401         z-index: 10;
 402         position: absolute;
 403 }
 404
 405 div.slide-window-content {
 406         height: 100%;
 407         width: 100%;
 408         border-right: 1px solid black;
 409         overflow: auto;
 410         overflow-y: auto;
 411 }
 412
 413 div.slide-window-element, div.slide-window-element:hover {
 414         float: left;
 415         width: 224px;
 416         color: white;
 417 }
 418
 419 div.slide-window-element:hover {
 420         text-decoration: underline;
 421 }
 422
 423 div.slide-window-element:hover, div.slide-window-element-detail:hover {
 424         float: left;
 425         width: 224px;
 426         background-color: #686A6C;
 427         cursor: pointer;
 428 }
 429
 430 tr.slide-window-element {
 431         background-color: #7a7a7a;
 432 }
 433
 434 tr.slide-window-element-alternating {
 435         background-color: #686A6C;
 436 }
 437
 438 tr.slide-window-element td, tr.slide-window-element-alternating td {
 439         font-style: italic;
 440         word-break: break-all;
 441 }
 442 tr.slide-window-element:hover, tr.slide-window-element-alternating:hover {
 443         float: none;
 444         cursor: pointer;
 445 }
 446
 447 tr.slide-window-element:hover td, tr.slide-window-element-alternating:hover td{
 448         background-color: #aeb2b6;
 449 }
 450
 451 table.window-section-detail, table.file-browser-detail {
 452         background-color: rgba(0,0,0,0.5);
 453         width: 100%;
 454         font-size: 10px;
 455         font-weight: normal;
 456 }
 457
 458 table.window-section-detail th, table.file-browser-detail th {
 459         background-color: black;
 460         color: white;
 461 }
 462
 463 table.file-browser-detail {
 464         border-spacing: 0;
 465 }
 466
 467 tr.file-browser-element {
 468         background-color: white;
 469         color: black;
 470 }
 471
 472 tr.file-browser-element td {
 473         font-style: italic;
 474         padding: 3px 0;
 475         vertical-align: middle;
 476 }
 477
 478 tr.file-browser-element:hover {
 479         cursor: move;
 480 }
 481
 482 tr.file-browser-element:hover td{
 483         background-color: #aeb2b6;
 484 }
 485
 486 tr.file-browser-header {
 487         height: 25px;
 488         text-align: left;
 489         font-family: monospace;
 490         font-size: 9px
 491 }
 492
 493 tr.file-browser-header th {
 494         padding-left: 9px;
 495 }
 496
 497 .draggable {
 498         cursor: move;
 499 }
 500
 501 div.slide-window-bar {
 502         background: transparent url('panel-border-btns.png') no-repeat top right;
 503         text-align: center;
 504         font-size: 10px;
 505         height: 14px;
 506         width: 100%;
 507         padding-right: 1px;
 508         clear: both;
 509 }
 510
 511 div.slide-window-bar-title {
 512         background: transparent url('panel-border-bg.png') repeat-x top left;
 513         height: 14px;
 514         margin-right: 51px;
 515         padding: 0;
 516 }
 517
 518 div.slide-window-close, div.slide-window-fullsize, div.slide-window-sort {
 519         width: 12px;
 520         height: 14px;
 521         position: relative;
 522         top: -14px;
 523         float: right;
 524         cursor: pointer;
 525 }
 526
 527 div.slide-window-close {
 528         right: 9px;
 529 }
 530
 531 div.slide-window-fullsize {
 532         right: 10px;
 533 }
 534
 535 div.slide-window-sort {
 536         right: 14px;
 537 }
 538
 539 div.slide-window-toolbar, div.slide-window-actions {
 540         height: 90px;
 541         width: 240px;
 542         z-index: 25;
 543         position: absolute;
 544         margin: 0;
 545         padding: 0;
 546         bottom: 0;
 547         right: 0;
 548         border-top-left-radius: 5px;
 549         border-left: 1px solid black;
 550         border-top: 1px solid black;
 551         background-color: rgba(0,0,0,0.7);
 552 }
 553
 554 div.slide-window-toolbar table {
 555         width: 220px;
 556         border-spacing: 6px;
 557         font-size: 11px;
 558 }
 559
 560 div.slide-window-toolbar table td input[type="radio"] {
 561         vertical-align: text-bottom;
 562 }
 563
 564 div.slide-window-toolbar table select,div.slide-window-toolbar table input {
 565         font-size: 11px;
 566         padding: 0;
 567 }
 568
 569 div.slide-window-toolbar table input[type="text"] {
 570         width: 123px;
 571 }
 572 div.slide-window-actions {
 573         width: 220px;
 574         height: 110px;
 575 }
 576
 577 div.slide-window-actions table {
 578         width: 100%;
 579         font-size: 12px;
 580         padding: 10px;
 581 }
 582
 583 div.configuration-window-content {
 584         padding: 10px 12px;
 585         width: 96%;
 586 }
 587
 588 div.slide-window-options {
 589         height: 36px;
 590         width: 36px;
 591         z-index: 20;
 592         position: absolute;
 593         margin: 0;
 594         padding: 0;
 595         bottom: 0;
 596         right: 0;
 597         border: 0;
 598         background: transparent url('gear-icon-alpha.png') no-repeat left 0;
 599 }
 600
 601 div.slide-window-options:hover {
 602         cursor: pointer;
 603         background: transparent url('gear-icon.png') no-repeat left 0;
 604 }
 605 div.status-bar-append, div.status-bar-full, div.status-bar-used, div.status-bar-error, div.status-bar-purged, div.status-bar-recycle, div.status-bar-busy, div.status-bar-disabled, div.status-bar-archive, div.status-bar-cleaning, div.status-bar-read-only, div.status-bar-detail-append, div.status-bar-detail-full, div.status-bar-detail-used, div.status-bar-detail-error, div.status-bar-detail-purged, div.status-bar-detail-recycle, div.status-bar-detail-busy, div.status-bar-detail-disabled, div.status-bar-detail-archive, div.status-bar-detail-cleaning, div.status-bar-detail-read-only {
 606         position: relative;
 607         border: 1px solid black;
 608         min-width: 40px;
 609         height: 20px;
 610         line-height: 20px;
 611         float: right;
 612         font-size: 7px;
 613         font-weight: bold;
 614         margin: 4px 6px 4px 0;
 615         -webkit-border-radius: 4px;
 616         -moz-border-radius: 4px;
 617         border-radius: 4px;
 618         text-align: center;
 619 }
 620
 621 div.status-bar-append, div.status-bar-detail-append {
 622         background-color: green;
 623 }
 624
 625 div.status-bar-full, div.status-bar-used, div.status-bar-detail-full, div.status-bar-detail-used {
 626         background-color: orange;
 627 }
 628
 629 div.status-bar-purged, div.status-bar-recycle, div.status-bar-detail-purged, div.status-bar-detail-recycle {
 630         background-color: yellow;
 631         color: black;
 632 }
 633
 634 div.status-bar-error, div.status-bar-detail-error {
 635         background-color: red;
 636 }
 637
 638 div.status-bar-busy, div.status-bar-detail-busy {
 639         background-color: pink;
 640 }
 641
 642 div.status-bar-archive, div.status-bar-disabled, div.status-bar-detail-archive, div.status-bar-detail-disabled {
 643         background-color: gray;
 644         color: black;
 645 }
 646
 647 div.status-bar-cleaning, div.status-bar-detail-cleaning {
 648         background-color: blue;
 649 }
 650
 651 div.status-bar-read-only, div.status-bar-detail-read-only {
 652         background-color: white;
 653         color: black;
 654 }
 655
 656 div.status-bar-detail-append, div.status-bar-detail-full, div.status-bar-detail-used, div.status-bar-detail-error, div.status-bar-detail-purged, div.status-bar-detail-recycle, div.status-bar-detail-busy, div.status-bar-detail-disabled, div.status-bar-detail-archive, div.status-bar-detail-cleaning, div.status-bar-detail-read-only {
 657         float: none;
 658         margin: 0 auto;
 659 }
 660
 661 /* JOB STATES */
 662
 663 div.job-status-C, div.job-status-R, div.job-status-B, div.job-status-T, div.job-status-W, div.job-status-E, div.job-status-e, div.job-status-f, div.job-status-D, div.job-status-A, div.job-status-I, div.job-status-F, div.job-status-S, div.job-status-m, div.job-status-M, div.job-status-s, div.job-status-j, div.job-status-c, div.job-status-d, div.job-status-t, div.job-status-p, div.job-status-i, div.job-status-a, div.job-status-l, div.job-status-L {
 664         border: 1px solid black;
 665         min-width: 80px;
 666         height: 20px;
 667         line-height: 20px;
 668         font-size: 9px;
 669         font-weight: bold;
 670         margin: 4px auto;
 671         -webkit-border-radius: 4px;
 672         -moz-border-radius: 4px;
 673         border-radius: 4px;
 674         text-align: center;
 675         background-color: black;
 676         color: white;
 677 }
 678
 679 div.job-status-C {
 680         background-color: #7A5DC7;
 681 }
 682
 683 div.job-status-A {
 684         background-color: yellow;
 685         color: black;
 686 }
 687
 688 div.job-status-R {
 689         background-color: #E9AB17;
 690         color: black;
 691 }
 692
 693 div.job-status-B, div.job-status-E, div.job-status-e, div.job-status-f, div.job-status-I {
 694         background-color: red;
 695 }
 696
 697 div.job-status-T {
 698         background-color: #347235;
 699 }
 700
 701 div.job-status-W {
 702         background-color: #C68E17;
 703 }
 704
 705 div.job-status-D {
 706         background-color: #CB4A2C;
 707 }
 708
 709 /*
 710 div.job-status-F, div.job-status-S, div.job-status-m, div.job-status-M, div.job-status-s, div.job-status-j, div.job-status-c, div.job-status-d, div.job-status-t, div.job-status-p {
 711         background-color: #657383;
 712 }
 713
 714 div.job-status-i, div.job-status-a, div.job-status-l, div.job-status-L {
 715         background-color: #151B54;
 716 }*/
 717
 718
 719 /* END JOB STATES */
 720
 721 div.window-section {
 722         border-bottom: 1px solid white;
 723         border-top: 1px solid white;
 724         background-color: rgba(0,0,0,0.5);
 725         width: 100%;
 726         height: 25px;
 727         clear: both;
 728         padding-top: 6px;
 729         font-size: 13px;
 730 }
 731
 732 div.window-section span {
 733         padding-left: 12px;
 734 }
 735
 736 div.button {
 737         text-align: right;
 738         margin: 3px 2px 5px 0;
 739 }
 740
 741 div.button-center {
 742         text-align: center;
 743         margin: 5px 0;
 744 }
 745
 746 input.validation-error {
 747         border-color: red !important;
 748 }
 749
 750 span.validation-error-summary {
 751         font-size: 12px;
 752         line-height: 12px;
 753         color: rgb(255, 187, 187) !important;
 754 }
 755
 756 textarea.console {
 757         width: 98%;
 758         height: 200px;
 759         display: block;
 760         margin: 5px auto;
 761         font-size: 10px;
 762 }
 763
 764 .bold {
 765         font-weight: bold;
 766 }
 767
 768 .italic {
 769         font-style: italic;
 770 }
 771
 772 .center {
 773         text-align: center;
 774 }
 775
 776 .right {
 777         text-align: right;
 778 }
 779
 780 #console_launcher, #volumes_tools_launcher, #logging, #clear_bvfs_cache {
 781         padding: 0 5px;
 782 }
 783
 784 #console_launcher span, #volumes_tools_launcher span, #logging label, #clear_bvfs_cache label {
 785         padding: 0 5px;
 786         font-family: monospace;
 787         font-size: 11px;
 788 }
 789
 790 #logging input[type="checkbox"], #logging label, #clear_bvfs_cache label{
 791         cursor: pointer;
 792 }
 793
 794 #logging input[type="checkbox"], #clear_bvfs_cache input[type="image"] {
 795         vertical-align: middle;
 796         border: 0;
 797 }
 798
 799 fieldset {
 800         margin-bottom: 15px;
 801         font-size: 14px;
 802 }
 803
 804 fieldset .line {
 805         height: 25px;
 806 }
 807
 808 fieldset .text {
 809         width: 250px;
 810 }
 811
 812 legend {
 813         font-size: 12px;
 814         font-weight: bold;
 815         color: white;
 816 }
 817
 818 img {
 819         vertical-align: middle;
 820         border: none;
 821 }
 822
 823 div.small {
 824         font-size: 12px;
 825         text-align: center;
 826         width: 130px;
 827         background-color: rgb(115, 143, 172);
 828         border-top-left-radius: 5px;
 829         border-top-right-radius: 5px;
 830         border-left: 1px solid black;
 831         border-right: 1px solid black;
 832         border-top: 1px solid black;
 833         margin: 3px 0;
 834 }
 835
 836 #graphs {
 837         height: 600px;
 838         min-width: 954px;
 839         max-width: 100%;
 840         padding: 10px;
 841         margin: 0 auto;
 842         font-size: 11px;
 843         background-color: #585758;
 844         border-right: 1px solid black;
 845 }
 846
 847 #graphs span {
 848         margin: 0 3px;
 849 }
 850
 851 #legend {
 852         border: 1px solid white;
 853         margin: 7px;
 854         padding: 8px;
 855 }
 856
 857 #legend table td {
 858         color: white;
 859 }
 860
 861 #graphs_content {
 862         margin: 0 auto;
 863         width: 98%;
 864         height: 425px;
 865 }
 866
 867 /* Overwrite date picker classes */
 868 .TDatePicker_default {
 869         z-index: 20;
 870 }
 871 .TDatePicker_default .date {
 872         color: blue;
 873 }
 874 .TDatePicker_default .selected {
 875         color: white;
 876 }
 877
 878 th.weekDayHead {
 879         color: black;
 880         border: 1px solid #919EA9;
 881 }
 882
 883 /* END - Overwrite date picker classes */