blob: 6854ac148b4dd073ff894084d3912dc0458676d9 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
@import "global-variables";
.ct-table {
&.pf-m-compact {
> thead, > tbody {
> tr:not(.pf-v5-c-table__expandable-row) {
// We actually want the normal font size for our lists
--pf-v5-c-table-cell--FontSize: var(--pf-v5-global--FontSize--md);
}
}
}
&-header {
display: flex;
align-items: center;
flex-wrap: wrap;
> :only-child {
flex: auto;
}
}
&-heading {
// Push buttons to the right by stretching the heading
flex: auto;
// Add a bit of minimum margin to the right of the heading
margin-inline-end: var(--pf-v5-global--spacer--md);
// Set a minimum height of 3rem, so when buttons wrap, there's spacing
min-block-size: var(--pf-v5-global--spacer--2xl);
// Make sure textual content is aligned to the center
display: flex;
align-items: center;
}
&-actions {
> * {
margin-block: var(--pf-v5-global--spacer--xs);
margin-inline: var(--pf-v5-global--spacer--sm) 0;
}
> :first-child {
margin-inline-start: 0;
}
}
// https://github.com/patternfly/patternfly-react/issues/5379
&-empty {
[data-label] {
display: revert;
}
[data-label]::before {
display: none;
}
}
// Don't wrap labels
[data-label]::before {
white-space: nowrap;
}
// Fix toggle button alignment
.pf-v5-c-table__toggle {
// Workaround: Chrome sometimes oddly expands the table,
// unless a width is set. (This affects panels the most, but not only.)
// As the width is smaller than the contents, and this is a table,
// the cell will stay at the correct width.
inline-size: 1px;
}
// Properly align actions on the end
> tbody > tr > td:last-child > .btn-group {
display: flex;
justify-content: flex-end;
align-items: center;
}
// Use PF4 style headings
> thead th {
font-size: var(--pf-v5-global--FontSize--sm);
font-weight: var(--pf-v5-global--FontWeight--bold);
}
// Adjust the padding for nested ct-tables in ct-tables
// FIXME: https://github.com/patternfly/patternfly/issues/4280
.ct-table {
td, th {
&:first-child {
--pf-v5-c-table--nested--first-last-child--PaddingLeft: var(--pf-v5-global--spacer--lg);
}
&:last-child {
--pf-v5-c-table--nested--first-last-child--PaddingRight: var(--pf-v5-global--spacer--lg);
}
}
}
}
// Special handling for rows with errors
.pf-v5-c-table tbody tr:first-child.error {
&, tbody.pf-m-expanded > & {
background-color: var(--ct-color-list-critical-bg) !important; /* keep red background when expanded */
border-block-start: 1px solid var(--ct-color-list-critical-border);
border-block-end: 1px solid var(--ct-color-list-critical-border);
}
}
|
