auth/auth-gui/theme/onap/aaf5.css

   1 /*
   2   Standard CSS for AAF
   3 */
   4
   5 html {
   6         height: 100%;
   7 }
   8
   9 body {
  10         background-image:url('ONAP_LOGO.png');
  11         background-color: #FFFFFF;
  12         background-repeat:no-repeat;
  13         background-position: right top;
  14         background-size:15em 4.3em;
  15         color:#606060;
  16         font-family: Verdana,Arial,Helvetica,sans-serif;
  17         overflow: scroll;
  18         }
  19
  20 header h1,p {
  21         margin: 4px auto;
  22 }
  23
  24 header h1 {
  25         display: inline;
  26 }
  27
  28 header {
  29         display: block;
  30         color: #347FA0;
  31 }
  32
  33 p#version {
  34         margin:0;
  35         display:inline;
  36         font-size: 0.75em;
  37         float:center;
  38         color: 2B6E9C;
  39         padding-right:4.2em;
  40 }
  41
  42 header hr {
  43         margin: 0;
  44 }
  45
  46 hr {
  47         border: 1px solid #C0C0C0;
  48 }
  49
  50 #breadcrumbs {
  51         padding: 5px 0 12px 0;
  52 }
  53
  54
  55 #breadcrumbs ul {
  56         color: #DFEFFC;
  57         margin: 0;
  58         list-style-type:none;
  59         padding: 0;
  60 }
  61
  62 #breadcrumbs li {
  63         border-width:2px;
  64         margin: 3px 1px;
  65         padding: 2px 9px;
  66         border-style:solid;
  67         border-top-left-radius: .8em;
  68         border-bottom-left-radius: .8em;
  69         background-color:#80C337;
  70         display:inline;
  71 }
  72
  73 #breadcrumbs a {
  74         text-decoration:none;
  75         color: white;
  76 }
  77
  78 caption {
  79         color:4BADA9;
  80         text-align: center;
  81         font-size:1.3em;
  82         font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
  83 }
  84
  85 #Pages {
  86         padding: 3px 2px 10px 4px;
  87         background: linear-gradient(to right, #147AB3,#FFFFFF);
  88 }
  89
  90 #Pages h3,h4,h5 {
  91         color: #909090;
  92 }
  93
  94 # SuperScript
  95 sup {
  96         color: #909090;
  97         font-size: 70%;
  98         vertical-align: super;
  99 }
 100
 101 form {
 102         padding: 10px;
 103         margin: 4px;
 104 }
 105
 106 .textInput {
 107 #       size: 120%;
 108 }
 109
 110 #form input[id],select#myroles {
 111 #       margin: 4px 0;
 112 #       width: 150%;
 113 #}
 114
 115 form label {
 116         margin: 4px 0;
 117 }
 118
 119 form label[required] {
 120         color: red;
 121 }
 122
 123 form input[type=submit], form input[type=reset] {
 124         font-size: 1.0em;
 125         margin: 12px 0 0px 0;
 126 #       color: #347FA0;
 127         color: white;
 128         background-color: #7FB5C9;
 129         border-radius: 15px;
 130 }
 131
 132 p.preamble, p.notfound,.expedite_request {
 133         display: block;
 134         margin: 30px 0px 10px 0px;
 135         font: italic bold 20px/30px Georgia, serif;
 136         font-size: 110%;
 137         color: #0079B8;
 138 }
 139 .expedite_request {
 140         margin-top: 0;
 141         color: 4BADA9;
 142 }
 143
 144 .subtext {
 145         margin-left: 10px;
 146         font-size: 75%;
 147         font-style: italic;
 148 }
 149
 150 .protected {
 151         font-size: 80%;
 152         font-style: italic;
 153         color: red;
 154 }
 155
 156 #Pages a {
 157         display:block;
 158         font-weight:bold;
 159         color:#FFFFFF;
 160         background-color:#80C337;
 161         text-decoration:none;
 162         border-top-right-radius: .8em;
 163         border-bottom-right-radius: .8em;
 164         border-top-left-radius: .2em;
 165         border-bottom-left-radius: .2em;
 166         padding: 3px 40px 3px 10px;
 167         margin: 4px;
 168         width: 50%;
 169 }
 170
 171 #footer {
 172         background-color: #2B6E9C;
 173         color: #FFFFFF;
 174         text-align:right;
 175         font-size: 60%;
 176         padding: 5px;
 177         position:fixed;
 178         bottom: 0px;
 179         left: 0px;
 180         right: 0px;
 181 }
 182
 183 /*
 184   Standard Table, with Alternating Colors
 185 */
 186 div.std {
 187         vertical-align: top;
 188 }
 189
 190 div.std table, div.stdform table {
 191         position: relative;
 192         border-collapse:collapse;
 193         table-layout:auto;
 194         left: 1.3%;
 195         width: 98%;
 196         margin-top: 5px;
 197         bottom: 4px;
 198         border-radius: 4px;
 199 }
 200
 201 td.detailFirst {
 202         border-color:red;
 203         border-style:solid none none none;
 204 }
 205
 206 td.detail {
 207   border-style:none;
 208  }
 209
 210
 211 div.std td, div.stdform td {
 212         font-size:.9em;
 213         vertical-align:top;
 214 }
 215
 216 .center {
 217         text-align: center;
 218 }
 219
 220 .right {
 221         text-align: right;
 222         padding-right: 4px;
 223 }
 224
 225 .left {
 226         text-align: left;
 227         padding-left: 4px;
 228 }
 229
 230
 231 p.double {
 232         line-height: 2em;
 233 }
 234
 235 p.api_comment {
 236         font-size: .9em;
 237         text-indent: 6px;
 238 }
 239
 240 p.api_contentType {
 241         font-size: .8em;
 242         text-indent: 6px;
 243 }
 244
 245 p.api_label {
 246         font-size: .9em;
 247         font-style: italic;
 248 }
 249
 250 .button, .greenbutton {
 251     text-decoration: none; font: menu;
 252     display: inline-block; padding: 2px 8px;
 253     background: ButtonFace; color: ButtonText;
 254     border-style: solid; border-width: 2px;
 255     border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
 256         border-radius: 10px;
 257         color: black;
 258 }
 259
 260 .greenbutton {
 261         color: white;
 262         background-color: #80C337;
 263 }
 264
 265 div.std h1, div.std h2, div.std h3, div.std h4, div.std h5 {
 266         text-indent: 7px;
 267 }
 268
 269 div.std td {
 270         border:1px solid #A6C9E2;
 271 }
 272
 273 div.std th, div.stdform th {
 274         background-color:#6FA7D1;
 275         color:#FFFFFF;
 276         }
 277
 278 div.std tr.alt, div.stdform tr.alt {
 279         background-color:#DFEFFC;
 280 }
 281
 282 div.std th {
 283         text-align: left;
 284         text-indent: .1em;
 285 }
 286
 287 #div.std a, div.stdform a {
 288 #       /*color: #606060;*/
 289 #       /*color: #147AB3;*/
 290 #       color: black;
 291 #}
 292
 293 td.head {
 294         font-weight:bold;
 295         text-align: center;
 296 }
 297
 298 td.head a {
 299         color:blue;
 300 }
 301
 302 /*
 303   A Table representing 1 or more columns of text, i.e. Detail lists
 304 */
 305 div.detail table {
 306         width: 100%;
 307 }
 308
 309 div.detail caption {
 310         border-bottom: solid 1px #C0C0C0;
 311 }
 312
 313
 314 /*
 315         Approval Form select all
 316
 317 */
 318 .selectAllButton {
 319         background: transparent;
 320         border:none;
 321         color:blue;
 322         text-decoration:underline;
 323         font-weight:bold;
 324         cursor:pointer;
 325 }
 326
 327
 328 /*
 329         Begin Web Command Styling
 330 */
 331 #console_and_options {
 332         position:relative;
 333 }
 334
 335 .maximized {
 336         position:absolute;
 337         top:0px;
 338         bottom:50px;
 339         left:0px;
 340         right:0px;
 341         z-index:1000;
 342         background-color:white;
 343 }
 344
 345 #console_area {
 346         -webkit-border-radius: 15px;
 347         -moz-border-radius: 15px;
 348         border-radius: 15px;
 349         background-color: black;
 350         color: white;
 351         font-family: "Lucida Console", Monaco, monospace;
 352         overflow-y: scroll;
 353         height: 600px;
 354         min-width: 600px;
 355         padding: 5px;
 356         resize: vertical;
 357 }
 358
 359 .command,.bold {
 360         font-weight: bold;
 361 }
 362
 363 .command:before {
 364         content: "> ";
 365 }
 366
 367 .response{
 368         font-style: italic;
 369         font-size: 150%;
 370 }
 371
 372 #input_area {
 373         margin-top: 10px;
 374         clear: both;
 375 }
 376
 377 #command_field, #submit {
 378         font-size: 125%;
 379         background-color: #333333;
 380         color: white;
 381         font-family: "Lucida Console", Monaco, monospace;
 382         -webkit-border-radius: 1em;
 383         -moz-border-radius: 1em;
 384         border-radius: 1em;
 385 }
 386
 387 #command_field {
 388         width: 75%;
 389         padding-left: 1em;
 390 }
 391
 392 #submit {
 393         background-color: #7FB5C9;
 394         padding: 0 5%;
 395         float: right;
 396 }
 397
 398 /*
 399         Options Menu Styling for Web Command
 400 */
 401 #options_link {
 402         -webkit-border-radius: 0 0 20% 20%;
 403         -moz-border-radius: 0 0 20% 20%;
 404         border-radius: 0 0 20% 20%;
 405         -webkit-transition: opacity 0.5s ease-in-out;
 406         -moz-transition: opacity 0.5s ease-in-out;
 407         -ms-transition: opacity 0.5s ease-in-out;
 408         -o-transition: opacity 0.5s ease-in-out;
 409         transition: opacity 0.5s ease-in-out;
 410 }
 411
 412 .closed {
 413         opacity: 0.5;
 414         filter: alpha(opacity=50);
 415 }
 416
 417 #options_link:hover, .open {
 418         opacity: 1.0;
 419         filter: alpha(opacity=100);
 420 }
 421
 422 #options_link, #options {
 423         background: white;
 424         position:absolute;
 425         top:0;
 426         right:2em;
 427         padding:0.1em;
 428 }
 429
 430 #options > img {
 431         cursor: pointer;
 432         float: right;
 433         padding: 0.2em;
 434 }
 435
 436 .selected {
 437         border: 3px solid 2B6E9C;
 438 }
 439
 440 #options, #text_slider {
 441         display:none;
 442         padding:0.5em;
 443         -webkit-border-radius: 0 0 0 10px;
 444         -moz-border-radius: 0 0 0 10px;
 445         border-radius: 0 0 0 10px;
 446 }
 447 #text_slider {
 448         clear:both;
 449 }
 450
 451 /*
 452         Button styling for changing text size
 453 */
 454 .change_font {
 455         border-top: 1px solid #96d1f8;
 456         background: #65a9d7;
 457         background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
 458         background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
 459         background: -moz-linear-gradient(top, #3e779d, #65a9d7);
 460         background: -ms-linear-gradient(top, #3e779d, #65a9d7);
 461         background: -o-linear-gradient(top, #3e779d, #65a9d7);
 462         padding: 0 2px;
 463         -webkit-border-radius: 50%;
 464         -moz-border-radius: 50%;
 465         border-radius: 50%;
 466         -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
 467         -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
 468         box-shadow: rgba(0,0,0,1) 0 1px 0;
 469         text-shadow: rgba(0,0,0,.4) 0 1px 0;
 470         color: white;
 471         font-size: 14px;
 472         font-family: monospace;
 473         text-decoration: none;
 474         vertical-align: middle;
 475 }
 476 .change_font:hover {
 477         border-top-color: #28597a;
 478         background: #28597a;
 479         color: #ccc;
 480 }
 481
 482 /*
 483         Text Size Slider styling
 484 */
 485
 486 input[type=range] {
 487   -webkit-appearance: none;
 488   width: 60%;
 489   margin: 0;
 490 }
 491 input[type=range]:focus {
 492   outline: none;
 493 }
 494 input[type=range]::-webkit-slider-runnable-track {
 495   width: 100%;
 496   height: 4px;
 497   cursor: pointer;
 498   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 499   background: #3071a9;
 500   border-radius: 0.6px;
 501   border: 0.5px solid #010101;
 502 }
 503 input[type=range]::-webkit-slider-thumb {
 504   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 505   border: 1px solid #000000;
 506   height: 16px;
 507   width: 16px;
 508   border-radius: 30px;
 509   background: #efffff;
 510   cursor: pointer;
 511   -webkit-appearance: none;
 512   margin-top: -7.15px;
 513 }
 514 input[type=range]:focus::-webkit-slider-runnable-track {
 515   background: #367ebd;
 516 }
 517 input[type=range]::-moz-range-track {
 518   width: 100%;
 519   height: 2.7px;
 520   cursor: pointer;
 521   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 522   background: #3071a9;
 523   border-radius: 0.6px;
 524   border: 0.5px solid #010101;
 525 }
 526 input[type=range]::-moz-range-thumb {
 527   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 528   border: 1px solid #000000;
 529   height: 16px;
 530   width: 16px;
 531   border-radius: 30px;
 532   background: #efffff;
 533   cursor: pointer;
 534 }
 535 input[type=range]::-ms-track {
 536   width: 100%;
 537   height: 2.7px;
 538   cursor: pointer;
 539   background: transparent;
 540   border-color: transparent;
 541   color: transparent;
 542 }
 543 input[type=range]::-ms-fill-lower {
 544   background: #2a6495;
 545   border: 0.5px solid #010101;
 546   border-radius: 1.2px;
 547   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 548 }
 549 input[type=range]::-ms-fill-upper {
 550   background: #3071a9;
 551   border: 0.5px solid #010101;
 552   border-radius: 1.2px;
 553   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 554 }
 555 input[type=range]::-ms-thumb {
 556   box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 557   border: 1px solid #000000;
 558   height: 16px;
 559   width: 16px;
 560   border-radius: 30px;
 561   background: #efffff;
 562   cursor: pointer;
 563   height: 2.7px;
 564 }
 565 input[type=range]:focus::-ms-fill-lower {
 566   background: #3071a9;
 567 }
 568 input[type=range]:focus::-ms-fill-upper {
 569   background: #367ebd;
 570 }
 571 .expired {
 572         color: red;
 573         background-color: pink;
 574 }
 575 .blank_line {
 576         padding: 10px;
 577 }
 578 #filterByUser input {
 579         display: inline;
 580 }
 581
 582 #PassChange p {
 583         font-size: .9em;
 584 }
 585
 586 #passwordRules li {
 587         font-size: .9em;
 588 }