portal-common/src/main/webapp/common/css/themes/ztebluelight.css

   1 /**\r
   2  * Copyright 2016-2017, CMCC Technologies Co., Ltd.\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 /***\r
  17 Blue theme\r
  18 ***/\r
  19 /***\r
  20 Reset and overrides  \r
  21 ***/\r
  22 body {\r
  23   background-color: #f1f3fa !important;\r
  24   font-family:"microsoft yahei";  \r
  25 }\r
  26 .page-content{\r
  27 background-color:#f1f3fa !important;\r
  28 }\r
  29 .page-sidebar-menu > li.active > a .selected{\r
  30 background-image:url("../../image/sidebar-menu-arrow-bluelight.png")\r
  31 }\r
  32 /***\r
  33 Page header\r
  34 ***/\r
  35 .header {\r
  36   filter: none !important;\r
  37   background-image: none !important;\r
  38   background-color: #3366CC !important;\r
  39 }\r
  40 .header .btn-navbar {\r
  41   background-color: #3366CC!important;\r
  42 }\r
  43 .header .navbar-nav .dropdown-toggle:hover,\r
  44 .header .navbar-nav .dropdown.open .dropdown-toggle {\r
  45   color: #fff;\r
  46   background-color: #3061c1 !important;\r
  47 }\r
  48 .header .navbar-nav li.dropdown .dropdown-toggle i {\r
  49   color: white !important;\r
  50 }\r
  51 .zte-theme-panel > .toggler:hover {\r
  52   background-color: #6192f7 !important;\r
  53 }\r
  54 .page-content .page-breadcrumb.breadcrumb .dashboard-date-range{\r
  55   background-color: #3366CC !important;\r
  56 }\r
  57 .btn-group .btn.blue.dropdown-toggle{\r
  58     background-color: #3366CC !important;\r
  59 }\r
  60 .btn-group .btn.blue.dropdown-toggle:hover{\r
  61     background-color: #2f5ebd !important;\r
  62 }\r
  63 /***\r
  64 Header Search\r
  65 ***/\r
  66 .header .search-form {\r
  67   background-color: #0B4263;\r
  68 }\r
  69 \r
  70 .header .search-form .form-control{\r
  71   color: #68bbec;\r
  72   border: 0; \r
  73   background-color: #0B4263;  \r
  74 }\r
  75 \r
  76 .header .search-form .submit {  \r
  77   background: url(../../image/search-icon-blue.png);\r
  78 }\r
  79 \r
  80 /***\r
  81 Hor menu\r
  82 ***/\r
  83 .header .hor-menu ul.nav li a {\r
  84   color: #fff;\r
  85 }\r
  86 \r
  87 .header .hor-menu ul.nav li.open > a,\r
  88 .header .hor-menu ul.nav li > a:hover,\r
  89 .header .hor-menu ul.nav li > a:focus {\r
  90   color: #bdcff4;\r
  91   background: #3366CC;\r
  92 }\r
  93 .header .hor-menu .dropdown-menu li > a {    \r
  94     color: #333 !important ; \r
  95 }\r
  96 .header .hor-menu .dropdown-menu li:hover > a{\r
  97   color: #3366CC !important; \r
  98   background: #e5e8f0 !important; \r
  99 }\r
 100 .dropdown-menu .mega-menu-content .row .mega-menu-submenu .active > a,\r
 101 .dropdown-menu .mega-menu-content .row .mega-menu-submenu .active > a:hover{\r
 102     color:#333  !important; \r
 103         background: #D9E5FF !important; \r
 104 }\r
 105 .header .hor-menu ul.nav li.active > a,\r
 106 .header .hor-menu ul.nav li.active > a:hover {\r
 107   color: #fff;\r
 108   background: #3366CC !important; \r
 109 }\r
 110 .header .hor-menu ul.nav li.current > a,\r
 111 .header .hor-menu ul.nav li.current > a:hover {\r
 112   color: #3366CC;\r
 113   background: #4174dc !important; \r
 114 }\r
 115 \r
 116 .header .hor-menu .dropdown-menu {  \r
 117     background: #fff ;\r
 118         border: 1px #769be6 solid !important ; \r
 119         border-top:0 !important ; \r
 120         border-bottom-right-radius:5px !important ; \r
 121     border-bottom-left-radius:5px !important ;  \r
 122         padding-right:20px;\r
 123 }\r
 124 \r
 125 .header .hor-menu .hor-menu-search-form-toggler.off {\r
 126    background: #4d7ee1 url(../../image/hor-menu-search-close-white.png) no-repeat center;\r
 127 }\r
 128 \r
 129 .header .hor-menu .search-form {  \r
 130   background:#4d7ee1; \r
 131 }\r
 132 \r
 133 .header .hor-menu .search-form form input {\r
 134   color: #ccc;\r
 135 }\r
 136 .header .hor-menu .search-form form input::-webkit-input-placeholder { /* WebKit browsers */\r
 137     color: #ccc;\r
 138 }\r
 139 .header .hor-menu .search-form form input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */\r
 140     color: #ccc;\r
 141 }\r
 142 .header .hor-menu .search-form form input::-moz-placeholder { /* Mozilla Firefox 19+ */\r
 143     color: #ccc;\r
 144 }\r
 145 .header .hor-menu .search-form form input:-ms-input-placeholder { /* Internet Explorer 10+ */\r
 146     color: #ccc;\r
 147 }\r
 148 \r
 149 .header.navbar .hor-menu ul.nav li.current .selected,\r
 150 .header.navbar .hor-menu ul.nav li.active .selected {\r
 151   border-top: 6px solid #3366CC;\r
 152 }\r
 153 /***\r
 154 Mega Menu\r
 155 ***/\r
 156 .mega-menu .mega-menu-submenu {  \r
 157   //border-right: 1px solid #d5d5d5;\r
 158 }\r
 159 \r
 160 .mega-menu .mega-menu-submenu li h3 {  \r
 161     color: #5681DA;\r
 162         font-weight:600 !important;\r
 163         \r
 164 }\r
 165 /*.mega-menu-dropdown .fa,\r
 166 #page-f-sidebar-menu .sub-menu .fa,\r
 167 .sub-menu .sub-menu .fa\r
 168 {\r
 169 display:none;\r
 170 }去掉左边二级菜单图标*/\r
 171 #main_hormenu .mega-menu-dropdown{\r
 172 margin-left:30px;\r
 173 }\r
 174 /***\r
 175 Page sidebar\r
 176 ***/\r
 177 .page-sidebar {\r
 178   background-color: #f1f3fa;\r
 179 }\r
 180 ul.page-sidebar-menu > li:last-child > a {\r
 181   border-bottom: 1px solid transparent !important;\r
 182 }\r
 183 .ul.page-sidebar-menu > li a i {\r
 184  /* color: #0d638f;*/\r
 185 }\r
 186 ul.page-sidebar-menu > li.open > a{\r
 187 border-bottom: 1px solid #e0e2e9  !important;\r
 188 }\r
 189 ul.page-sidebar-menu > li > a {\r
 190   border-top: 1px solid #e0e2e9  !important;\r
 191   /*background: #fff  !important;*/\r
 192   color: #2e487d !important;\r
 193 }\r
 194 ul.page-sidebar-menu > li > a:hover{\r
 195   background: #fff  !important; \r
 196   color: #3366CC !important;\r
 197 }\r
 198 ul.page-sidebar-menu > li.active > a {\r
 199   background: #3366CC  !important;\r
 200   border-top-color: transparent !important;\r
 201   color: #ffffff  !important;\r
 202 }\r
 203 ul.page-sidebar-menu > li.active > a:hover {\r
 204   background: #507edb  !important;\r
 205   border-top-color: transparent !important;\r
 206   color: #ffffff  !important;\r
 207 }\r
 208 ul.page-sidebar-menu > li.active > a i {\r
 209   color: #ffffff;\r
 210 }\r
 211 ul.page-sidebar-menu > li > ul.sub-menu > li:first-child > a {\r
 212   border-top: 0px !important;\r
 213 }\r
 214 ul.page-sidebar-menu > li > ul.sub-menu > li > a{\r
 215   color: #2e487d;/*right menu*/\r
 216 }\r
 217 ul.page-sidebar-menu > li > ul.sub-menu > li.active > a {\r
 218   color: #3366CC !important;\r
 219   background: #dde2f1 !important;\r
 220 }\r
 221 ul.page-sidebar-menu > li > ul.sub-menu > li.active > a:hover { \r
 222   background: #e3e7f5 !important;\r
 223 }\r
 224 ul.page-sidebar-menu > li > ul.sub-menu > li > a:hover {\r
 225   background: #eee !important;\r
 226   color:#3366CC;\r
 227 }\r
 228 ul.page-sidebar-menu > li.open > a{\r
 229  color:#fff;\r
 230  }\r
 231 /* 3rd level sub menu */\r
 232 ul.page-sidebar-menu > li > ul.sub-menu li > ul.sub-menu > li.active > a,\r
 233 ul.page-sidebar-menu > li > ul.sub-menu li > ul.sub-menu > li > a:hover,\r
 234 ul.page-sidebar-menu > li > ul.sub-menu li.open > a {\r
 235   color: #3366CC !important;\r
 236   background: #fff !important;\r
 237 }\r
 238 /* font color for all sub menu links*/\r
 239 ul.page-sidebar-menu li > ul.sub-menu > li > a {\r
 240   /*color: #c3e4f7;*/\r
 241 }\r
 242 /* menu arrows */\r
 243 ul.page-sidebar-menu > li > a .arrow:before,\r
 244 ul.page-sidebar-menu > li > a .arrow.open:before {\r
 245   /*color: #51b1e9 !important;*/\r
 246 }\r
 247 ul.page-sidebar-menu > li > ul.sub-menu a .arrow:before,\r
 248 ul.page-sidebar-menu > li > ul.sub-menu a .arrow.open:before {\r
 249   color: #3ba6e6 !important;\r
 250 }\r
 251 ul.page-sidebar-menu > li > a > .arrow.open:before {\r
 252   color: #68bbec !important;\r
 253 }\r
 254 ul.page-sidebar-menu > li.active > a .arrow:before,\r
 255 ul.page-sidebar-menu > li.active > a .arrow.open:before {\r
 256   color: #ffffff !important;\r
 257 }\r
 258 /* sidebar search */\r
 259 .page-sidebar .sidebar-search input {\r
 260   background-color: #0f5179 !important;\r
 261   color: #000000;\r
 262 }\r
 263 .page-sidebar .sidebar-search input::-webkit-input-placeholder {\r
 264   color: #000000 !important;\r
 265 }\r
 266 .page-sidebar .sidebar-search input:-moz-placeholder {\r
 267   color: #000000 !important;\r
 268 }\r
 269 .page-sidebar .sidebar-search input:-ms-input-placeholder {\r
 270   color: #000000 !important;\r
 271 }\r
 272 .page-sidebar .sidebar-search input {\r
 273   background-color: #eeeeee !important;\r
 274  /*color: white !important;*/\r
 275 }\r
 276 .page-sidebar .sidebar-search .input-box {\r
 277   border-bottom: 1px solid #000000 !important;\r
 278 }\r
 279 .page-sidebar .sidebar-search .submit {\r
 280   background-image: url(../../image/search-icon-blue.png);\r
 281 }\r
 282 /***\r
 283 Sidebar toggler\r
 284 ***/\r
 285 .sidebar-toggler {\r
 286  background-image: url(../../image/sidebar-toggler-grey.jpg);\r
 287   background-color: #0f5179;\r
 288 }\r
 289 /* search box bg color on expanded */\r
 290 .page-sidebar-closed .page-sidebar .sidebar-search.open .form-container {\r
 291   background-color: #3366CC !important;\r
 292 }\r
 293 .page-sidebar-closed .page-sidebar .sidebar-search.open .form-container .remove {\r
 294   background-image: url("../../image/sidebar-search-close-blue.png");\r
 295 }\r
 296 /* sub menu bg color on hover menu item */\r
 297 .page-sidebar-closed ul.page-sidebar-menu > li:hover .sub-menu {\r
 298   background-color: #e4e4e4;\r
 299 }\r
 300 /***\r
 301 Footer \r
 302 ***/\r
 303 .footer .footer-inner {\r
 304   color: #7c7c7c;\r
 305 }\r
 306 .footer .footer-tools .go-top {\r
 307   background-color: #1985c6;\r
 308 }\r
 309 .footer .footer-tools .go-top:hover {\r
 310   opacity: 0.7;\r
 311   filter: alpha(opacity=70);\r
 312 }\r
 313 .footer .footer-tools .go-top i {\r
 314   color: #68bbec;\r
 315 }\r
 316 /***\r
 317 Footer Layouts (new in v1.3)\r
 318 ***/\r
 319 /* begin:fixed footer */\r
 320 .page-footer-fixed .footer {\r
 321   background-color: #0f5179;\r
 322 }\r
 323 .page-footer-fixed .footer .footer-inner {\r
 324   color: #68bbec;\r
 325 }\r
 326 .page-footer-fixed .footer .footer-tools .go-top {\r
 327   background-color: #1985c6;\r
 328 }\r
 329 .page-footer-fixed .footer .footer-tools .go-top i {\r
 330   color: #68bbec;\r
 331 }\r
 332 /* end:fixed footer */\r
 333 /***\r
 334 Gritter Notifications \r
 335 ***/\r
 336 .gritter-top {\r
 337   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left -30px !important;\r
 338 }\r
 339 .gritter-bottom {\r
 340   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left bottom !important;\r
 341 }\r
 342 .gritter-item {\r
 343   display: block;\r
 344   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left -40px !important;\r
 345 }\r
 346 .gritter-close {\r
 347   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left top !important;\r
 348 }\r
 349 .gritter-title {\r
 350   text-shadow: none !important;\r
 351   /* Not supported by IE :( */\r
 352 \r
 353 }\r
 354 /* for the light (white) version of the gritter notice */\r
 355 .gritter-light .gritter-item,\r
 356 .gritter-light .gritter-bottom,\r
 357 .gritter-light .gritter-top,\r
 358 .gritter-light .gritter-close {\r
 359   background-image: url(../../thirdparty/gritter/images/gritter-light.png) !important;\r
 360 }\r
 361 .gritter-item-wrapper a {\r
 362   color: #18a5ed;\r
 363 }\r
 364 .gritter-item-wrapper a:hover {\r
 365   color: #0b6694;\r
 366 }\r
 367 /* begin: boxed page */\r
 368 @media (min-width: 992px) {\r
 369   .page-boxed {\r
 370     background-color: #fff !important;\r
 371   }\r
 372   .page-boxed .page-container {\r
 373     background-color: #fff;\r
 374     border-left: 1px solid #1c98e1;\r
 375     border-bottom: 1px solid #1c98e1;\r
 376   }\r
 377   .page-boxed.page-sidebar-reversed .page-container {\r
 378     border-left: 0;\r
 379     border-right: 1px solid #1c98e1;\r
 380   }\r
 381   .page-boxed.page-sidebar-fixed .page-container {\r
 382     border-left: 0;\r
 383     border-bottom: 0;\r
 384   }\r
 385   .page-boxed.page-sidebar-reversed.page-sidebar-fixed .page-container {\r
 386     border-left: 0;\r
 387     border-right: 0;\r
 388     border-bottom: 0;\r
 389   }\r
 390   .page-boxed.page-sidebar-fixed .page-sidebar {\r
 391     border-left: 1px solid #1c98e1;\r
 392   }\r
 393   .page-boxed.page-sidebar-reversed.page-sidebar-fixed .page-sidebar {\r
 394     border-right: 1px solid #1c98e1;\r
 395     border-left: 0; \r
 396   }\r
 397   .page-boxed.page-sidebar-fixed.page-footer-fixed .footer {\r
 398     background-color: #125e8b !important;\r
 399   }\r
 400 ul.page-sidebar-menu > li .active> a{\r
 401  background: #3366CC !important; \r
 402 }\r
 403 /* end: boxed page */\r
 404 /***\r
 405 Landscape phone to portrait tablet\r
 406 ***/\r
 407 @media (max-width: 991px) {\r
 408   /***\r
 409     page sidebar\r
 410     ***/\r
 411   .page-sidebar {\r
 412     background-color: #f1f3fa !important;\r
 413   }\r
 414   ul.page-sidebar-menu > li > a {\r
 415     border-top: 1px solid #e0e2e9 !important;\r
 416         \r
 417   }\r
 418     ul.page-sidebar-menu > li > a :hover{\r
 419     border-top: 1px solid #e0e2e9 !important;\r
 420         color: #fff  !important;\r
 421   }\r
 422   ul.page-sidebar-menu > li:last-child > a {\r
 423     border-bottom: 0 !important;\r
 424   }\r
 425   .page-sidebar .sidebar-search input {\r
 426     background-color: #4072d6 !important;\r
 427         color:#c5c5c7 !important;\r
 428   }\r
 429   .page-sidebar .sidebar-search input::-webkit-input-placeholder {\r
 430   color: #c5c5c7 !important;\r
 431 }\r
 432   .page-sidebar .sidebar-search input:-moz-placeholder {\r
 433   color: #c5c5c7 !important;\r
 434 }\r
 435   .page-sidebar .sidebar-search input:-ms-input-placeholder {\r
 436   color: #c5c5c7 !important;\r
 437 }\r
 438   ul.page-sidebar-menu > li.open > a,\r
 439     ul.page-sidebar-menu > li.open > a:hover,\r
 440   ul.page-sidebar-menu > li > a:hover{\r
 441     background: #3366CC !important; \r
 442    }\r
 443      ul.page-sidebar-menu > li > a:hover,\r
 444          ul.page-sidebar-menu > li:hover > a {\r
 445     background: #fff !important; \r
 446    }\r
 447  ul.page-sidebar-menu li > ul.sub-menu > li > a {\r
 448   color: #3366CC;\r
 449 }\r
 450 \r