1 | .p-datatable {
|
---|
2 | position: relative;
|
---|
3 | }
|
---|
4 |
|
---|
5 | .p-datatable table {
|
---|
6 | border-collapse: collapse;
|
---|
7 | min-width: 100%;
|
---|
8 | table-layout: fixed;
|
---|
9 | }
|
---|
10 |
|
---|
11 | .p-datatable .p-sortable-column {
|
---|
12 | cursor: pointer;
|
---|
13 | user-select: none;
|
---|
14 | }
|
---|
15 |
|
---|
16 | .p-datatable .p-sortable-column .p-column-title,
|
---|
17 | .p-datatable .p-sortable-column .p-sortable-column-icon,
|
---|
18 | .p-datatable .p-sortable-column .p-sortable-column-badge {
|
---|
19 | vertical-align: middle;
|
---|
20 | }
|
---|
21 |
|
---|
22 | .p-datatable .p-sortable-column .p-sortable-column-badge {
|
---|
23 | display: inline-flex;
|
---|
24 | align-items: center;
|
---|
25 | justify-content: center;
|
---|
26 | }
|
---|
27 |
|
---|
28 | .p-datatable-auto-layout > .p-datatable-wrapper {
|
---|
29 | overflow-x: auto;
|
---|
30 | }
|
---|
31 |
|
---|
32 | .p-datatable-auto-layout > .p-datatable-wrapper > table {
|
---|
33 | table-layout: auto;
|
---|
34 | }
|
---|
35 |
|
---|
36 | .p-datatable-responsive-scroll > .p-datatable-wrapper {
|
---|
37 | overflow-x: auto;
|
---|
38 | }
|
---|
39 |
|
---|
40 | .p-datatable-responsive-scroll > .p-datatable-wrapper > table,
|
---|
41 | .p-datatable-auto-layout > .p-datatable-wrapper > table {
|
---|
42 | table-layout: auto;
|
---|
43 | }
|
---|
44 |
|
---|
45 | .p-datatable-hoverable-rows .p-selectable-row {
|
---|
46 | cursor: pointer;
|
---|
47 | }
|
---|
48 |
|
---|
49 | /* Scrollable */
|
---|
50 | .p-datatable-scrollable .p-datatable-wrapper {
|
---|
51 | position: relative;
|
---|
52 | overflow: auto;
|
---|
53 | }
|
---|
54 |
|
---|
55 | .p-datatable-scrollable .p-datatable-thead,
|
---|
56 | .p-datatable-scrollable .p-datatable-tbody,
|
---|
57 | .p-datatable-scrollable .p-datatable-tfoot {
|
---|
58 | display: block;
|
---|
59 | }
|
---|
60 |
|
---|
61 | .p-datatable-scrollable .p-datatable-thead > tr,
|
---|
62 | .p-datatable-scrollable .p-datatable-tbody > tr,
|
---|
63 | .p-datatable-scrollable .p-datatable-tfoot > tr {
|
---|
64 | display: flex;
|
---|
65 | flex-wrap: nowrap;
|
---|
66 | width: 100%;
|
---|
67 | }
|
---|
68 |
|
---|
69 | .p-datatable-scrollable .p-datatable-thead > tr > th,
|
---|
70 | .p-datatable-scrollable .p-datatable-tbody > tr > td,
|
---|
71 | .p-datatable-scrollable .p-datatable-tfoot > tr > td {
|
---|
72 | display: flex;
|
---|
73 | flex: 1 1 0;
|
---|
74 | align-items: center;
|
---|
75 | }
|
---|
76 |
|
---|
77 | .p-datatable-scrollable .p-datatable-thead {
|
---|
78 | position: sticky;
|
---|
79 | top: 0;
|
---|
80 | z-index: 1;
|
---|
81 | }
|
---|
82 |
|
---|
83 | .p-datatable-scrollable .p-datatable-frozen-tbody {
|
---|
84 | position: sticky;
|
---|
85 | z-index: 1;
|
---|
86 | }
|
---|
87 |
|
---|
88 | .p-datatable-scrollable .p-datatable-tfoot {
|
---|
89 | position: sticky;
|
---|
90 | bottom: 0;
|
---|
91 | z-index: 1;
|
---|
92 | }
|
---|
93 |
|
---|
94 | .p-datatable-scrollable .p-frozen-column {
|
---|
95 | position: sticky;
|
---|
96 | background: inherit;
|
---|
97 | }
|
---|
98 |
|
---|
99 | .p-datatable-scrollable th.p-frozen-column {
|
---|
100 | z-index: 1;
|
---|
101 | }
|
---|
102 |
|
---|
103 | .p-datatable-scrollable-both .p-datatable-thead > tr > th,
|
---|
104 | .p-datatable-scrollable-both .p-datatable-tbody > tr > td,
|
---|
105 | .p-datatable-scrollable-both .p-datatable-tfoot > tr > td,
|
---|
106 | .p-datatable-scrollable-horizontal .p-datatable-thead > tr > th
|
---|
107 | .p-datatable-scrollable-horizontal .p-datatable-tbody > tr > td,
|
---|
108 | .p-datatable-scrollable-horizontal .p-datatable-tfoot > tr > td {
|
---|
109 | flex: 0 0 auto;
|
---|
110 | }
|
---|
111 |
|
---|
112 | .p-datatable-flex-scrollable {
|
---|
113 | display: flex;
|
---|
114 | flex-direction: column;
|
---|
115 | height: 100%;
|
---|
116 | }
|
---|
117 |
|
---|
118 | .p-datatable-flex-scrollable .p-datatable-wrapper {
|
---|
119 | display: flex;
|
---|
120 | flex-direction: column;
|
---|
121 | flex: 1;
|
---|
122 | height: 100%;
|
---|
123 | }
|
---|
124 |
|
---|
125 | .p-datatable-scrollable .p-rowgroup-header {
|
---|
126 | position: sticky;
|
---|
127 | z-index: 1;
|
---|
128 | }
|
---|
129 |
|
---|
130 | .p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead,
|
---|
131 | .p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot {
|
---|
132 | display: table;
|
---|
133 | border-collapse: collapse;
|
---|
134 | width: 100%;
|
---|
135 | table-layout: fixed;
|
---|
136 | }
|
---|
137 |
|
---|
138 | .p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr,
|
---|
139 | .p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr {
|
---|
140 | display: table-row;
|
---|
141 | }
|
---|
142 |
|
---|
143 | .p-datatable-scrollable.p-datatable-grouped-header .p-datatable-thead > tr > th,
|
---|
144 | .p-datatable-scrollable.p-datatable-grouped-footer .p-datatable-tfoot > tr > td {
|
---|
145 | display: table-cell;
|
---|
146 | }
|
---|
147 |
|
---|
148 | /* Flex Scrollable */
|
---|
149 | .p-datatable-flex-scrollable {
|
---|
150 | display: flex;
|
---|
151 | flex-direction: column;
|
---|
152 | flex: 1;
|
---|
153 | height: 100%;
|
---|
154 | }
|
---|
155 |
|
---|
156 | .p-datatable-flex-scrollable .p-datatable-virtual-scrollable-body {
|
---|
157 | flex: 1;
|
---|
158 | }
|
---|
159 |
|
---|
160 | /* Resizable */
|
---|
161 | .p-datatable-resizable > .p-datatable-wrapper {
|
---|
162 | overflow-x: auto;
|
---|
163 | }
|
---|
164 |
|
---|
165 | .p-datatable-resizable .p-datatable-thead > tr > th,
|
---|
166 | .p-datatable-resizable .p-datatable-tfoot > tr > td,
|
---|
167 | .p-datatable-resizable .p-datatable-tbody > tr > td {
|
---|
168 | overflow: hidden;
|
---|
169 | white-space: nowrap;
|
---|
170 | }
|
---|
171 |
|
---|
172 | .p-datatable-resizable .p-resizable-column {
|
---|
173 | background-clip: padding-box;
|
---|
174 | position: relative;
|
---|
175 | }
|
---|
176 |
|
---|
177 | .p-datatable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
|
---|
178 | display: none;
|
---|
179 | }
|
---|
180 |
|
---|
181 | .p-datatable .p-column-resizer {
|
---|
182 | display: block;
|
---|
183 | position: absolute !important;
|
---|
184 | top: 0;
|
---|
185 | right: 0;
|
---|
186 | margin: 0;
|
---|
187 | width: .5rem;
|
---|
188 | height: 100%;
|
---|
189 | padding: 0px;
|
---|
190 | cursor:col-resize;
|
---|
191 | border: 1px solid transparent;
|
---|
192 | }
|
---|
193 |
|
---|
194 | .p-datatable .p-column-resizer-helper {
|
---|
195 | width: 1px;
|
---|
196 | position: absolute;
|
---|
197 | z-index: 10;
|
---|
198 | display: none;
|
---|
199 | }
|
---|
200 |
|
---|
201 | .p-datatable .p-row-editor-init,
|
---|
202 | .p-datatable .p-row-editor-save,
|
---|
203 | .p-datatable .p-row-editor-cancel {
|
---|
204 | display: inline-flex;
|
---|
205 | align-items: center;
|
---|
206 | justify-content: center;
|
---|
207 | overflow: hidden;
|
---|
208 | position: relative;
|
---|
209 | }
|
---|
210 |
|
---|
211 | /* Expand */
|
---|
212 | .p-datatable .p-row-toggler {
|
---|
213 | display: inline-flex;
|
---|
214 | align-items: center;
|
---|
215 | justify-content: center;
|
---|
216 | overflow: hidden;
|
---|
217 | position: relative;
|
---|
218 | }
|
---|
219 |
|
---|
220 | /* Reorder */
|
---|
221 | .p-datatable-reorder-indicator-up,
|
---|
222 | .p-datatable-reorder-indicator-down {
|
---|
223 | position: absolute;
|
---|
224 | display: none;
|
---|
225 | }
|
---|
226 |
|
---|
227 | .p-datatable-reorderablerow-handle {
|
---|
228 | cursor: move;
|
---|
229 | }
|
---|
230 |
|
---|
231 | [pReorderableColumn] {
|
---|
232 | cursor: move;
|
---|
233 | }
|
---|
234 |
|
---|
235 | /* Loader */
|
---|
236 | .p-datatable .p-datatable-loading-overlay {
|
---|
237 | position: absolute;
|
---|
238 | display: flex;
|
---|
239 | align-items: center;
|
---|
240 | justify-content: center;
|
---|
241 | z-index: 2;
|
---|
242 | }
|
---|
243 |
|
---|
244 | /* Filter */
|
---|
245 | .p-column-filter-row {
|
---|
246 | display: flex;
|
---|
247 | align-items: center;
|
---|
248 | width: 100%;
|
---|
249 | }
|
---|
250 |
|
---|
251 | .p-column-filter-menu {
|
---|
252 | display: inline-flex;
|
---|
253 | }
|
---|
254 |
|
---|
255 | .p-column-filter-row p-columnfilterformelement {
|
---|
256 | flex: 1 1 auto;
|
---|
257 | width: 1%;
|
---|
258 | }
|
---|
259 |
|
---|
260 | .p-column-filter-menu-button,
|
---|
261 | .p-column-filter-clear-button {
|
---|
262 | display: inline-flex;
|
---|
263 | justify-content: center;
|
---|
264 | align-items: center;
|
---|
265 | cursor: pointer;
|
---|
266 | text-decoration: none;
|
---|
267 | overflow: hidden;
|
---|
268 | position: relative;
|
---|
269 | }
|
---|
270 |
|
---|
271 | .p-column-filter-overlay {
|
---|
272 | position: absolute;
|
---|
273 | top: 0;
|
---|
274 | left: 0;
|
---|
275 | }
|
---|
276 |
|
---|
277 | .p-column-filter-row-items {
|
---|
278 | margin: 0;
|
---|
279 | padding: 0;
|
---|
280 | list-style: none;
|
---|
281 | }
|
---|
282 |
|
---|
283 | .p-column-filter-row-item {
|
---|
284 | cursor: pointer;
|
---|
285 | }
|
---|
286 |
|
---|
287 | .p-column-filter-add-button,
|
---|
288 | .p-column-filter-remove-button {
|
---|
289 | justify-content: center;
|
---|
290 | }
|
---|
291 |
|
---|
292 | .p-column-filter-add-button .p-button-label,
|
---|
293 | .p-column-filter-remove-button .p-button-label {
|
---|
294 | flex-grow: 0;
|
---|
295 | }
|
---|
296 |
|
---|
297 | .p-column-filter-buttonbar {
|
---|
298 | display: flex;
|
---|
299 | align-items: center;
|
---|
300 | justify-content: space-between;
|
---|
301 | }
|
---|
302 |
|
---|
303 | .p-column-filter-buttonbar .p-button {
|
---|
304 | width: auto;
|
---|
305 | }
|
---|
306 |
|
---|
307 | /* Responsive */
|
---|
308 | .p-datatable .p-datatable-tbody > tr > td > .p-column-title {
|
---|
309 | display: none;
|
---|
310 | }
|
---|
311 |
|
---|
312 | /* Virtual Scroll*/
|
---|
313 |
|
---|
314 | cdk-virtual-scroll-viewport {
|
---|
315 | outline: 0 none;
|
---|
316 | }
|
---|