portal-common/src/main/webapp/common/css/themes/blue.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: #1570a6 !important;\r
  24 }\r
  25 /***\r
  26 Page header\r
  27 ***/\r
  28 .header {\r
  29   filter: none !important;\r
  30   background-image: none !important;\r
  31   background-color: #0f4e74 !important;\r
  32 }\r
  33 .header .btn-navbar {\r
  34   background-color: #0f4e74 !important;\r
  35 }\r
  36 .header .navbar-nav .dropdown-toggle:hover,\r
  37 .header .navbar-nav .dropdown.open .dropdown-toggle {\r
  38   color: #fff;\r
  39   background-color: #146a9d !important;\r
  40 }\r
  41 .header .navbar-nav li.dropdown .dropdown-toggle i {\r
  42   color: #68bbec !important;\r
  43 }\r
  44 .page-content .page-breadcrumb.breadcrumb{\r
  45 background-color:#F5F5F5 !important;\r
  46 }\r
  47 /***\r
  48 Header Search\r
  49 ***/\r
  50 .header .search-form {\r
  51   background-color: #0B4263;\r
  52 }\r
  53 \r
  54 .header .search-form .form-control{\r
  55   color: #68bbec;\r
  56   border: 0; \r
  57   background-color: #0B4263;  \r
  58 }\r
  59 \r
  60 .header .search-form .submit {  \r
  61   background: url(../../image/search-icon-blue.png);\r
  62 }\r
  63 \r
  64 /***\r
  65 Hor menu\r
  66 ***/\r
  67 .header .hor-menu ul.nav li a {\r
  68   color: #ccc;\r
  69 }\r
  70 \r
  71 .header .hor-menu ul.nav li.open > a,\r
  72 .header .hor-menu ul.nav li > a:hover,\r
  73 .header .hor-menu ul.nav li > a:focus {\r
  74   color: #fff;\r
  75   background: #146a9d;\r
  76 }\r
  77 \r
  78 .header .hor-menu .dropdown-menu li:hover > a,\r
  79 .header .hor-menu ul.nav li.active > a,\r
  80 .header .hor-menu ul.nav li.active > a:hover {\r
  81   color: #fff;\r
  82   background: #e02222 !important; \r
  83 }\r
  84 \r
  85 .header .hor-menu ul.nav li.current > a,\r
  86 .header .hor-menu ul.nav li.current > a:hover {\r
  87   color: #fff;\r
  88   background: #e02222 !important; \r
  89 }\r
  90 \r
  91 .header .hor-menu .dropdown-menu {  \r
  92     background: #146a9d;\r
  93 }\r
  94 .header .hor-menu .dropdown-menu li > a {    \r
  95     color: #ccc;\r
  96 }\r
  97 \r
  98 .header .hor-menu .hor-menu-search-form-toggler.off {\r
  99    background: #146a9d url(../../image/hor-menu-search-close-white.png) no-repeat center;\r
 100 }\r
 101 \r
 102 .header .hor-menu .search-form {  \r
 103   background:#146a9d; \r
 104 }\r
 105 \r
 106 .header .hor-menu .search-form form input {\r
 107   color: #ccc;\r
 108 }\r
 109 \r
 110 .header .hor-menu .search-form .btn {\r
 111   color: #ccc;\r
 112   background: url(../../image/search-icon-white.png) no-repeat center;\r
 113 }\r
 114 \r
 115 .header .hor-menu .search-form form input::-webkit-input-placeholder { /* WebKit browsers */\r
 116     color: #ccc;\r
 117 }\r
 118 .header .hor-menu .search-form form input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */\r
 119     color: #ccc;\r
 120 }\r
 121 .header .hor-menu .search-form form input::-moz-placeholder { /* Mozilla Firefox 19+ */\r
 122     color: #ccc;\r
 123 }\r
 124 .header .hor-menu .search-form form input:-ms-input-placeholder { /* Internet Explorer 10+ */\r
 125     color: #ccc;\r
 126 }\r
 127 \r
 128 /***\r
 129 Mega Menu\r
 130 ***/\r
 131 .mega-menu .mega-menu-submenu {  \r
 132   border-right: 1px solid #1876AD;\r
 133 }\r
 134 \r
 135 .mega-menu .mega-menu-submenu li h3 {  \r
 136   color: #fff;\r
 137 }\r
 138 \r
 139 /***\r
 140 Page sidebar\r
 141 ***/\r
 142 .page-sidebar {\r
 143   background-color: #1570a6;\r
 144 }\r
 145 ul.page-sidebar-menu > li > a {\r
 146   border-top: 1px solid #1c95dc !important;\r
 147   color: #ffffff !important;\r
 148 }\r
 149 ul.page-sidebar-menu > li:last-child > a {\r
 150   border-bottom: 1px solid transparent !important;\r
 151 }\r
 152 ul.page-sidebar-menu > li a i {\r
 153   color: #7fc5ef;\r
 154 }\r
 155 ul.page-sidebar-menu > li.open > a,\r
 156 ul.page-sidebar-menu > li > a:hover,\r
 157 ul.page-sidebar-menu > li:hover > a {\r
 158   background: #12618f;\r
 159 }\r
 160 ul.page-sidebar-menu > li.active > a {\r
 161   background: #cc1d1d !important;\r
 162   border-top-color: transparent !important;\r
 163   color: #ffffff;\r
 164 }\r
 165 ul.page-sidebar-menu > li.active > a i {\r
 166   color: #ffffff;\r
 167 }\r
 168 ul.page-sidebar-menu > li > ul.sub-menu > li:first-child > a {\r
 169   border-top: 0px !important;\r
 170 }\r
 171 ul.page-sidebar-menu > li > ul.sub-menu > li.active > a,\r
 172 ul.page-sidebar-menu > li > ul.sub-menu > li > a:hover {\r
 173   color: #ffffff !important;\r
 174   background: #1b8fd3 !important;\r
 175 }\r
 176 ul.page-sidebar-menu > li > ul.sub-menu > li > a:hover {\r
 177   background: #1b8fd3 !important;\r
 178 }\r
 179 /* 3rd level sub menu */\r
 180 ul.page-sidebar-menu > li > ul.sub-menu li > ul.sub-menu > li.active > a,\r
 181 ul.page-sidebar-menu > li > ul.sub-menu li > ul.sub-menu > li > a:hover,\r
 182 ul.page-sidebar-menu > li > ul.sub-menu li.open > a {\r
 183   color: #ffffff !important;\r
 184   background: #1b8fd3 !important;\r
 185 }\r
 186 /* font color for all sub menu links*/\r
 187 ul.page-sidebar-menu li > ul.sub-menu > li > a {\r
 188   color: #c3e4f7;\r
 189 }\r
 190 /* menu arrows */\r
 191 ul.page-sidebar-menu > li > a .arrow:before,\r
 192 ul.page-sidebar-menu > li > a .arrow.open:before {\r
 193   color: #51b1e9 !important;\r
 194 }\r
 195 ul.page-sidebar-menu > li > ul.sub-menu a .arrow:before,\r
 196 ul.page-sidebar-menu > li > ul.sub-menu a .arrow.open:before {\r
 197   color: #3ba6e6 !important;\r
 198 }\r
 199 ul.page-sidebar-menu > li > a > .arrow.open:before {\r
 200   color: #68bbec !important;\r
 201 }\r
 202 ul.page-sidebar-menu > li.active > a .arrow:before,\r
 203 ul.page-sidebar-menu > li.active > a .arrow.open:before {\r
 204   color: #ffffff !important;\r
 205 }\r
 206 /* sidebar search */\r
 207 .page-sidebar .sidebar-search input {\r
 208   background-color: #0f5179 !important;\r
 209   color: #51b1e9;\r
 210 }\r
 211 .page-sidebar .sidebar-search input::-webkit-input-placeholder {\r
 212   color: #51b1e9 !important;\r
 213 }\r
 214 .page-sidebar .sidebar-search input:-moz-placeholder {\r
 215   color: #51b1e9 !important;\r
 216 }\r
 217 .page-sidebar .sidebar-search input:-ms-input-placeholder {\r
 218   color: #51b1e9 !important;\r
 219 }\r
 220 .page-sidebar .sidebar-search input {\r
 221   background-color: #1570a6 !important;\r
 222   color: #bfbfbf !important;\r
 223 }\r
 224 .page-sidebar .sidebar-search .input-box {\r
 225   border-bottom: 1px solid #51b1e9 !important;\r
 226 }\r
 227 .page-sidebar .sidebar-search .submit {\r
 228   background-image: url(../../image/search-icon-blue.png);\r
 229 }\r
 230 /***\r
 231 Sidebar toggler\r
 232 ***/\r
 233 .sidebar-toggler {\r
 234   background-image: url(../../image/sidebar-toggler-blue.jpg);\r
 235   background-color: #0f5179;\r
 236 }\r
 237 /* search box bg color on expanded */\r
 238 .page-sidebar-closed .page-sidebar .sidebar-search.open .form-container {\r
 239   background-color: #1570a6 !important;\r
 240 }\r
 241 .page-sidebar-closed .page-sidebar .sidebar-search.open .form-container .remove {\r
 242   background-image: url("../../image/sidebar-search-close-blue.png");\r
 243 }\r
 244 /* sub menu bg color on hover menu item */\r
 245 .page-sidebar-closed ul.page-sidebar-menu > li:hover .sub-menu {\r
 246   background-color: #1570a6;\r
 247 }\r
 248 /***\r
 249 Footer \r
 250 ***/\r
 251 .footer .footer-inner {\r
 252   color: #68bbec;\r
 253 }\r
 254 .footer .footer-tools .go-top {\r
 255   background-color: #1985c6;\r
 256 }\r
 257 .footer .footer-tools .go-top:hover {\r
 258   opacity: 0.7;\r
 259   filter: alpha(opacity=70);\r
 260 }\r
 261 .footer .footer-tools .go-top i {\r
 262   color: #68bbec;\r
 263 }\r
 264 /***\r
 265 Footer Layouts (new in v1.3)\r
 266 ***/\r
 267 /* begin:fixed footer */\r
 268 .page-footer-fixed .footer {\r
 269   background-color: #0f5179;\r
 270 }\r
 271 .page-footer-fixed .footer .footer-inner {\r
 272   color: #68bbec;\r
 273 }\r
 274 .page-footer-fixed .footer .footer-tools .go-top {\r
 275   background-color: #1985c6;\r
 276 }\r
 277 .page-footer-fixed .footer .footer-tools .go-top i {\r
 278   color: #68bbec;\r
 279 }\r
 280 /* end:fixed footer */\r
 281 /***\r
 282 Gritter Notifications \r
 283 ***/\r
 284 .gritter-top {\r
 285   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left -30px !important;\r
 286 }\r
 287 .gritter-bottom {\r
 288   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left bottom !important;\r
 289 }\r
 290 .gritter-item {\r
 291   display: block;\r
 292   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left -40px !important;\r
 293 }\r
 294 .gritter-close {\r
 295   background: url(../../thirdparty/gritter/images/gritter-blue.png) no-repeat left top !important;\r
 296 }\r
 297 .gritter-title {\r
 298   text-shadow: none !important;\r
 299   /* Not supported by IE :( */\r
 300 \r
 301 }\r
 302 /* for the light (white) version of the gritter notice */\r
 303 .gritter-light .gritter-item,\r
 304 .gritter-light .gritter-bottom,\r
 305 .gritter-light .gritter-top,\r
 306 .gritter-light .gritter-close {\r
 307   background-image: url(../../thirdparty/gritter/images/gritter-light.png) !important;\r
 308 }\r
 309 .gritter-item-wrapper a {\r
 310   color: #18a5ed;\r
 311 }\r
 312 .gritter-item-wrapper a:hover {\r
 313   color: #0b6694;\r
 314 }\r
 315 /* begin: boxed page */\r
 316 @media (min-width: 992px) {\r
 317   .page-boxed {\r
 318     background-color: #125e8b !important;\r
 319   }\r
 320   .page-boxed .page-container {\r
 321     background-color: #1570a6;\r
 322     border-left: 1px solid #1c98e1;\r
 323     border-bottom: 1px solid #1c98e1;\r
 324   }\r
 325   .page-boxed.page-sidebar-reversed .page-container {\r
 326     border-left: 0;\r
 327     border-right: 1px solid #1c98e1;\r
 328   }\r
 329   .page-boxed.page-sidebar-fixed .page-container {\r
 330     border-left: 0;\r
 331     border-bottom: 0;\r
 332   }\r
 333   .page-boxed.page-sidebar-reversed.page-sidebar-fixed .page-container {\r
 334     border-left: 0;\r
 335     border-right: 0;\r
 336     border-bottom: 0;\r
 337   }\r
 338   .page-boxed.page-sidebar-fixed .page-sidebar {\r
 339     border-left: 1px solid #1c98e1;\r
 340   }\r
 341   .page-boxed.page-sidebar-reversed.page-sidebar-fixed .page-sidebar {\r
 342     border-right: 1px solid #1c98e1;\r
 343     border-left: 0; \r
 344   }\r
 345   .page-boxed.page-sidebar-fixed.page-footer-fixed .footer {\r
 346     background-color: #125e8b !important;\r
 347   }\r
 348 }\r
 349 /* end: boxed page */\r
 350 /***\r
 351 Landscape phone to portrait tablet\r
 352 ***/\r
 353 @media (max-width: 991px) {\r
 354   /***\r
 355     page sidebar\r
 356     ***/\r
 357   .page-sidebar {\r
 358     background-color: #105882 !important;\r
 359   }\r
 360   ul.page-sidebar-menu > li > a {\r
 361     border-top: 1px solid #187fbd !important;\r
 362   }\r
 363   ul.page-sidebar-menu > li:last-child > a {\r
 364     border-bottom: 0 !important;\r
 365   }\r
 366   .page-sidebar .sidebar-search input {\r
 367     background-color: #105882 !important;\r
 368   }\r
 369   ul.page-sidebar-menu > li.open > a,\r
 370   ul.page-sidebar-menu > li > a:hover,\r
 371   ul.page-sidebar-menu > li:hover > a {\r
 372     background: #0e4b70;\r
 373   }\r
 374 }\r