@patternfly/patternfly 6.0.0-alpha.222 → 6.0.0-alpha.224

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/components/Banner/banner.css +2 -11
  2. package/components/Banner/banner.scss +2 -15
  3. package/components/Content/content.css +5 -3
  4. package/components/Content/content.scss +5 -3
  5. package/components/ExpandableSection/expandable-section.css +25 -84
  6. package/components/ExpandableSection/expandable-section.scss +24 -90
  7. package/components/Timestamp/timestamp.css +3 -1
  8. package/components/Timestamp/timestamp.scss +4 -1
  9. package/components/_index.css +35 -99
  10. package/docs/components/CodeBlock/examples/CodeBlock.md +33 -22
  11. package/docs/components/ExpandableSection/examples/ExpandableSection.md +96 -91
  12. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +62 -54
  13. package/docs/components/Timestamp/examples/Timestamp.md +7 -0
  14. package/package.json +5 -5
  15. package/patternfly-no-globals.css +35 -99
  16. package/patternfly.css +35 -99
  17. package/patternfly.min.css +1 -1
  18. package/patternfly.min.css.map +1 -1
package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md CHANGED
@@ -138,25 +138,25 @@ cssPrefix: pf-v6-c-multiple-file-upload
138
138
  </div>
139
139
  <div class="pf-v6-c-multiple-file-upload__status">
140
140
  <div class="pf-v6-c-expandable-section">
141
- <button
142
- type="button"
143
- class="pf-v6-c-expandable-section__toggle"
144
- aria-expanded="false"
145
- >
146
- <span class="pf-v6-c-expandable-section__toggle-icon">
147
- <i class="fas fa-angle-right" aria-hidden="true"></i>
148
- </span>
149
- <span class="pf-v6-c-expandable-section__toggle-text">
150
- <div class="pf-v6-c-multiple-file-upload__status-progress">
151
- <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
152
- <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
141
+ <div class="pf-v6-c-expandable-section__toggle">
142
+ <button class="pf-v6-c-button pf-m-link" type="button">
143
+ <span class="pf-v6-c-button__icon pf-m-start">
144
+ <span class="pf-v6-c-expandable-section__toggle-icon">
145
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
146
+ </span>
147
+ </span>
148
+ <span class="pf-v6-c-button__text">
149
+ <div class="pf-v6-c-multiple-file-upload__status-progress">
150
+ <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
151
+ <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
152
+ </div>
153
+ <div
154
+ class="pf-v6-c-multiple-file-upload__status-progress-text"
155
+ >0 of 3 files uploaded</div>
153
156
  </div>
154
- <div
155
- class="pf-v6-c-multiple-file-upload__status-progress-text"
156
- >0 of 3 files uploaded</div>
157
- </div>
158
- </span>
159
- </button>
157
+ </span>
158
+ </button>
159
+ </div>
160
160
  <div class="pf-v6-c-expandable-section__content" hidden>
161
161
  <ul class="pf-v6-c-multiple-file-upload__status-list" role="list">
162
162
  <li class="pf-v6-c-multiple-file-upload__status-item">
@@ -345,25 +345,29 @@ cssPrefix: pf-v6-c-multiple-file-upload
345
345
  </div>
346
346
  <div class="pf-v6-c-multiple-file-upload__status">
347
347
  <div class="pf-v6-c-expandable-section pf-m-expanded">
348
- <button
349
- type="button"
350
- class="pf-v6-c-expandable-section__toggle"
351
- aria-expanded="true"
352
- >
353
- <span class="pf-v6-c-expandable-section__toggle-icon">
354
- <i class="fas fa-angle-right" aria-hidden="true"></i>
355
- </span>
356
- <span class="pf-v6-c-expandable-section__toggle-text">
357
- <div class="pf-v6-c-multiple-file-upload__status-progress">
358
- <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
359
- <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
348
+ <div class="pf-v6-c-expandable-section__toggle">
349
+ <button
350
+ class="pf-v6-c-button pf-m-link"
351
+ type="button"
352
+ aria-expanded="true"
353
+ >
354
+ <span class="pf-v6-c-button__icon pf-m-start">
355
+ <span class="pf-v6-c-expandable-section__toggle-icon">
356
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
357
+ </span>
358
+ </span>
359
+ <span class="pf-v6-c-button__text">
360
+ <div class="pf-v6-c-multiple-file-upload__status-progress">
361
+ <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
362
+ <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
363
+ </div>
364
+ <div
365
+ class="pf-v6-c-multiple-file-upload__status-progress-text"
366
+ >0 of 3 files uploaded</div>
360
367
  </div>
361
- <div
362
- class="pf-v6-c-multiple-file-upload__status-progress-text"
363
- >0 of 3 files uploaded</div>
364
- </div>
365
- </span>
366
- </button>
368
+ </span>
369
+ </button>
370
+ </div>
367
371
  <div class="pf-v6-c-expandable-section__content">
368
372
  <ul class="pf-v6-c-multiple-file-upload__status-list" role="list">
369
373
  <li class="pf-v6-c-multiple-file-upload__status-item">
@@ -552,25 +556,29 @@ cssPrefix: pf-v6-c-multiple-file-upload
552
556
  </div>
553
557
  <div class="pf-v6-c-multiple-file-upload__status">
554
558
  <div class="pf-v6-c-expandable-section pf-m-expanded">
555
- <button
556
- type="button"
557
- class="pf-v6-c-expandable-section__toggle"
558
- aria-expanded="true"
559
- >
560
- <span class="pf-v6-c-expandable-section__toggle-icon">
561
- <i class="fas fa-angle-right" aria-hidden="true"></i>
562
- </span>
563
- <span class="pf-v6-c-expandable-section__toggle-text">
564
- <div class="pf-v6-c-multiple-file-upload__status-progress">
565
- <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
566
- <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
559
+ <div class="pf-v6-c-expandable-section__toggle">
560
+ <button
561
+ class="pf-v6-c-button pf-m-link"
562
+ type="button"
563
+ aria-expanded="true"
564
+ >
565
+ <span class="pf-v6-c-button__icon pf-m-start">
566
+ <span class="pf-v6-c-expandable-section__toggle-icon">
567
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
568
+ </span>
569
+ </span>
570
+ <span class="pf-v6-c-button__text">
571
+ <div class="pf-v6-c-multiple-file-upload__status-progress">
572
+ <div class="pf-v6-c-multiple-file-upload__status-progress-icon">
573
+ <i class="pf-v6-pficon pf-v6-pficon-in-progress"></i>
574
+ </div>
575
+ <div
576
+ class="pf-v6-c-multiple-file-upload__status-progress-text"
577
+ >0 of 3 files uploaded</div>
567
578
  </div>
568
- <div
569
- class="pf-v6-c-multiple-file-upload__status-progress-text"
570
- >0 of 3 files uploaded</div>
571
- </div>
572
- </span>
573
- </button>
579
+ </span>
580
+ </button>
581
+ </div>
574
582
  <div class="pf-v6-c-expandable-section__content">
575
583
  <ul class="pf-v6-c-multiple-file-upload__status-list" role="list">
576
584
  <li class="pf-v6-c-multiple-file-upload__status-item">
package/docs/components/Timestamp/examples/Timestamp.md CHANGED
@@ -48,6 +48,13 @@ cssPrefix: pf-v6-c-timestamp
48
48
  <time class="pf-v6-c-timestamp__text" datetime="2022-07-21">Tomorrow</time>
49
49
  </span>
50
50
 
51
+ <br />
52
+ <br />
53
+
54
+ <span class="pf-v6-c-timestamp pf-m-help-text">
55
+ <time class="pf-v6-c-timestamp__text" datetime="2022-07-21">Tomorrow</time>
56
+ </span>
57
+
51
58
  ```
52
59
 
53
60
  ## Documentation
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.0.0-alpha.222",
4
+ "version": "6.0.0-alpha.224",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -47,11 +47,11 @@
47
47
  "@commitlint/config-conventional": "^19.1.0",
48
48
  "@fortawesome/fontawesome": "^1.1.8",
49
49
  "@octokit/rest": "^20.1.0",
50
- "@patternfly/documentation-framework": "6.0.0-alpha.77",
50
+ "@patternfly/documentation-framework": "6.0.0-alpha.81",
51
51
  "@patternfly/patternfly-a11y": "4.3.1",
52
- "@patternfly/react-code-editor": "6.0.0-alpha.94",
53
- "@patternfly/react-core": "6.0.0-alpha.94",
54
- "@patternfly/react-table": "6.0.0-alpha.95",
52
+ "@patternfly/react-code-editor": "6.0.0-alpha.101",
53
+ "@patternfly/react-core": "6.0.0-alpha.101",
54
+ "@patternfly/react-table": "6.0.0-alpha.102",
55
55
  "@starptech/prettyhtml": "^0.10.0",
56
56
  "backstopjs": "^6.3.23",
57
57
  "cheerio": "^1.0.0-rc.12",
package/patternfly-no-globals.css CHANGED
@@ -7157,9 +7157,7 @@
7157
7157
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
7158
7158
  --pf-v6-c-banner--link--TextDecoration: underline;
7159
7159
  --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
7160
- --pf-v6-c-banner--link--hover--FontWeight: var(--pf-t--global--font--weight--body--bold);
7161
- --pf-v6-c-banner--link--disabled--Color: var(--pf-v6-c-banner--Color);
7162
- --pf-v6-c-banner--link--disabled--TextDecoration: none;
7160
+ --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
7163
7161
  --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
7164
7162
  --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
7165
7163
  --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -7271,25 +7269,18 @@
7271
7269
  }
7272
7270
  .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
7273
7271
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7274
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7275
7272
  }
7276
7273
  .pf-v6-c-banner a.pf-m-disabled {
7277
7274
  --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--disabled--Color);
7278
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7279
7275
  cursor: not-allowed;
7280
7276
  }
7281
7277
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
7282
7278
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-banner--link--Color);
7283
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7279
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
7284
7280
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
7285
7281
  text-decoration: var(--pf-v6-c-banner--link--TextDecoration);
7286
7282
  }
7287
- .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:hover {
7288
- --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
7289
- font-weight: var(--pf-v6-c-banner--link--hover--FontWeight);
7290
- }
7291
7283
  .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {
7292
- --pf-v6-c-banner--link--TextDecoration: var(--pf-v6-c-banner--link--disabled--TextDecoration);
7293
7284
  cursor: not-allowed;
7294
7285
  }
7295
7286
 
@@ -9061,8 +9052,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
9061
9052
  --pf-v6-c-content--list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9062
9053
  --pf-v6-c-content--list--nested--MarginBlockStart: var(--pf-v6-c-content--list--Gap);
9063
9054
  --pf-v6-c-content--ul--ListStyle: var(--pf-t--global--list-style);
9064
- --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--2xl);
9065
- --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--md);
9055
+ --pf-v6-c-content--dl--GridTemplateColumns--dt: 12ch;
9056
+ --pf-v6-c-content--dl--GridTemplateColumns--dd: 1fr;
9057
+ --pf-v6-c-content--dl--ColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
9058
+ --pf-v6-c-content--dl--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical);
9066
9059
  --pf-v6-c-content--dt--FontWeight: var(--pf-t--global--font--weight--body--bold);
9067
9060
  --pf-v6-c-content--dt--MarginBlockStart: var(--pf-t--global--spacer--md);
9068
9061
  --pf-v6-c-content--dt--sm--MarginBlockStart: 0;
@@ -9239,7 +9232,7 @@ ul) {
9239
9232
  }
9240
9233
  @media screen and (min-width: 36rem) {
9241
9234
  :is(.pf-v6-c-content--dl, .pf-v6-c-content dl) {
9242
- grid-template: auto/auto 1fr;
9235
+ grid-template: auto/var(--pf-v6-c-content--dl--GridTemplateColumns--dt) var(--pf-v6-c-content--dl--GridTemplateColumns--dd);
9243
9236
  grid-row-gap: var(--pf-v6-c-content--dl--RowGap);
9244
9237
  grid-column-gap: var(--pf-v6-c-content--dl--ColumnGap);
9245
9238
  }
@@ -12160,12 +12153,7 @@ ul) {
12160
12153
  }
12161
12154
 
12162
12155
  :where(:root, .pf-v6-c-expandable-section) {
12163
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12164
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12165
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12166
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12167
- --pf-v6-c-expandable-section__toggle--BackgroundColor: transparent;
12168
- --pf-v6-c-expandable-section__toggle--ColumnGap: calc(var(--pf-t--global--spacer--xs) + var(--pf-t--global--spacer--sm));
12156
+ --pf-v6-c-expandable-section--Gap: var(--pf-t--global--spacer--sm);
12169
12157
  --pf-v6-c-expandable-section__toggle-icon--MinWidth: 1em;
12170
12158
  --pf-v6-c-expandable-section__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
12171
12159
  --pf-v6-c-expandable-section__toggle-icon--Transition: .2s ease-in 0s;
@@ -12173,82 +12161,50 @@ ul) {
12173
12161
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: 0;
12174
12162
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate: 90deg;
12175
12163
  --pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate: -90deg;
12176
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-t--global--color--brand--default);
12177
- --pf-v6-c-expandable-section__toggle-text--hover--Color: var(--pf-t--global--color--brand--hover);
12178
- --pf-v6-c-expandable-section--m-expanded__toggle-text--Color: var(--pf-t--global--color--brand--hover);
12179
- --pf-v6-c-expandable-section__content--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12180
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
12181
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12182
- --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12183
12164
  --pf-v6-c-expandable-section__content--MaxWidth: auto;
12184
12165
  --pf-v6-c-expandable-section--m-limit-width__content--MaxWidth: 46.875rem;
12166
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12167
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12168
+ --pf-v6-c-expandable-section--m-display-lg--PaddingInlineStart: var(--pf-t--global--spacer--md);
12169
+ --pf-v6-c-expandable-section--m-display-lg--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12170
+ --pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12185
12171
  --pf-v6-c-expandable-section--m-display-lg--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
12172
+ --pf-v6-c-expandable-section--m-display-lg--BorderWidth: var(--pf-t--global--border--width--box--default);
12186
12173
  --pf-v6-c-expandable-section--m-display-lg--BorderColor: var(--pf-t--global--border--color--default);
12187
12174
  --pf-v6-c-expandable-section--m-display-lg--BorderRadius: var(--pf-t--global--border--radius--medium);
12188
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
12189
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
12190
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12191
- --pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineStart: var(--pf-t--global--spacer--lg);
12192
- --pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium);
12193
- --pf-v6-c-expandable-section--m-display-lg__toggle--Width: 100%;
12194
- --pf-v6-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
12195
- --pf-v6-c-expandable-section--m-display-lg__toggle--active--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
12196
- --pf-v6-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--hover);
12197
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
12198
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12199
- --pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart: var(--pf-t--global--spacer--lg);
12200
- --pf-v6-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius: var(--pf-t--global--border--radius--medium) var(--pf-t--global--border--radius--medium) 0 0;
12201
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base: calc(var(--pf-v6-c-expandable-section__toggle--ColumnGap) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
12202
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base) + var(--pf-v6-c-expandable-section__toggle--PaddingInlineStart));
12203
- --pf-v6-c-expandable-section--m-display-lg--m-indented__content--PaddingInlineStart: calc(var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart--base) + var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart));
12204
- --pf-v6-c-expandable-section--m-truncate--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12205
- --pf-v6-c-expandable-section--m-truncate--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12206
- --pf-v6-c-expandable-section--m-truncate--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12207
- --pf-v6-c-expandable-section--m-truncate--PaddingInlineStart: var(--pf-t--global--spacer--md);
12208
- --pf-v6-c-expandable-section--m-truncate__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12175
+ --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) + var(--pf-t--global--spacer--gap--text-to-element--default) + var(--pf-v6-c-expandable-section__toggle-icon--MinWidth));
12209
12176
  --pf-v6-c-expandable-section--m-truncate__content--LineClamp: 3;
12177
+ --pf-v6-c-expandable-section--m-truncate--Gap: var(--pf-t--global--spacer--xs);
12210
12178
  }
12211
12179
 
12180
+ .pf-v6-c-expandable-section {
12181
+ display: flex;
12182
+ flex-direction: column;
12183
+ gap: var(--pf-v6-c-expandable-section--Gap);
12184
+ align-items: start;
12185
+ }
12212
12186
  .pf-v6-c-expandable-section.pf-m-expanded {
12213
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-v6-c-expandable-section--m-expanded__toggle-text--Color);
12214
12187
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--Rotate);
12215
12188
  --pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-v6-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
12216
- --pf-v6-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
12217
- --pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius: var(--pf-v6-c-expandable-section--m-expanded--m-display-lg__toggle--BorderRadius);
12189
+ --pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg--m-expanded--PaddingBlockEnd);
12218
12190
  }
12219
12191
  .pf-v6-c-expandable-section.pf-m-limit-width {
12220
12192
  --pf-v6-c-expandable-section__content--MaxWidth: var(--pf-v6-c-expandable-section--m-limit-width__content--MaxWidth);
12221
12193
  }
12222
12194
  .pf-v6-c-expandable-section.pf-m-display-lg {
12223
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockStart);
12224
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineEnd);
12225
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingBlockEnd);
12226
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg__toggle--PaddingInlineStart);
12227
- --pf-v6-c-expandable-section__toggle--hover--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--hover--BackgroundColor);
12228
- --pf-v6-c-expandable-section__toggle--active--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--active--BackgroundColor);
12229
- --pf-v6-c-expandable-section__toggle--focus--BackgroundColor: var(--pf-v6-c-expandable-section--m-display-lg__toggle--focus--BackgroundColor);
12230
- --pf-v6-c-expandable-section__toggle--BorderRadius: var(--pf-v6-c-expandable-section--m-display-lg__toggle--BorderRadius);
12231
- --pf-v6-c-expandable-section__toggle--Width: var(--pf-v6-c-expandable-section--m-display-lg__toggle--Width);
12232
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineEnd);
12233
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingBlockEnd);
12234
- --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg__content--PaddingInlineStart);
12235
- --pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-display-lg--m-indented__content--PaddingInlineStart);
12195
+ padding-block-start: var(--pf-v6-c-expandable-section--m-display-lg--PaddingBlockStart);
12196
+ padding-block-end: var(--pf-v6-c-expandable-section--m-display-lg--PaddingBlockEnd);
12197
+ padding-inline-start: var(--pf-v6-c-expandable-section--m-display-lg--PaddingInlineStart);
12198
+ padding-inline-end: var(--pf-v6-c-expandable-section--m-display-lg--PaddingInlineEnd);
12236
12199
  background-color: var(--pf-v6-c-expandable-section--m-display-lg--BackgroundColor);
12237
- border: solid 1px var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
12200
+ border: var(--pf-v6-c-expandable-section--m-display-lg--BorderWidth) solid var(--pf-v6-c-expandable-section--m-display-lg--BorderColor);
12238
12201
  border-radius: var(--pf-v6-c-expandable-section--m-display-lg--BorderRadius);
12239
12202
  }
12240
12203
  .pf-v6-c-expandable-section.pf-m-indented {
12241
12204
  --pf-v6-c-expandable-section__content--PaddingInlineStart: var(--pf-v6-c-expandable-section--m-indented__content--PaddingInlineStart);
12242
12205
  }
12243
12206
  .pf-v6-c-expandable-section.pf-m-truncate {
12244
- --pf-v6-c-expandable-section__toggle--PaddingBlockStart: 0;
12245
- --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: 0;
12246
- --pf-v6-c-expandable-section__toggle--PaddingBlockEnd: var(--pf-v6-c-expandable-section--m-truncate__toggle--PaddingBlockEnd);
12247
- --pf-v6-c-expandable-section__toggle--PaddingInlineStart: 0;
12248
- --pf-v6-c-expandable-section__content--PaddingBlockStart: 0;
12249
- --pf-v6-c-expandable-section__content--PaddingInlineEnd: 0;
12250
- --pf-v6-c-expandable-section__content--PaddingBlockEnd: 0;
12251
- --pf-v6-c-expandable-section__content--PaddingInlineStart: 0;
12207
+ --pf-v6-c-expandable-section--Gap: var(--pf-v6-c-expandable-section--m-truncate--Gap);
12252
12208
  }
12253
12209
  .pf-v6-c-expandable-section.pf-m-truncate:not(.pf-m-expanded) .pf-v6-c-expandable-section__content {
12254
12210
  display: -webkit-box;
@@ -12257,24 +12213,8 @@ ul) {
12257
12213
  overflow: hidden;
12258
12214
  }
12259
12215
 
12260
- .pf-v6-c-expandable-section__toggle {
12261
- display: flex;
12262
- column-gap: var(--pf-v6-c-expandable-section__toggle--ColumnGap);
12263
- width: var(--pf-v6-c-expandable-section__toggle--Width, initial);
12264
- padding-block-start: var(--pf-v6-c-expandable-section__toggle--PaddingBlockStart);
12265
- padding-block-end: var(--pf-v6-c-expandable-section__toggle--PaddingBlockEnd);
12266
- padding-inline-start: var(--pf-v6-c-expandable-section__toggle--PaddingInlineStart);
12267
- padding-inline-end: var(--pf-v6-c-expandable-section__toggle--PaddingInlineEnd);
12268
- background-color: var(--pf-v6-c-expandable-section__toggle--BackgroundColor);
12269
- border: none;
12270
- border-radius: var(--pf-v6-c-expandable-section__toggle--BorderRadius, 0);
12271
- }
12272
- .pf-v6-c-expandable-section__toggle:is(:hover, :focus) {
12273
- --pf-v6-c-expandable-section__toggle-text--Color: var(--pf-v6-c-expandable-section__toggle-text--hover--Color);
12274
- --pf-v6-c-expandable-section__toggle--BackgroundColor: var(--pf-v6-c-expandable-section__toggle--hover--BackgroundColor, initial);
12275
- }
12276
-
12277
12216
  .pf-v6-c-expandable-section__toggle-icon {
12217
+ display: inline-block;
12278
12218
  min-width: var(--pf-v6-c-expandable-section__toggle-icon--MinWidth);
12279
12219
  color: var(--pf-v6-c-expandable-section__toggle-icon--Color);
12280
12220
  transition: var(--pf-v6-c-expandable-section__toggle-icon--Transition);
@@ -12288,16 +12228,10 @@ ul) {
12288
12228
  --pf-v6-c-expandable-section__toggle-icon--Rotate: var(--pf-v6-c-expandable-section__toggle-icon--m-expand-top--Rotate);
12289
12229
  }
12290
12230
 
12291
- .pf-v6-c-expandable-section__toggle-text {
12292
- color: var(--pf-v6-c-expandable-section__toggle-text--Color);
12293
- }
12294
-
12295
12231
  .pf-v6-c-expandable-section__content {
12296
12232
  max-width: var(--pf-v6-c-expandable-section__content--MaxWidth);
12297
- padding-block-start: var(--pf-v6-c-expandable-section__content--PaddingBlockStart);
12298
- padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd);
12299
- padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart);
12300
- padding-inline-end: var(--pf-v6-c-expandable-section__content--PaddingInlineEnd);
12233
+ padding-block-end: var(--pf-v6-c-expandable-section__content--PaddingBlockEnd, 0);
12234
+ padding-inline-start: var(--pf-v6-c-expandable-section__content--PaddingInlineStart, 0);
12301
12235
  }
12302
12236
 
12303
12237
  :where(:root, .pf-v6-c-file-upload) {
@@ -25079,11 +25013,12 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25079
25013
 
25080
25014
  :where(:root, .pf-v6-c-timestamp) {
25081
25015
  --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
25082
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
25016
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--regular);
25083
25017
  --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
25084
25018
  --pf-v6-c-timestamp--m-help-text--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--default);
25085
25019
  --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--default);
25086
25020
  --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
25021
+ --pf-v6-c-timestamp--m-help-text--Color: var(--pf-t--global--text--color--subtle);
25087
25022
  --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
25088
25023
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationLine: var(--pf-t--global--text-decoration--help-text--line--hover);
25089
25024
  --pf-v6-c-timestamp--m-help-text--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--help-text--style--hover);
@@ -25096,6 +25031,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25096
25031
  outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
25097
25032
  }
25098
25033
  .pf-v6-c-timestamp.pf-m-help-text {
25034
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--Color);
25099
25035
  text-decoration: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine) var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
25100
25036
  text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
25101
25037
  cursor: pointer;