apiroute/apiroute-service/src/main/resources/iui-route/css/newRoute.css

   1 /*\r
   2  * Copyright (C) 2016 ZTE, Inc. and others. All rights reserved. (ZTE)\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     background-color: #4d5b69!important;\r
  18     font-family: "microsoft yahei";\r
  19 }\r
  20 \r
  21 .header.navbar {\r
  22     width: 100%;\r
  23     padding: 0 20px 0 20px;\r
  24     margin: 0;\r
  25     border: 0px;\r
  26     padding: 0px;\r
  27     box-shadow: none;\r
  28     height: 42px;\r
  29     min-height: 42px;\r
  30 }\r
  31 \r
  32 .header {\r
  33     filter: none !important;\r
  34     background-image: none !important;\r
  35     background-color: #fff !important;\r
  36 }\r
  37 \r
  38 .header.navbar .navbar-brand {\r
  39     display: inline-block;\r
  40     margin-right: 0;\r
  41     padding: 0;\r
  42      width: 135px !important;\r
  43     height: 42px !important;\r
  44      background-color: #238dfa !important;\r
  45     margin-top: 0 !important;\r
  46 }\r
  47 \r
  48 .page-sidebar-closed .header.navbar .navbar-brand {\r
  49     width: 35px !important;\r
  50 }\r
  51 \r
  52 .header.navbar .navbar-brand img {\r
  53     margin-left: 10px !important;\r
  54     width: 80%;\r
  55     margin-top: 7px;\r
  56 }\r
  57 \r
  58 .page-sidebar-closed .header.navbar .navbar-brand img {\r
  59     display: none !important;\r
  60 }\r
  61 \r
  62 .page-sidebar{\r
  63         float:left;\r
  64         width: 135px ;\r
  65         background-color: #4d5b69;\r
  66 }\r
  67 \r
  68 .page-sidebar-closed  .page-sidebar{\r
  69  \r
  70         width: 35px  !important;\r
  71 \r
  72 }\r
  73 \r
  74 .page-container {\r
  75     margin: 0px;\r
  76     padding: 0px;\r
  77     position: relative;\r
  78 }\r
  79 \r
  80 .sideBar {\r
  81     width: 135px;\r
  82     background-color: #4D5B69;\r
  83 }\r
  84 \r
  85 .page-sidebar-closed  .sideBar{\r
  86 width: 35px  !important;\r
  87 background-color: #4d5b69!important;\r
  88 \r
  89 }\r
  90 \r
  91 .sideBar .menu {\r
  92     width: 100%;\r
  93     height: 128px;\r
  94     color: #aaa;\r
  95     font-size: 16px;\r
  96     text-align: center;\r
  97     /* border-bottom: 2px solid #536372; */\r
  98     border-top: 1px solid #536372;\r
  99     /* border-bottom-style: groove; */\r
 100 }\r
 101 .page-sidebar-closed  .sideBar .menu {\r
 102 height: 35px  !important;\r
 103 border-bottom:0px;\r
 104 }\r
 105 \r
 106 .sideBar .menu i.icon.fa{\r
 107     font-size: 32px;\r
 108     margin-bottom: 7px\r
 109 }\r
 110 \r
 111 \r
 112 \r
 113 .page-sidebar-closed  .sideBar .menu i.icon.fa{\r
 114     font-size: 18px;\r
 115  \r
 116 }\r
 117 \r
 118 \r
 119 \r
 120 \r
 121 \r
 122 .sideBar .menu i.icon {\r
 123     width: 36px;\r
 124     height: 36px;\r
 125 }\r
 126 \r
 127 .page-sidebar-closed .sideBar .menu i.icon {\r
 128     width: 18px;\r
 129     height: 18px;\r
 130 } \r
 131 .sideBar .menu i.icon {\r
 132     margin-top: 25%;\r
 133 }\r
 134 \r
 135 .sideBar a.router-link-active .menu {\r
 136     color: #fff;\r
 137     background-color: #424e57;\r
 138 }\r
 139 \r
 140 .page-sidebar-closed .sideBar a.router-link-active .menu{\r
 141 width: 35px  !important;\r
 142 height: 35px;\r
 143 }\r
 144 \r
 145 .page-sidebar-closed  .sideBar a label{\r
 146   display:none\r
 147  \r
 148 }\r
 149 \r
 150 .sideBar a{\r
 151 text-decoration: none;\r
 152 cursor:pointer ;\r
 153 }\r
 154 \r
 155 .sideBar a:hover .menu {\r
 156     color: #fff;\r
 157     background-color: #424e57;\r
 158 \r
 159 \r
 160 }\r
 161 \r
 162 .page-sidebar-closed  .sideBar a:hover .menu{\r
 163 width: 35px  !important;\r
 164 }\r
 165 \r
 166 .sideBar a.router-link-active .menu .menu-left {\r
 167     width: 2px;\r
 168     height: 126px;\r
 169     float: left;\r
 170     background-color: #238ff9;\r
 171 }\r
 172 \r
 173 .page-sidebar-closed .sideBar a.router-link-active .menu .menu-left {\r
 174 \r
 175     height: 33px;\r
 176 \r
 177 }\r
 178 \r
 179 \r
 180 .sidebar-toggler {\r
 181     background-image: url(../img/sidebar-toggler-grey.jpg);\r
 182     background-color: #0f5179;\r
 183      margin-top: 15px;\r
 184          margin-left: 95px;\r
 185       margin-bottom: 5px;\r
 186       cursor: pointer;\r
 187     opacity: 0.5;\r
 188     filter: alpha(opacity=50);\r
 189     width: 29px;\r
 190     height: 29px;\r
 191     background-repeat: no-repeat;\r
 192 }\r
 193 \r
 194 .page-sidebar-closed .sidebar-toggler{\r
 195  margin-left: 3px;\r
 196 }\r
 197 \r
 198 .sideBar  a  .selected{\r
 199 display:none;\r
 200         }\r
 201 \r
 202 .sideBar  a.router-link-active  .selected{\r
 203             display: block;\r
 204     float: right;\r
 205     margin-top: -25px;\r
 206     background: none;\r
 207     width: 0;\r
 208     height: 0;\r
 209     border-style: solid;\r
 210     border-top: 12px double transparent;\r
 211     border-bottom: 12px double transparent;\r
 212     border-left: 0;\r
 213     border-right: 8px solid #F1F3FA;  \r
 214 \r
 215 }\r
 216 \r
 217 .chineseTitle{\r
 218     margin: 0;\r
 219     float: left;\r
 220     margin-left: 20px;\r
 221     font-weight: bold;\r
 222     padding-top: 8px;\r
 223     letter-spacing: 2px;\r
 224     font-size: 20px;\r
 225     font-family: 'Microsoft Yahei', sans-serif;\r
 226     /* text-shadow: -1px 1px rgba(221, 221, 221, 1); */\r
 227 }\r
 228 \r
 229 .englishTitle{\r
 230             margin: 0;\r
 231             float: left;\r
 232             margin-left: 10px;\r
 233             font-family: Arial;\r
 234             font-size: 14px;\r
 235             padding-top: 15px;\r
 236 }\r
 237 \r
 238 .page-content {\r
 239         margin-top: 0px;\r
 240         padding: 0px;\r
 241         background-color: #9C5A5A !important;\r
 242         margin-left: 135px;\r
 243 }\r
 244 \r
 245 .page-sidebar-closed .page-content{\r
 246 \r
 247   margin-left: 35px;\r
 248 }\r
 249 \r
 250 .page-content-body {\r
 251     padding-left: 10px;\r
 252     padding-right: 10px;\r
 253     padding-top: 8px;\r
 254     float:left;\r
 255     width: 100%;\r
 256     background-color: #f1f3fa;\r
 257 }\r
 258 \r
 259 .page-sidebar-closed  .page-content-body {\r
 260     padding-left: 0px;\r
 261     padding-right: 5px;\r
 262     padding-top: 5px;\r
 263 \r
 264 }\r
 265 \r
 266 label {\r
 267 \r
 268     font-weight: normal; \r
 269 }\r
 270 \r
 271 .sideBar ul{\r
 272     list-style: none;\r
 273     padding: 0; \r
 274 }\r
 275 \r
 276 \r
 277 \r
 278 .sub-menu {\r
 279     list-style: none;\r
 280     padding: 0;\r
 281     margin: 8px 0;\r
 282      box-shadow: 5px 5px rgba(140,178,198,.2);\r
 283      display: none;\r
 284 }\r
 285 \r
 286 .sub-menu {\r
 287     width: 150px;\r
 288     position: absolute;\r
 289     left: 135px;\r
 290     margin-top: 0;\r
 291     top: 5px;\r
 292     background-color: #4d5b69;\r
 293 }\r
 294 \r
 295 .page-sidebar-closed  .sub-menu {\r
 296   \r
 297     left: 35px;\r
 298     top: 0px;\r
 299 \r
 300 }\r
 301 \r
 302 .sideBarUl li{\r
 303    position:relative; \r
 304 }\r
 305 .sideBarUl li:hover .sub-menu\r
 306  {\r
 307     display: block;\r
 308 }\r
 309 \r
 310 .sub-menu li{\r
 311     background: 0 0;\r
 312     margin: 0;\r
 313     padding: 0;\r
 314     margin-top: 1px!important;\r
 315 }\r
 316 \r
 317 \r
 318 .sub-menu li>a {\r
 319      color: #aaa;\r
 320     display: block;\r
 321     margin: 0;\r
 322     padding: 12px 14px 12px 30px;\r
 323     text-decoration: none;\r
 324     font-size: 14px;\r
 325     font-weight: 400;\r
 326     background: 0 0;\r
 327 }\r
 328 \r
 329 .sub-menu li>a:hover {\r
 330     color: #fff;\r
 331     background-color: #424e57;\r
 332 \r
 333 \r
 334 }\r
 335 \r
 336 .subicon.fa{\r
 337     font-size: 18px;\r
 338     margin-top:0px;\r
 339 \r
 340 }\r