| 提交 | 用户 | 时间 | ||
| 58d006 | 1 | .enable_plugin_datatables() when(@enable-plugin-datatables = true) { |
| A | 2 | |
| 3 | //dataTables | |
| 4 | .dataTables_length { | |
| 5 | //margin-left:8px; | |
| 6 | select { | |
| 7 | width: 70px; | |
| 8 | height: 25px; | |
| 9 | padding: 2px 3px; | |
| 10 | } | |
| 11 | label { | |
| 12 | font-weight:normal; | |
| 13 | } | |
| 14 | } | |
| 15 | .dataTables_filter { | |
| 16 | // margin-right:8px; | |
| 17 | text-align:right; | |
| 18 | input[type=text], input[type=search] { | |
| 19 | width: 125px; | |
| 20 | height: 18px; | |
| 21 | line-height: 18px; | |
| 22 | .box-sizing(content-box); | |
| 23 | padding: 4px 6px; | |
| 24 | } | |
| 25 | label { | |
| 26 | font-weight:normal; | |
| 27 | } | |
| 28 | } | |
| 29 | ||
| 30 | .dataTables_info { | |
| 31 | // margin:0 0 0 12px; | |
| 32 | font-size: @base-font-size + 1; | |
| 33 | } | |
| 34 | ||
| 35 | .dataTables_paginate { | |
| 36 | text-align: right; | |
| 37 | .pagination { | |
| 38 | margin: 0 12px; | |
| 39 | } | |
| 40 | } | |
| 41 | ||
| 42 | ||
| 43 | ||
| 44 | ||
| 45 | ||
| 46 | .dataTables_wrapper { | |
| 47 | label { | |
| 48 | display: inline-block; | |
| 49 | font-size: @base-font-size; | |
| 50 | } | |
| 51 | input[type=text] , input[type=search], select { | |
| 52 | margin-bottom: 0 !important; | |
| 53 | margin: 0 4px; | |
| 54 | } | |
| 55 | ||
| 56 | .row { | |
| 57 | margin: 0 !important;//to override .rtl's | |
| 58 | ||
| 59 | &:first-child { | |
| 60 | padding-top: 12px; | |
| 61 | padding-bottom: 12px; | |
| 62 | ||
| 63 | background-color: #EFF3F8; | |
| 64 | ||
| 65 | + .dataTable { | |
| 66 | border-top: 1px solid @table-border-color; | |
| 67 | border-bottom: 1px solid @table-border-color; | |
| 68 | } | |
| 69 | } | |
| 70 | &:last-child { | |
| 71 | border-bottom: 1px solid lighten(@table-border-color , 1%); | |
| 72 | padding-top: 12px; | |
| 73 | padding-bottom: 12px; | |
| 74 | ||
| 75 | background-color: #EFF3F8; | |
| 76 | } | |
| 77 | } | |
| 78 | ||
| 79 | .dataTables_scroll + .row { | |
| 80 | border-top: 1px solid lighten(@table-border-color , 1%); | |
| 81 | } | |
| 82 | ||
| 83 | } | |
| 84 | ||
| 85 | ||
| 86 | ||
| 87 | ||
| 88 | .dataTable { | |
| 89 | margin-bottom:0; | |
| 90 | > thead > tr > th { | |
| 91 | &[class*=sort] { | |
| 92 | cursor:pointer; | |
| 93 | &:after { | |
| 94 | float: right; | |
| 95 | display: inline; | |
| 96 | ||
| 97 | content: "\f0dc"; | |
| 98 | font-family: FontAwesome; | |
| 99 | font-size: @base-font-size; | |
| 100 | font-weight: normal; | |
| 101 | ||
| 102 | color: #555; | |
| 103 | } | |
| 104 | ||
| 105 | &:hover { | |
| 106 | color:@table-sort-hover; | |
| 107 | } | |
| 108 | } | |
| 109 | ||
| 110 | &[class*=sorting_] { | |
| 111 | color:@table-sort-active; | |
| 112 | } | |
| 113 | ||
| 114 | &.sorting_desc , &.sorting_asc { | |
| 115 | #gradient > .vertical(#EFF3F8 , #E3E7ED); | |
| 116 | } | |
| 117 | ||
| 118 | &.sorting_desc:after { | |
| 119 | content:"\f0dd"; | |
| 120 | top:-6px; | |
| 121 | color:@table-sort-active; | |
| 122 | } | |
| 123 | &.sorting_asc:after { | |
| 124 | content:"\f0de"; | |
| 125 | top:4px; | |
| 126 | color:@table-sort-active; | |
| 127 | } | |
| 128 | ||
| 129 | &.sorting_disabled { | |
| 130 | cursor:inherit; | |
| 131 | &:after { display:none; } | |
| 132 | } | |
| 133 | ||
| 134 | } | |
| 135 | ||
| 136 | } | |
| 137 | ||
| 138 | //scrollable dataTable | |
| 139 | .dataTables_scrollHead + .dataTables_scrollBody > .dataTable > thead > tr > th:after { | |
| 140 | display: none; | |
| 141 | } | |
| 142 | .dataTables_scrollHeadInner { | |
| 143 | width: auto !important; | |
| 144 | } | |
| 145 | .dataTables_scrollHeadInner > .dataTable > thead > tr > th { | |
| 146 | border-bottom-width: 0 !important; | |
| 147 | } | |
| 148 | ||
| 149 | ||
| 150 | //some extra border because of scrolling horizontally | |
| 151 | .dataTables_borderWrap { | |
| 152 | .dataTables_scrollBody , .dataTables_scrollHead { | |
| 153 | border: 1px solid @table-border-color !important; | |
| 154 | border-width: 0 1px !important; | |
| 155 | ||
| 156 | .table-bordered { | |
| 157 | border-left-width: 0; | |
| 158 | border-right-width: 0; | |
| 159 | ||
| 160 | > thead > tr > th:first-child, | |
| 161 | > tbody > tr > td:first-child { | |
| 162 | border-left-width: 0; | |
| 163 | } | |
| 164 | > thead > tr > th:last-child, | |
| 165 | > tbody > tr > td:last-child { | |
| 166 | border-right-width: 0; | |
| 167 | } | |
| 168 | } | |
| 169 | } | |
| 170 | } | |
| 171 | ||
| 172 | ||
| 173 | ||
| 174 | ||
| 175 | ||
| 176 | //some extra from | |
| 177 | //https://github.com/DataTables/Plugins/tree/master/integration/bootstrap/3 | |
| 178 | table.dataTable { | |
| 179 | clear: both; | |
| 180 | max-width: none !important; | |
| 181 | } | |
| 182 | ||
| 183 | table.dataTable th:active { | |
| 184 | outline: none; | |
| 185 | } | |
| 186 | ||
| 187 | //Scrolling | |
| 188 | div.dataTables_scrollHead table { | |
| 189 | margin-bottom: 0 !important; | |
| 190 | border-bottom-left-radius: 0; | |
| 191 | border-bottom-right-radius: 0; | |
| 192 | } | |
| 193 | ||
| 194 | div.dataTables_scrollHead table thead tr:last-child th:first-child, | |
| 195 | div.dataTables_scrollHead table thead tr:last-child td:first-child { | |
| 196 | border-bottom-left-radius: 0 !important; | |
| 197 | border-bottom-right-radius: 0 !important; | |
| 198 | } | |
| 199 | ||
| 200 | div.dataTables_scrollBody table { | |
| 201 | border-top: none; | |
| 202 | margin-top: 0 !important; | |
| 203 | margin-bottom: 0 !important; | |
| 204 | } | |
| 205 | ||
| 206 | div.dataTables_scrollBody tbody tr:first-child th, | |
| 207 | div.dataTables_scrollBody tbody tr:first-child td { | |
| 208 | border-top: none; | |
| 209 | } | |
| 210 | ||
| 211 | div.dataTables_scrollFoot table { | |
| 212 | margin-top: 0 !important; | |
| 213 | border-top: none; | |
| 214 | } | |
| 215 | ||
| 216 | ||
| 217 | ||
| 218 | ||
| 219 | ||
| 220 | /// | |
| 221 | //table Tools extension | |
| 222 | .tableTools-container { | |
| 223 | margin-bottom: 8px; | |
| 224 | position: relative; | |
| 225 | } | |
| 226 | ||
| 227 | .gritter-item-wrapper.dt-button-info { | |
| 228 | padding: 12px 11px 8px; | |
| 229 | z-index: 1999; | |
| 230 | > h2 { | |
| 231 | margin-top: 0; | |
| 232 | } | |
| 233 | } | |
| 234 | ||
| 235 | ||
| 236 | ||
| 237 | .dt-button-collection .dropdown-menu { | |
| 238 | display: block; | |
| 239 | z-index: 1101; | |
| 240 | ||
| 241 | > li > a { | |
| 242 | color: #888; | |
| 243 | text-decoration: line-through; | |
| 244 | } | |
| 245 | > li > a.active { | |
| 246 | color : #333; | |
| 247 | text-decoration: none; | |
| 248 | } | |
| 249 | } | |
| 250 | ||
| 251 | ||
| 252 | div.dt-button-background { | |
| 253 | position: fixed; | |
| 254 | top: 0; | |
| 255 | left: 0; | |
| 256 | height: 100%; | |
| 257 | width: 100%; | |
| 258 | background-color: black; | |
| 259 | z-index: 1100; | |
| 260 | opacity: 0.1; | |
| 261 | } | |
| 262 | ||
| 263 | ||
| 264 | .dataTable>tbody>tr.selected>td { | |
| 265 | background-color:@state-success-bg; | |
| 266 | } | |
| 267 | .dataTable>tbody>tr.selected:hover>td { | |
| 268 | background-color: darken(@state-success-bg, 5%); | |
| 269 | } | |
| 270 | ||
| 271 | ||
| 272 | ||
| 273 | ||
| 274 | /// | |
| 275 | div.dataTables_processing { | |
| 276 | position: absolute; | |
| 277 | top: 50%; | |
| 278 | left: 50%; | |
| 279 | width: 80%; | |
| 280 | height: 60px; | |
| 281 | margin-left: -40%; | |
| 282 | margin-top: -25px; | |
| 283 | padding-top: 20px; | |
| 284 | padding-bottom: 20px; | |
| 285 | text-align: center; | |
| 286 | font-size: 1.2em; | |
| 287 | background-color: white; | |
| 288 | border: 2px solid #DDD; | |
| 289 | background-color: rgba(255,255,255,0.66); | |
| 290 | } | |
| 291 | ||
| 292 | ||
| 293 | } | |
| 294 | .enable_plugin_datatables(); | |
