openo-portal/portal-auth/src/main/webapp/user/css/component.css

   1 /*\r
   2  * Copyright 2016-2017 Huawei 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 .button_Group {\r
  17     margin: 15px 0;\r
  18     overflow: hidden;\r
  19 }\r
  20 \r
  21 .fk_button {\r
  22     padding: 0 14px;\r
  23     height: 24px;\r
  24     float: left;\r
  25     cursor: pointer;\r
  26     text-decoration: none;\r
  27     outline: 0;\r
  28     border: 1px solid #d3d3d3;\r
  29     text-align: center;\r
  30     box-shadow: 0 1px 1px rgba(0,0,0,.05);\r
  31     background: #fafafa;\r
  32     background: -moz-linear-gradient(top,#fff,#fafafa);\r
  33     background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(100%,#fafafa));\r
  34     background: -webkit-linear-gradient(top,#fff,#fafafa);\r
  35     background: linear-gradient(to bottom,#fff,#fafafa);\r
  36     border-radius: 6px!important;\r
  37 }\r
  38 .fk_button:hover {\r
  39     color: #009ae7;    \r
  40     border: 1px solid #4AC9FF\r
  41 }\r
  42 .fk_button:active {\r
  43     color: #0000;    \r
  44     border: 1px solid #4AC9FF\r
  45 }\r
  46 \r
  47 .button_Group > button {\r
  48     margin-right: 10px;\r
  49 }\r
  50 .add_imag {\r
  51     background-image: url(/openoui/user/images/add.png);\r
  52 }\r
  53 .delete_imag {\r
  54     background-image: url(/openoui/user/images/delete.png);\r
  55 }\r
  56 .button_imag {\r
  57     padding-left: 25px;\r
  58     background-repeat: no-repeat;\r
  59     background-position: 5px center;\r
  60 }\r
  61 \r
  62 \r
  63 /*table style*/\r
  64 table.dataTable thead th {\r
  65     padding: 0!important;\r
  66     height: 22px!important;\r
  67     padding: 1px 10px 0 5px;\r
  68     overflow: visible;\r
  69     white-space: nowrap;\r
  70     background: #f0f0f0!important;\r
  71     border: 1px solid #ddd;\r
  72     border-top: 1px solid #e3e3e3!important;\r
  73     border-left: 1px dotted transparent!important;\r
  74     border-bottom: 1px solid #e3e3e3!important;\r
  75     box-sizing: content-box;\r
  76     text-align: left;\r
  77     font-weight: \r
  78 }\r
  79 table.dataTable tr td {\r
  80     padding: 0 10px 0 5px!important;\r
  81     height: 30px!important;\r
  82     color: #000!important;\r
  83     border: none!important;\r
  84     border-left: 1px solid transparent!important;\r
  85     border-bottom: 1px solid #e3e3e3!important;\r
  86     overflow: hidden!important;\r
  87     white-space: nowrap!important;\r
  88     text-align: left;\r
  89 }\r
  90 \r
  91 table.dataTable th, table.dataTable td {\r
  92     font-size: 12px!important;\r
  93     color: #000!important;\r
  94     max-width: 95%!important;\r
  95     font-weight: 400!important;\r
  96 }\r
  97 \r
  98 .paginate_button {\r
  99     color: #666!important;\r
 100     font-size: 12px!important;\r
 101     font-family: Lucida Grande,Verdana,Arial,Helvetica,sans-serif!important;\r
 102     line-height: 24px!important;\r
 103     text-align: center!important;\r
 104     border: 1px solid #e0e0e0!important;\r
 105     text-decoration: none!important;\r
 106     padding: 0 7px!important;\r
 107     border-radius: 3px!important;\r
 108     background: #fff!important;\r
 109 }\r
 110 .paginate_button:hover {\r
 111     color: #666!important;\r
 112     border: 1px solid #4ac9ff!important;\r
 113     cursor: pointer!important;\r
 114 }\r
 115 .current {\r
 116     text-decoration: none!important;\r
 117     color: #fff!important;\r
 118     border: 1px solid #00adf5!important;\r
 119     background: #4ad2ff!important;\r
 120 }\r
 121 \r
 122 /*over write the jquery dataTable*/\r
 123 .dataTables_wrapper .dataTables_paginate .paginate_button:hover {\r
 124     color: #666!important;\r
 125 }\r
 126 .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {\r
 127     color: #fff!important;\r
 128 }\r
 129 table.dataTable tr.odd, table.dataTable tr.odd>.sorting_1 {\r
 130     background-color: #f9f9f9!important;\r
 131 }\r
 132 table.dataTable tr.even, table.dataTable tr.even>.sorting_1 {\r
 133     background-color: #f7f7f7!important;\r
 134 }\r
 135 table.dataTable tbody tr:hover, tbody tr.odd>.sorting_1:hover, tbody tr.even>.sorting_1:hover {\r
 136     background-color: #E6FBE0!important;\r
 137 }\r
 138 table.dataTable.no-footer {\r
 139     border-bottom: none!important;\r
 140 }\r
 141 \r
 142 /*the length information step style*/\r
 143 .dataTables_length, .dataTables_info {\r
 144     display: inline-block!important;\r
 145     float: left!important;\r
 146 }\r
 147 .left {\r
 148     display: inline-block;\r
 149     float: left;\r
 150     overflow: hidden;\r
 151     margin: 10px 20px 10px 5px;\r
 152 }\r
 153  .right {\r
 154     display: inline-block;\r
 155     float: right;\r
 156     overflow: hidden;\r
 157     margin-top: 10px;\r
 158 }\r
 159 .dataTables_length, .dataTables_info {\r
 160     display: inline-block;!important;\r
 161     float: left!important;\r
 162     clear: none!important;\r
 163     padding-top: 0!important;\r
 164 }\r
 165 .dataTables_length label {\r
 166     font-size: 0;\r
 167 }\r
 168 \r
 169 /*page select style*/\r
 170 .dataTables_length select {\r
 171     height: 22px;\r
 172     line-height: 22px;\r
 173     text-align: center;\r
 174     margin-right: 5px;\r
 175     border: 1px solid #e0e0e0;\r
 176     color: #000;\r
 177     padding: 1px;\r
 178 }\r
 179 .dataTables_length select:active {\r
 180     text-align: center;\r
 181     margin-right: 5px;\r
 182     border: 1px solid #e0e0e0;\r
 183     color: #000;\r
 184     padding: 1px;\r
 185     border-radius: 5px;\r
 186 }\r
 187 \r
 188 /* input style overwrite*/ \r
 189 .fwk_input {\r
 190     border: 1px solid #c3c3c3;\r
 191     background-color: #fff;\r
 192     padding: 0 0 0 6px;\r
 193     border-radius: 4px;\r
 194     color: #000;\r
 195     display: inline-block;\r
 196     outline: 0;\r
 197     box-shadow: 1px 1px #f6f6f6 inset;\r
 198     font-size: 12px;\r
 199     background: #fff;\r
 200     height: 24px;\r
 201     width: 300px;\r
 202 }\r
 203 \r
 204 .fwk_input:hover, .fwk_input:focus {\r
 205     border-color: #4ac9ff;\r
 206     box-shadow: 1px 1px rgba(74,201,255,.2) inset;\r
 207 }\r
 208 .fwk_input[type=password] {\r
 209     -moz-user-select: none;\r
 210     -khtml-user-select: none;\r
 211     user-select: none;\r
 212 }\r
 213 \r
 214 .fwk_input:disabled {\r
 215     background-color: #ededed!important;\r
 216     color: #666;\r
 217     box-shadow: 1px 1px #ededed inset!important;\r
 218     border: 1px solid #e0e0e0!important;\r
 219     resize: none;\r
 220 }\r
 221 \r
 222 /* input style textarea*/ \r
 223 .fwk_textarea {\r
 224     border: 1px solid #c3c3c3;\r
 225     background-color: #fff;\r
 226     padding: 0 0 0 6px;\r
 227     border-radius: 4px;\r
 228     color: #000;\r
 229     display: inline-block;\r
 230     outline: 0;\r
 231     box-shadow: 1px 1px #f6f6f6 inset;\r
 232     font-size: 12px;\r
 233     background: #fff;\r
 234     height: 72px;\r
 235     width: 300px;\r
 236 }\r
 237 \r
 238 .fwk_textarea:hover, .fwk_textarea:focus {\r
 239     border-color: #4ac9ff;\r
 240     box-shadow: 1px 1px rgba(74,201,255,.2) inset;\r
 241 }\r
 242 \r
 243 \r
 244 \r
 245 \r
 246 \r
 247 \r