openo-portal/portal-catalog/src/main/webapp/catalog/css/virtualApplication.css

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