catalog/src/main/webapp/catalog/css/templateDetail.css

   1 /**
   2  * Copyright 2016-2017 ZTE Corporation.
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  *     http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  */
  16 body {
  17         font-family: microsoft yahei !important;
  18 }
  19
  20 /* blue pill (inspired by iTunes)
  21 *******************************************************************************/
  22 .redFont{
  23         color:red;
  24 }
  25 .blue {
  26
  27         background-color: #5b9bd1;
  28         border-radius: 20px;
  29         color: #fff;
  30         font-weight: bold;
  31         padding: 8px 0;
  32         text-align: center;
  33         width: 100px;
  34 }
  35
  36 .blue:hover {
  37         background-color: #e8f3fd;
  38         color: #5b9bd1;
  39 }
  40
  41 .blue.selected {
  42         border: 0;
  43         background-color: #5b9bd1;
  44         color: #fff;
  45 }
  46
  47 .blue.selected:hover {
  48         border: 0;
  49         background-color: #5b9bd1;
  50         color: #fff;
  51 }
  52
  53 a {
  54         text-decoration: none !important;
  55 }
  56
  57 p {
  58         color: #444;
  59         font-size: 14px;
  60         font-weight: normal;
  61         line-height: 21px;
  62         margin: 0 0 12px 0;
  63 }
  64
  65 p.credit {
  66         border-top: 1px solid #ccc;
  67         font-size: 14px;
  68         line-height: 140%;
  69         margin: 36px 0 12px 0;
  70         padding: 8px 0 0 0;
  71         text-align: center;
  72 }
  73
  74 ul.column {
  75         float: left;
  76         list-style: none;
  77         width: 675px;
  78 }
  79
  80 ul.column li {
  81         background: #eee;
  82         -webkit-border-radius: 5px;
  83         border-radius: 5px;
  84         -webkit-box-shadow: inset 0 1px 1px 0 #c7c7c7;
  85         box-shadow: inset 0 1px 1px 0 #c7c7c7;
  86         float: left;
  87         margin: 10px 0 0 10px;
  88         display: block;
  89         height: 150px;
  90         text-align: center;
  91         width: 215px;
  92 }
  93
  94 /* Clear Floated Elements
  95 ------------------------------------------------------------------------------*/
  96 .column:after,.button-collection:after,.clearfix:after,div.project-info:after
  97         {
  98         clear: both;
  99         content: ' ';
 100         display: block;
 101         font-size: 0;
 102         line-height: 0;
 103         visibility: hidden;
 104         width: 0;
 105         height: 0;
 106 }
 107
 108 .container-fluid {
 109         background-color:white !important;
 110         min-height:800px;
 111 }
 112
 113 .nav-tabs {
 114         border: 0;
 115 }
 116
 117 .nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus
 118         {
 119         border: 0;
 120         border-top: 3px solid #F3565D;
 121 }
 122
 123 .nav-tabs>li>a {
 124         border-radius: 0;
 125 }
 126
 127 .nav-tabs>li>a:hover {
 128         background-color: #f1f3fa;
 129         border: 1Px solid #f1f3fa;
 130 }
 131
 132 .c3 {
 133         margin-top: 120px;
 134 }
 135
 136 .skills-chart-breadcrumb {
 137
 138 }
 139
 140 .blue:selected {
 141         border: 0;
 142         background-color: #5b9bd1;
 143 }
 144
 145 .btn {
 146         /* border-width: 0; */
 147         /* padding: 7px 14px; */
 148         /* font-size: 14px; */
 149         /* outline: none !important; */
 150         /* background-image: none !important; */
 151         /* filter: none; */
 152         /* -webkit-box-shadow: none; */
 153         -moz-box-shadow: none;
 154         /* box-shadow: none; */
 155         /* text-shadow: none; */
 156 }
 157
 158 select {
 159         border-width: 1px;
 160         padding: 4px 1px;
 161         border-radius: 4px;
 162 }
 163
 164 .input-sm {
 165         padding: 4px 10px;
 166 }
 167
 168 .btn-block {
 169         display: block;
 170         width: 100%;
 171         padding-left: 0;
 172         padding-right: 0;
 173 }
 174
 175 /* Bootstrap buttons */
 176 .btn-default {
 177         color: #5b9bd1;
 178         background-color: #fff;
 179         border-color: #ccc;
 180 }
 181
 182 .btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active
 183         {
 184         color: #333;
 185         background-color: #ededed;
 186         border-color: #b3b3b3;
 187 }
 188
 189 .open .btn-default.dropdown-toggle {
 190         color: #333;
 191         background-color: #ededed;
 192         border-color: #b3b3b3;
 193 }
 194
 195 .btn-default:active,.btn-default.active {
 196         background-image: none;
 197         background-color: #e0e0e0;
 198         font-weight: bold;
 199 }
 200
 201 .btn-default:active:hover,.btn-default.active:hover {
 202         background-color: #e6e6e6;
 203 }
 204
 205 .open .btn-default.dropdown-toggle {
 206         background-image: none;
 207 }
 208
 209 .btn-default.disabled,.btn-default.disabled:hover,.btn-default.disabled:focus,.btn-default.disabled:active,.btn-default.disabled.active,.btn-default[disabled],.btn-default[disabled]:hover,.btn-default[disabled]:focus,.btn-default[disabled]:active,.btn-default[disabled].active,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default:hover,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default.active
 210         {
 211         background-color: #fff;
 212         border-color: #ccc;
 213 }
 214
 215 .btn-default .badge {
 216         color: #fff;
 217         background-color: #333;
 218 }
 219
 220 .btn-default>i {
 221         color: #aaa;
 222 }
 223
 224 .btn-default>i[class^="icon-"],.btn-default>i[class*="icon-"] {
 225         color: #8c8c8c;
 226 }
 227
 228 div[data-name="tab_zone"] div {
 229         background-color: #f1f3fa;
 230         padding: 0px;
 231 }
 232
 233 div[data-name="cond_zone"] div {
 234         background-color: #fff;
 235         margin-top: 15px;
 236         margin-bottom: 15px;
 237 }
 238
 239 div[data-name="detail-conds-zone"] {
 240         display: inline;
 241 }
 242
 243 div[data-name="detail-conds-zone"] select,div[data-name="detail-conds-zone"] span
 244         {
 245         /**height:33px;*/
 246         margin-left: 15px;
 247         color: #5b9bd1;
 248         border-color: #ccc;
 249         font-weight: bold;
 250 }
 251
 252 .input{
 253         width:250px;
 254   height: 34px;
 255   padding: 6px 12px;
 256   font-size: 14px;
 257   line-height: 1.42857143;
 258   color: #555;
 259   background-color: #fff;
 260   background-image: none;
 261   border: 1px solid #ccc;
 262   border-radius: 4px;
 263   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
 264   box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
 265   -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
 266   transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
 267 }
 268
 269 div.separator {
 270         margin: 20px;
 271 }
 272
 273 div.separator div {
 274         text-align: center;
 275         line-height: 0;
 276 }
 277
 278 div.separator-line {
 279         height: 1px !important;
 280         width: 100%;
 281         background: #ddd;
 282         overflow: hidden;
 283 }
 284
 285 .dropdown-toggle {
 286         color: #5b9bd1;
 287 }
 288
 289 .calendar-date {
 290         color: #5b9bd1;
 291 }
 292
 293 .range_inputs {
 294         color: #5b9bd1;
 295 }
 296
 297 .btn.dropdown-toggle,.btn-group .btn.dropdown-toggle,.btn:hover,.btn:disabled,.btn[disabled],.btn:focus,.btn:active,.btn.active
 298         {
 299         outline: none !important;
 300         background-image: none !important;
 301         filter: none;
 302         -webkit-box-shadow: none;
 303         -moz-box-shadow: none;
 304         box-shadow: none;
 305         text-shadow: none;
 306 }
 307
 308 #skills-chart-breadcrumb {
 309         margin-bottom: 10px
 310 }
 311
 312 /*increase daterangepicker's css*/
 313 input[name="daterange"] {
 314         width: 220px;
 315         line-height: 0;
 316         height: 31px;
 317         vertical-align: top;
 318         margin-top: 2px;
 319 }
 320
 321 .daterangepicker .ranges {
 322         width: 205px;
 323 }
 324
 325 .daterangepicker .ranges input {
 326         width: 95px !important;
 327 }
 328
 329 td.details-control {
 330         background: url('../image/details_open.png') no-repeat center center;
 331         cursor: pointer;
 332 }
 333
 334 tr.shown td.details-control {
 335         background: url('../image/details_close.png') no-repeat center center;
 336 }
 337
 338 .details table td {
 339         word-wrap: break-word;
 340         word-break: normal;
 341         border-top: 1px solid #dddddd;
 342 }
 343
 344 .details table  tr:first-child td {
 345         border-top: none;
 346 }
 347
 348 .details table {
 349         table-layout: fixed;
 350         width: 100%;
 351 }
 352
 353 td.title {
 354         width: 10%;
 355 }
 356
 357 table.dataTable tbody th,table.dataTable tbody td {
 358         padding: 8px 10px;
 359 }
 360
 361 div.dataTables_length,div.dataTables_info {
 362         display: inline;
 363 }
 364
 365 div.dataTables_paginate {
 366         display: inline;
 367         float: right;
 368 }
 369
 370 div.pagination-panel {
 371         margin-right: 10px;
 372 }
 373
 374 input.pagination-panel-input {
 375         width: 50px;
 376 }
 377
 378 .daterangepicker .daterangepicker_start_input label,.daterangepicker .daterangepicker_end_input label
 379         {
 380         color: #5b9bd1;
 381 }
 382
 383 .daterangepicker .ranges .input-mini {
 384         color: #5b9bd1;
 385 }
 386
 387 .cancelBtn {
 388         padding: 5px 10px 5px 10px;
 389 }
 390
 391 .btn:focus,.btn:active:focus,.btn.active:focus {
 392         outline: 0;
 393 }
 394
 395 #right-menu {
 396         position:absolute;
 397         top:0;
 398         right:0;
 399         width:420px;
 400         height:100%;
 401         border-left:4px solid rgb(58,174,218);
 402         background-color:rgba(255,255,255,.95);
 403         padding-left:19px;
 404         padding-right:15px;
 405         padding-top:20px;
 406         z-index:9999;
 407         overflow-y: auto;
 408 }
 409
 410 #right-menu .btn{
 411         min-width: 30px !important;
 412         letter-spacing :normal !important;
 413 }
 414
 415 .rigth {
 416         float: right;
 417 }
 418 .right-button-pointer {
 419         display:inline-block;
 420         cursor:pointer
 421 }
 422 .floating-panel {
 423         width:400px;
 424         display:none
 425 }
 426
 427 title{height:25px;position:relative;top:20px;font-size:15px}
 428
 429 #ict_nodes_table_div {
 430         margin-top: 15px;
 431 }
 432
 433 #ict_nodes_table_div label {
 434         font-weight: 100;
 435 }
 436
 437 #ict_nodes_table_div  table {
 438         width: 100% !important;
 439 }
 440
 441 .nodesDetail {
 442         margin-top: 15px;
 443 }
 444
 445 .nodesDetail label {
 446         font-weight: 100;
 447 }
 448
 449 .nodesDetail table {
 450         width:100%;
 451         table-layout: fixed;
 452         word-wrap:break-word;
 453 }
 454
 455 .step {
 456         text-align: center;
 457         padding-top: 60px;
 458 }
 459
 460 .step div {
 461         text-align: left;
 462 }
 463
 464 div.separator-sline {
 465         height:28px ;
 466         width:3px;
 467 }
 468
 469 .titlefont {
 470         font-size:16px;
 471 }
 472
 473 .td_nodeId {
 474         font-size: small;
 475 }
 476
 477 .iconBtn {
 478         margin-left:15px;
 479         min-width:30px;
 480 }