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