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
|
@use "global-variables.scss";
@use "@patternfly/patternfly/utilities/Text/text.scss";
@use "@patternfly/patternfly/utilities/Spacing/spacing.scss";
@use "@patternfly/patternfly/utilities/Sizing/sizing.scss";
@use "@patternfly/patternfly/utilities/Flex/flex.scss";
.placeholder-text {
color: var(--pf-t--global--text--color--placeholder);
block-size: 2.25rem;
}
.wg-listen-port {
inline-size: 4.75rem;
}
.dynamic-form-group {
.pf-v6-c-empty-state {
padding: 0;
}
.pf-v6-c-form__field-group-body {
.pf-v6-c-form__group {
display: block;
}
.remove-button-group {
// Move 'Remove' button the the end of the row
grid-column: -1;
// Move 'Remove' button to the bottom of the line so as to align with the other form fields
display: flex;
flex-direction: row;
align-items: flex-end;
button {
margin: var(--pf-t--global--spacer--xs);
}
}
}
// We use FormFieldGroup PF component for the nested look and for ability to add buttons to the header
// However we want to save space and not add indent to the left so we need to override it
.pf-v6-c-form__field-group-body {
// Stretch content fully
--pf-v6-c-form__field-group-body--GridColumn: 1 / -1;
// Reduce padding at the top
--pf-v6-c-form__field-group-body--PaddingBlockStart: var(--pf-t--global--spacer--xs);
}
}
|
