portal/static/css/myslice.css

   1 @import url("../fonts/opensans_bold_macroman/stylesheet.css");
   2
   3 .myslice-message {
   4     position:relative;
   5     left:-491px;
   6     width:980px;
   7     margin:0 auto;
   8     box-shadow: 10px 10px 5px #888888;
   9     margin-bottom: 15px;
  10 }
  11
  12 html { height: 100% }
  13
  14 body {
  15     background-color:white;
  16     color:black;
  17     margin:0;
  18     padding:0;
  19     height: 100%;
  20     letter-spacing:0.3px;
  21 }
  22
  23 p.command {
  24     padding:15px;
  25     margin:15px 0;
  26     color:#890000;
  27     background-color:#E0E0E0;
  28     font-family:Courier, monospace;
  29 }
  30 h1 {
  31     border-bottom:1px solid #DDDDDD;
  32     padding:0 0 0 0;
  33     margin:15px 0 15px 0;
  34     font-size:14pt;
  35 }
  36 h1 img {
  37     vertical-align:middle;
  38     margin-bottom:4px;
  39     margin-right:10px;
  40 }
  41 h2 {
  42     margin:0 0 15px 0;
  43     font-size:14pt;
  44     color:#333333;
  45 }
  46 h3 {
  47     margin:0 0 5px 0;
  48     font-size:13pt;
  49     color:#201E62;
  50 }
  51 h4 {
  52     margin:0 0 5px 0;
  53     font-size:12pt;
  54     color:#333333;
  55 }
  56 label {
  57     font-weight:normal;
  58     font-size:13px;
  59     color:#201E62;
  60 }
  61 .sublabel {
  62     color:gray;
  63     font-style:italic;
  64     font-weight:normal;
  65 }
  66 span.subtitle {
  67     color:#454545;
  68     font-size:9pt;
  69     font-weight:normal;
  70     text-transform:uppercase;
  71 }
  72 span.small {
  73     font-size:9pt;
  74 }
  75 span.gray {
  76     color:gray;
  77 }
  78 span.type {
  79     color:#201E62;
  80     font-weight:bold;
  81     font-size:9pt;
  82 }
  83 span.htitle {
  84     color:#454545;
  85     font-size:9pt;
  86     font-weight:normal;
  87 }
  88 span.version {
  89     font-size:8pt;
  90     color:#888888;
  91 }
  92 input[type=checkbox] {
  93   min-width:5px !important;
  94   margin-left:0 !important;
  95 }
  96 input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], select, option {
  97     min-width:260px;
  98     padding:6px;
  99     border:1pt solid #22606D;
 100     vertical-align:bottom;
 101     border-radius:0;
 102 }
 103
 104 textarea {
 105     padding:6px;
 106     border:1pt solid #22606D !important;
 107     border-radius:0 !important;
 108 }
 109
 110 span.label {
 111     font-size:11pt;
 112     color:gray;
 113     font-weight:normal;
 114     padding:0;
 115 }
 116 div.el {
 117     padding-bottom:15px;
 118 }
 119 div.breadcrumbs {
 120     margin:15px 0;
 121     color:gray;
 122     font-size:10pt;
 123 }
 124 div.breadcrumbs a {
 125     color:gray;
 126 }
 127 div.breadcrumbs a:hover {
 128     text-decoration:underline;
 129 }
 130 .tab-pane {
 131     padding-top:15px;
 132 }
 133 /* buttons */
 134 button.btn, input.btn {
 135     padding:6px 10px;
 136     border-radius:5px;
 137     font-size:10pt;
 138     font-weight:normal;
 139 }
 140 button.btn span.glyphicon {
 141     margin-right:6px;
 142 }
 143 button.btn-default {
 144     border-bottom:3px solid #cccccc;
 145 }
 146 button.btn-default:hover {
 147     background-color:white;
 148     border:1px solid #ADADAD;
 149     border-bottom:3px solid #ADADAD;
 150 }
 151 button.btn-default:active {
 152     background-color:white;
 153     border:1px solid #ADADAD;
 154     border-bottom:1px solid #ADADAD;
 155     margin-top:2px;
 156     box-shadow:none;
 157 }
 158 button.btn-primary {
 159     border-bottom:3px solid #3071A9;
 160 }
 161 button.btn-primary:hover {
 162     box-shadow:none;
 163     background-color:#428bca;
 164     border:1px solid #357ebd;
 165     border-bottom:3px solid #3071A9;
 166 }
 167 button.btn-primary:active {
 168     box-shadow:none;
 169     border-bottom:1px solid #3071A9;
 170     margin-top:2px;
 171 }
 172 button.btn-danger {
 173     border-bottom:3px solid #A13F3A;
 174 }
 175 button.btn-danger:hover {
 176     box-shadow:none;
 177     background-color:#d9534f;
 178     border:1px solid #d43f3a;
 179     border-bottom:3px solid #A13F3A;
 180 }
 181 button.btn-danger:active {
 182     border:1px solid #d43f3a;
 183     box-shadow:none;
 184     margin-top:2px;
 185 }
 186 button.btn-onelab, input.btn-onelab {
 187     border:0;
 188     border-bottom:3px solid #4cae4c;
 189     background-color:#5cb85c;
 190     color:white;
 191     width: 150px;
 192     height: 30px;
 193 }
 194 button.btn-onelab:hover, input.btn-onelab:hover {
 195     border:0;
 196     border-bottom:3px solid #47a447;
 197     background-color:#398439;
 198     color:white;
 199 }
 200 button.btn-onelab:active, input.btn-onelab:active {
 201     box-shadow:none;
 202     border-bottom:1px solid #760073;
 203     margin-top:2px;
 204 }
 205
 206 .container-resource button {
 207     padding:2px 4px;
 208     border-radius:3px;
 209     font-size:9pt;
 210     font-weight:normal;
 211 }
 212 .container-resource select,.container-resource option, .container-resource input {
 213     padding:2px 4px;
 214     font-size:9pt;
 215 }
 216 .badge {
 217     font-size:9pt;
 218     margin-left:4px;
 219 }
 220 /***** Notifications *****/
 221 .warning {
 222     border: 1px solid red;
 223     margin: 20px 60px;
 224     padding: 10px 20px;
 225     color: red;
 226     background-color: #f2dbdb;
 227     text-align: center;
 228 }
 229 div#menu-slice-list{
 230     display:none;
 231     position:absolute;
 232     background-color:orange;
 233     padding:15px;
 234     left:-15px;
 235     z-index:10;
 236 }
 237 div.dashboard div.projects-tree {
 238     margin-left:49px;
 239 }
 240 /* HOME DASHBOARD */
 241 div#home-dashboard {
 242     color:black;
 243     margin:0 auto 25px auto;
 244 }
 245 div#home-dashboard table {
 246     margin:25px;
 247     width:100%;
 248 }
 249 div#home-dashboard table td {
 250     text-align:center;
 251     padding:15px 0;
 252     width:33%;
 253 }
 254 div#home-dashboard table tr:first-child td {
 255     font-size:12pt;
 256     font-weight:bold;
 257     color:#270A5A;
 258 }
 259 div#home-dashboard table tr:last-child td {
 260     vertical-align:top;
 261     padding:25px 0;
 262 }
 263 div#home-dashboard table tr:last-child td.logged-in {
 264     border-right:1px solid #DDDDDD;
 265     padding:25px;
 266 }
 267 div#home-dashboard table tr:last-child td.support {
 268     border-left:1px solid #DDDDDD;
 269     padding:25px;
 270 }
 271 div#home-dashboard table tr:last-child td:first-child {
 272 }
 273 div#home-dashboard table tr:last-child td:last-child {
 274     border-right:0;
 275 }
 276 div#home-dashboard table tr:last-child td.logged-in div {
 277     text-align:left;
 278     padding:25px 0;
 279 }
 280 div#home-dashboard table tr:last-child td.support div {
 281     text-align:left;
 282     padding:25px 0;
 283 }
 284 div#home-dashboard div.login-widget {
 285     padding:20px;
 286 }
 287 div#home-dashboard table td.support {
 288 }
 289 div#home-dashboard table td.support a {
 290 }
 291 div#home-dashboard table td.support a:hover {
 292     text-decoration:none;
 293 }
 294
 295 div#home-dashboard div#manager {
 296     display:none;
 297 }
 298
 299 div#home-dashboard div#home-slice-list {
 300     margin:25px 0;
 301     padding:0 25px;
 302     text-align:left;
 303 }
 304 div#home-dashboard div#home-slice-list ul {
 305     list-style: none;
 306     padding:0;
 307     margin:0;
 308 }
 309 div#home-dashboard div#home-slice-list li {
 310
 311 }
 312
 313 /**/
 314
 315 /**/
 316 /* WELL */
 317 div.well {
 318 }
 319 /**/
 320 /* TABLE */
 321 table.table {
 322     margin:0;
 323 }
 324 table.table thead {
 325     padding:0;
 326 }
 327 table.table tbody {
 328     padding:0;
 329 }
 330 table.table tr {
 331     padding:0;
 332 }
 333 table.table td {
 334     padding:0;
 335 }
 336 /* INSTITUTION */
 337 div#institution {
 338     color:black;
 339 }
 340 .form-hint {
 341     font-size:11pt;
 342     font-style:italic;
 343     color:gray;
 344 }
 345
 346
 347 .form-hint {
 348     font-size:11pt;
 349     font-style:italic;
 350     color:gray;
 351 }
 352
 353
 354
 355 /* TICKET REQUEST */
 356 div#ticket-request {
 357     color:black;
 358 }
 359 .form-hint {
 360     font-size:11pt;
 361     font-style:italic;
 362     color:gray;
 363 }
 364 div#ticket-request p {
 365     margin:20px 0;
 366 }
 367
 368 ul.nav-tabs {
 369     margin:0 0 15px 0;
 370 }
 371 ul.nav-tabs ul {}
 372 ul.nav-tabs li {}
 373
 374 ul.nav-section li a {
 375     color:black;
 376     border-bottom:0;
 377 }
 378 ul.nav-section li:first-child {
 379     padding:0;
 380 }
 381 ul.nav-section li:first-child a {
 382 }
 383 ul.nav-section li:first-child.active a {
 384 }
 385
 386 ul.nav-resources {
 387     margin:15px 0;
 388 }
 389 ul.nav-resources a {
 390     padding: 4px 10px 5px 10px;
 391 }
 392
 393 /* SLICE VIEW */
 394 div.container-resource, div.container-slice {
 395     padding-right:15px;
 396     padding-left:15px;
 397 }
 398 .table th {
 399     border-top:0 !important;
 400 }
 401 div#slice-view {
 402     margin:0;
 403 }
 404
 405 div.sl-filter-facilities {
 406     padding:0 5px;
 407 }
 408 div.sl-filter-facilities h4 {
 409     margin-bottom:15px;
 410
 411 }
 412 img.sl-image {
 413     margin:0 5px 5px 0;
 414     padding:0;
 415     vertical-align:middle;
 416 }
 417 a.sl-facility {
 418     color:gray;
 419     text-decoration:none;
 420 }
 421 a.sl-facility:hover {
 422     color:#342961;
 423 }
 424 a.sl-facility.active {
 425     color:black;
 426     text-decoration:none;
 427 }
 428 a.sl-facility::before {
 429     content: " ";
 430 }
 431 div.sl-facilities {
 432     border-bottom:#CCCCCC 1px solid;
 433     padding-bottom:15px;
 434     margin-bottom:15px;
 435 }
 436 div.sl-facilities:last-child {
 437     border:0;
 438 }
 439 a.sl-testbed {
 440     color:gray;
 441     text-decoration:none;
 442     margin-left:25px;
 443     margin-bottom:5px;
 444 }
 445 a.sl-testbed:hover {
 446     color:#342961;
 447 }
 448 a.sl-testbed.active {
 449     color:black;
 450 }
 451 div.sl-filter-resources {
 452     margin:0 0 10px 0;
 453     text-align:center;
 454 }
 455 span.sl-resources {
 456     font-size:9pt;
 457     color:gray;
 458 }
 459 a.sl-resources {
 460     font-size:9pt;
 461     border:0;
 462     padding:2px 8px;
 463     margin:0 5px;
 464     -moz-border-radius: 2px;
 465     border-radius: 2px;
 466     text-align: center;
 467 }
 468 a.sl-resources.active, a.sl-resources.active:hover, a.sl-resources.active:focus {
 469     border:0;
 470     padding:2px 8px;
 471     -moz-border-radius: 2px;
 472     border-radius: 2px;
 473     background-color:#E7A6E7;
 474     color:#000000;
 475 }
 476 a.sl-resources:first-child {
 477 }
 478 button.btn-apply {
 479     font-size:13px;
 480     padding:2px 8px;
 481     margin:0 5px;
 482     -moz-border-radius: 2px;
 483     border-radius: 2px;
 484     text-align: center;
 485 }
 486 div#slice-info {
 487     margin-top:25px;
 488 }
 489 div#slice-info table {
 490     width:100%;
 491     margin:0 auto;
 492 }
 493 div#slice-info table td:first-child {
 494     text-align:right;
 495     font-weight:bold;
 496     padding-right:15px;
 497 }
 498 div#slice-info td {
 499     padding:5px;
 500 }
 501
 502 /* SLICE VIEW sections */
 503 .slice-sections, .slice-pending {
 504     margin:0;
 505     padding:0;
 506 }
 507 .slice-sections ul, .slice-pending ul {
 508     margin:0;
 509     padding:0;
 510 }
 511 .slice-pending ul {
 512     width:400px;
 513     margin:0 auto 15px auto;
 514 }
 515 .slice-sections li {
 516     text-align:left;
 517     margin:0;
 518     padding:0;
 519 }
 520 .slice-pending li {
 521     padding-right:15px;
 522 }
 523 .slice-sections li a, .slice-pending li a {
 524     font-size:14px;
 525     color:black;
 526     padding:0;
 527 }
 528 .slice-sections li.active a, .slice-pending li.active a  {
 529     color:#201E62;
 530     background-color:#EFEFEF;
 531     text-decoration:underline;
 532     padding:0;
 533 }
 534 .slice-sections ul.nav-pills li a:hover, .slice-pending ul.nav-pills li a:hover {
 535     text-decoration:underline;
 536     background-color:#EFEFEF;
 537     color:black;
 538 }
 539 .slice-sections ul.nav-pills li.active, .slice-pending ul.nav-pills li.active {
 540
 541 }
 542 .slice-sections li:first-child, .slice-sections li:first-child a {
 543     color:#201E62;
 544     font-weight:bold;
 545 }
 546 .slice-experiment {
 547     text-align:right;
 548     padding:0;
 549 }
 550 .slice-experiment button {
 551     margin:3px 0 0 0;
 552     background-color:#CC4125;
 553     color:white;
 554 }
 555
 556 .slice-pending {
 557 }
 558 .slice-pending button {
 559     font-size:9pt;
 560     margin:-2px 0 0 0;
 561     padding:3px 5px;
 562 }
 563 .slice-pending button.apply {
 564     font-size:14px;
 565     padding:2px 5px;
 566 }
 567 .slice-pending button.clear {
 568 }
 569 tr.active, tr.active td {
 570     background-color:#FFFFCC !important;
 571 }
 572 div.dataTables_filter label{
 573     float:left;
 574     width:400px;
 575 }
 576
 577 /* HEADER */
 578
 579
 580 .header {
 581   -moz-box-shadow:    0 0 1px rgba(82,82,82,0.6);
 582   -webkit-box-shadow: 0 0 1px rgba(82,82,82,0.6);
 583   box-shadow:         0 0 1px rgba(82,82,82,0.6);
 584   height:61px;
 585   background-color:white;
 586 }
 587
 588 div.navigation {
 589
 590 }
 591 div.navigation ul {
 592     margin:26px 0 0 0;
 593     padding:0;
 594     display: inline-block;
 595     list-style-type: none;
 596     white-space: nowrap;
 597 }
 598
 599 div.navigation li {
 600     color:#0C0047;
 601     font-family:open_sansbold, sans-serif;
 602     font-size:9pt;
 603     font-weight:normal;
 604     line-height:0.8em;
 605     letter-spacing:0.4pt;
 606     list-style:none;
 607     float:left;
 608     padding:0 15px;
 609     margin:0;
 610     text-transform:uppercase;
 611 }
 612 div.navigation li:hover {
 613 }
 614 div.navigation li a {
 615     color:#0C0047;
 616 }
 617 div.navigation li a:hover, div.navigation li a.current {
 618     color:#760073;
 619     text-decoration:none;
 620 }
 621
 622 div.navigation li:last-child {
 623     margin-right:0;
 624 }
 625
 626
 627 div.navigation .dropdown-menu {
 628     color:black;
 629     -moz-box-shadow:    1px 1px 0px 0 rgba(58, 48, 100,0.8);
 630     -webkit-box-shadow: 1px 1px 0px 0 rgba(58, 48, 100,0.8);
 631     box-shadow:         1px 1px 0px 0 rgba(58, 48, 100,0.8);
 632     border-radius:2px;
 633     padding:0 5px 5px 5px;
 634     margin-top:5px;
 635     margin-left:20px;
 636 }
 637 div.navigation .dropdown-menu ul {
 638     margin:0;
 639     padding:15px 5px 5px 5px;
 640     display:list-item;
 641 }
 642 div.navigation .dropdown-menu li {
 643     margin:0 10px 0 0;
 644     padding:0 0 8px 0;
 645     display:list-item;
 646     float:none;
 647     text-transform: none;
 648 }
 649
 650 div.navigation .dropdown-menu a {
 651     font-family:Helvetica,sans-serif;
 652     font-size:10pt;
 653     color:black;
 654 }
 655 div.navigation .dropdown-menu li.title {
 656     margin-bottom:10px;
 657 }
 658 div.navigation .dropdown-menu li.title a {
 659     font-family:open_sansbold, sans-serif;
 660 }
 661
 662
 663 div.navigation .dropdown-menu li:first-child {
 664     border-bottom:1px solid white;
 665     padding-bottom:5px;
 666
 667 }
 668
 669 div.secondary {
 670     text-align:right;
 671 }
 672
 673 div.secondary ul {
 674    margin:6px 0 0 0;
 675    padding:0;
 676 }
 677
 678 div.secondary li {
 679     font-size:9pt;
 680     display:inline;
 681     list-style:none;
 682     margin:0px;
 683     padding:0;
 684     margin-right:15px;
 685     color:#747474;
 686     letter-spacing:0.4px;
 687 }
 688 div.secondary li:last-child {
 689     margin-right:0;
 690 }
 691 div.secondary li a {
 692     color:#747474;
 693 }
 694 div.secondary li a:hover {
 695     text-decoration:underline;
 696 }
 697 div.secondary .button {
 698     width:300px;
 699     margin-top:15px;
 700 }
 701 div.secondary .account {
 702     margin-top:10px;
 703     padding:0;
 704     font-size:9pt;
 705     color:gray;
 706     text-align:right;
 707 }
 708 div.secondary .account span {
 709     font-size:8pt;
 710 }
 711 div.secondary .account a {
 712     color:black;
 713 }
 714
 715
 716 div.footer {
 717     padding-top:15px;
 718 }
 719 div.footer div.bottom {
 720     position:absolute;
 721     bottom:0;
 722 }
 723 div.footer ul {
 724    margin:6px 0 0 0;
 725    padding:0;
 726 }
 727
 728 div.footer li {
 729     font-size:9pt;
 730     display:inline;
 731     list-style:none;
 732     margin:0px;
 733     padding:0;
 734     margin-right:15px;
 735     color:#747474;
 736     letter-spacing:0.4px;
 737 }
 738
 739 div.footer li a {
 740     color:#747474;
 741 }
 742 div.footer li a:hover {
 743     text-decoration:underline;
 744 }
 745 div.copy {
 746     font-size:8pt;
 747     color:gray;
 748     padding-top:15px;
 749     padding-bottom:15px;
 750 }
 751
 752 div.home {
 753     font-size:11pt;
 754     line-height:1.2em;
 755     letter-spacing:0.3pt;
 756     min-height:500px;
 757     padding:100px 0;
 758 }
 759 div.home h2 {
 760     color:white;
 761     line-height:1.2em;
 762     font-size:18pt;
 763 }
 764 div.home h3 {
 765     color:white;
 766     line-height:1.4em;
 767 }
 768 /*
 769 div.dashboard {
 770     text-align:center;
 771 }
 772 div.dashboard div {
 773     margin:25px 0;
 774 }
 775 div.dashboard ul {
 776     text-align:left;
 777     margin-left:24px;
 778     list-style:none;
 779 }
 780 div.home {
 781     padding-top:50px;
 782 }
 783 div.home h1 {
 784     font-size:22pt;
 785     border:0;
 786 }
 787 div.home h3, div.home h4 {
 788     color:#424242;
 789     line-height:1.4em;
 790 }
 791
 792 div.home h3 a {
 793     color:#FD6D2C;
 794 }*/
 795 div.dashboard {
 796 }
 797 div.dashboard a {
 798     color:#206090;
 799 }
 800
 801 div.dashboard a:hover {
 802     text-decoration:underline;
 803 }
 804 div.dashboard div.projects-tree {
 805     margin-left:49px;
 806 }
 807 div.dashboard ul {
 808     list-style-type:disc;
 809     list-style-position:inside;
 810     text-align:left;
 811     margin:0 0 15px 0;
 812     padding:0;
 813
 814 }
 815 div.dashboard ul ul {
 816     margin:5px 0 15px 25px;
 817     list-style:none;
 818 }
 819 div.dashboard li {
 820     margin:0 0 5px 0;
 821     padding:0;
 822 }
 823 div.dashboard ul ul li {
 824     margin:0;
 825 }
 826 div.dashboard ul ul a {
 827 }
 828 div.dashboard h3 {
 829     border-bottom:1px solid #E0E0E0;
 830     margin-right:15px;
 831     margin-bottom:25px;
 832 }
 833 div.dashboard h3 a {
 834      color:#201E62;
 835 }
 836 div.dashboard h3 img {
 837     margin:15px 15px 15px 0;
 838 }
 839 div.dashboard span.glyphicon {
 840     text-align:center;
 841     width:45px;
 842     height:25px;
 843 }
 844 div.dashboard-create-slice {
 845     display:none;
 846 }
 847
 848 div.registration-form {
 849     padding-top:150px;
 850     text-align:center;
 851 }
 852 div.registration-form {
 853     padding-top:150px;
 854     text-align:center;
 855 }
 856
 857 .login-form input {
 858     width:320px;
 859 }
 860 .login-form input[type=submit] {
 861     width:108px;
 862 }
 863
 864 .login-submit {
 865     vertical-align:middle;
 866     padding:0;
 867 }
 868
 869 th {
 870     border:0 !important;
 871 }
 872
 873 div.monitor {
 874     padding:40px 0 25px 0;
 875 }
 876 div.monitor h1 {
 877     margin-bottom:25px;
 878 }
 879 div.s-monitor {
 880     padding-bottom:25px;
 881 }
 882 span#stats-period-txt {
 883     text-transform:lowercase;
 884 }
 885
 886 // resource info modal
 887 a.resource-info:hover {
 888     cursor:pointer;
 889 }
 890 table.modal-resource-info tr td:first-child {
 891     font-weight:bold;
 892     text-align:right;
 893 }
 894 table.modal-resource-info tr:first-child td {
 895     border-top:0;
 896     text-align:center;
 897 }
 898 table.modal-resource-info tr:last-child td {
 899     border-bottom:0;
 900     text-align:center;
 901 }