@patternfly/patternfly 4.209.0 → 4.210.1

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.
@@ -274,7 +274,7 @@
274
274
  --pf-global--palette--black-800: #1b1d21;
275
275
  --pf-global--palette--black-900: #0f1214;
276
276
  --pf-global--palette--red-9999: #fe5142;
277
- --pf-global--palette--red-8888: #fe6a5d;
277
+ --pf-global--palette--red-8888: #ff7468;
278
278
  --pf-global--palette--blue-300: #1fa7f8;
279
279
  --pf-global--BackgroundColor--100: #1b1d21;
280
280
  --pf-global--BackgroundColor--150: #212427;
@@ -294,7 +294,7 @@
294
294
  --pf-global--warning-color--100: #f0ab00;
295
295
  --pf-global--warning-color--200: #f4c145;
296
296
  --pf-global--danger-color--100: #fe5142;
297
- --pf-global--danger-color--200: #fe6a5d;
297
+ --pf-global--danger-color--200: #ff7468;
298
298
  --pf-global--link--Color: #1fa7f8;
299
299
  --pf-global--link--Color--hover: #73bcf7;
300
300
  --pf-global--link--Color--visited: #a18fff;
@@ -506,6 +506,10 @@
506
506
  --pf-c-button--m-tertiary--focus--Color: var(--pf-global--palette--black-100);
507
507
  --pf-c-button--m-tertiary--active--after--BorderColor: var(--pf-global--BorderColor--100);
508
508
  --pf-c-button--m-tertiary--active--Color: var(--pf-global--palette--black-100);
509
+ --pf-c-button--m-warning--Color: var(--pf-global--palette--black-900);
510
+ --pf-c-button--m-warning--hover--Color: var(--pf-global--palette--black-900);
511
+ --pf-c-button--m-warning--focus--Color: var(--pf-global--palette--black-900);
512
+ --pf-c-button--m-warning--active--Color: var(--pf-global--palette--black-900);
509
513
  --pf-c-button--m-warning--hover--BackgroundColor: var(--pf-global--warning-color--200);
510
514
  --pf-c-button--m-warning--focus--BackgroundColor: var(--pf-global--warning-color--200);
511
515
  --pf-c-button--m-warning--active--BackgroundColor: var(--pf-global--warning-color--200);
@@ -12,6 +12,10 @@
12
12
  --pf-c-button--m-tertiary--focus--Color: var(--pf-global--palette--black-100);
13
13
  --pf-c-button--m-tertiary--active--after--BorderColor: var(--pf-global--BorderColor--100);
14
14
  --pf-c-button--m-tertiary--active--Color: var(--pf-global--palette--black-100);
15
+ --pf-c-button--m-warning--Color: var(--pf-global--palette--black-900);
16
+ --pf-c-button--m-warning--hover--Color: var(--pf-global--palette--black-900);
17
+ --pf-c-button--m-warning--focus--Color: var(--pf-global--palette--black-900);
18
+ --pf-c-button--m-warning--active--Color: var(--pf-global--palette--black-900);
15
19
  --pf-c-button--m-warning--hover--BackgroundColor: var(--pf-global--warning-color--200);
16
20
  --pf-c-button--m-warning--focus--BackgroundColor: var(--pf-global--warning-color--200);
17
21
  --pf-c-button--m-warning--active--BackgroundColor: var(--pf-global--warning-color--200);
@@ -85,6 +85,9 @@
85
85
  -webkit-line-clamp: var(--pf-c-expandable-section--m-truncate__content--LineClamp);
86
86
  overflow: hidden;
87
87
  }
88
+ .pf-c-expandable-section.pf-m-detached {
89
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: 0;
90
+ }
88
91
 
89
92
  .pf-c-expandable-section__toggle {
90
93
  display: flex;
@@ -112,6 +112,10 @@
112
112
  overflow: hidden;
113
113
  }
114
114
  }
115
+
116
+ &.pf-m-detached {
117
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: 0;
118
+ }
115
119
  }
116
120
 
117
121
  .pf-c-expandable-section__toggle {
@@ -1,6 +1,7 @@
1
1
  .pf-c-timestamp {
2
2
  --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
3
3
  --pf-c-timestamp--Color: var(--pf-global--Color--200);
4
+ --pf-c-timestamp--OutlineOffset: 0.1875rem;
4
5
  --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
5
6
  --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
6
7
  --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
@@ -10,8 +11,10 @@
10
11
  --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
11
12
  --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
12
13
  --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
14
+ display: inline-block;
13
15
  font-size: var(--pf-c-timestamp--FontSize);
14
16
  color: var(--pf-c-timestamp--Color);
17
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
15
18
  }
16
19
  .pf-c-timestamp.pf-m-help-text {
17
20
  cursor: pointer;
@@ -1,6 +1,7 @@
1
1
  .pf-c-timestamp {
2
2
  --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
3
3
  --pf-c-timestamp--Color: var(--pf-global--Color--200);
4
+ --pf-c-timestamp--OutlineOffset: #{pf-size-prem(3px)};
4
5
 
5
6
  // Help text variables for the timestamp
6
7
  --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
@@ -13,8 +14,10 @@
13
14
  --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
14
15
  --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
15
16
 
17
+ display: inline-block;
16
18
  font-size: var(--pf-c-timestamp--FontSize);
17
19
  color: var(--pf-c-timestamp--Color);
20
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
18
21
 
19
22
  &.pf-m-help-text {
20
23
  cursor: pointer;
@@ -478,7 +478,7 @@ When a list item includes more than one block of content, it can be difficult fo
478
478
  <section
479
479
  class="pf-c-data-list__expandable-content"
480
480
  id="data-list-expandable-content1"
481
- aria-label="data-list-expandable Primary content details"
481
+ aria-label="Expandable primary content details"
482
482
  >
483
483
  <div
484
484
  class="pf-c-data-list__expandable-content-body"
@@ -570,7 +570,7 @@ When a list item includes more than one block of content, it can be difficult fo
570
570
  <section
571
571
  class="pf-c-data-list__expandable-content"
572
572
  id="data-list-expandable-content2"
573
- aria-label="Secondary content details"
573
+ aria-label="Expandable secondary content details"
574
574
  hidden
575
575
  >
576
576
  <div
@@ -666,7 +666,7 @@ When a list item includes more than one block of content, it can be difficult fo
666
666
  <section
667
667
  class="pf-c-data-list__expandable-content"
668
668
  id="data-list-expandable-content3"
669
- aria-label="Tertiary content details"
669
+ aria-label="Expandable tertiary content details"
670
670
  >
671
671
  <div
672
672
  class="pf-c-data-list__expandable-content-body pf-m-no-padding"
@@ -774,7 +774,7 @@ When a list item includes more than one block of content, it can be difficult fo
774
774
  <section
775
775
  class="pf-c-data-list__expandable-content"
776
776
  id="data-list-expandable-compact-content1"
777
- aria-label="data-list-expandable-compact Primary content details"
777
+ aria-label="Expandable compact primary content details"
778
778
  >
779
779
  <div
780
780
  class="pf-c-data-list__expandable-content-body"
@@ -869,7 +869,7 @@ When a list item includes more than one block of content, it can be difficult fo
869
869
  <section
870
870
  class="pf-c-data-list__expandable-content"
871
871
  id="data-list-expandable-compact-content2"
872
- aria-label="Secondary content details"
872
+ aria-label="Expandable compact secondary content details"
873
873
  hidden
874
874
  >
875
875
  <div
@@ -965,7 +965,7 @@ When a list item includes more than one block of content, it can be difficult fo
965
965
  <section
966
966
  class="pf-c-data-list__expandable-content"
967
967
  id="data-list-expandable-compact-content3"
968
- aria-label="Tertiary content details"
968
+ aria-label="Expandable compact tertiary content details"
969
969
  >
970
970
  <div
971
971
  class="pf-c-data-list__expandable-content-body pf-m-no-padding"
@@ -1073,7 +1073,7 @@ When a list item includes more than one block of content, it can be difficult fo
1073
1073
  <section
1074
1074
  class="pf-c-data-list__expandable-content"
1075
1075
  id="data-list-expandable-nested-content1"
1076
- aria-label="data-list-expandable-nested Primary content details"
1076
+ aria-label="Expandable nested primary content details"
1077
1077
  >
1078
1078
  <div class="pf-c-data-list__expandable-content-body">
1079
1079
  <ul
@@ -1294,7 +1294,7 @@ When a list item includes more than one block of content, it can be difficult fo
1294
1294
  <section
1295
1295
  class="pf-c-data-list__expandable-content"
1296
1296
  id="data-list-expandable-nested-content2"
1297
- aria-label="Secondary content details"
1297
+ aria-label="Expandable nested secondary content details"
1298
1298
  hidden
1299
1299
  >
1300
1300
  <div
@@ -1390,7 +1390,7 @@ When a list item includes more than one block of content, it can be difficult fo
1390
1390
  <section
1391
1391
  class="pf-c-data-list__expandable-content"
1392
1392
  id="data-list-expandable-nested-content3"
1393
- aria-label="Tertiary content details"
1393
+ aria-label="Expandable nested tertiary content details"
1394
1394
  >
1395
1395
  <div
1396
1396
  class="pf-c-data-list__expandable-content-body pf-m-no-padding"
@@ -1899,7 +1899,7 @@ When a list item includes more than one block of content, it can be difficult fo
1899
1899
  <section
1900
1900
  class="pf-c-data-list__expandable-content"
1901
1901
  id="data-list-flex-modifiers-2-content1"
1902
- aria-label="data-list-flex-modifiers-2 Primary content details"
1902
+ aria-label="Flex modifier expandable primary content details"
1903
1903
  >
1904
1904
  <div
1905
1905
  class="pf-c-data-list__expandable-content-body"
@@ -2034,7 +2034,7 @@ When a list item includes more than one block of content, it can be difficult fo
2034
2034
  <section
2035
2035
  class="pf-c-data-list__expandable-content"
2036
2036
  id="data-list-selectable-expandable-rows-content1"
2037
- aria-label="data-list-selectable-expandable-rows Primary content details"
2037
+ aria-label="Selectable expandable row primary content details"
2038
2038
  >
2039
2039
  <div
2040
2040
  class="pf-c-data-list__expandable-content-body"
@@ -2076,7 +2076,7 @@ When a list item includes more than one block of content, it can be difficult fo
2076
2076
  <section
2077
2077
  class="pf-c-data-list__expandable-content"
2078
2078
  id="data-list-selectable-expandable-rows-content2"
2079
- aria-label="Secondary content details"
2079
+ aria-label="Selectable expandable row secondary content details"
2080
2080
  hidden
2081
2081
  >
2082
2082
  <div
@@ -2119,7 +2119,7 @@ When a list item includes more than one block of content, it can be difficult fo
2119
2119
  <section
2120
2120
  class="pf-c-data-list__expandable-content"
2121
2121
  id="data-list-selectable-expandable-rows-content3"
2122
- aria-label="Tertiary content details"
2122
+ aria-label="Selectable expandable row tertiary content details"
2123
2123
  >
2124
2124
  <div
2125
2125
  class="pf-c-data-list__expandable-content-body pf-m-no-padding"
@@ -2161,7 +2161,7 @@ When a list item includes more than one block of content, it can be difficult fo
2161
2161
  <section
2162
2162
  class="pf-c-data-list__expandable-content"
2163
2163
  id="data-list-selectable-expandable-rows-content4"
2164
- aria-label="Quaternary content details"
2164
+ aria-label="Selectable expandable row quaternary content details"
2165
2165
  hidden
2166
2166
  >
2167
2167
  <div
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": "4.209.0",
4
+ "version": "4.210.1",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -35,8 +35,8 @@
35
35
  "@octokit/rest": "^16.40.1",
36
36
  "@patternfly/patternfly-a11y": "4.3.1",
37
37
  "@patternfly/react-charts": "6.84.8",
38
- "@patternfly/react-code-editor": "4.65.1",
39
- "@patternfly/react-table": "4.93.1",
38
+ "@patternfly/react-code-editor": "4.72.8",
39
+ "@patternfly/react-table": "4.100.8",
40
40
  "@starptech/prettyhtml": "^0.10.0",
41
41
  "babel-eslint": "^8.2.3",
42
42
  "cheerio": "^1.0.0-rc.3",
@@ -315,7 +315,7 @@
315
315
  --pf-global--palette--black-800: #1b1d21;
316
316
  --pf-global--palette--black-900: #0f1214;
317
317
  --pf-global--palette--red-9999: #fe5142;
318
- --pf-global--palette--red-8888: #fe6a5d;
318
+ --pf-global--palette--red-8888: #ff7468;
319
319
  --pf-global--palette--blue-300: #1fa7f8;
320
320
  --pf-global--BackgroundColor--100: #1b1d21;
321
321
  --pf-global--BackgroundColor--150: #212427;
@@ -335,7 +335,7 @@
335
335
  --pf-global--warning-color--100: #f0ab00;
336
336
  --pf-global--warning-color--200: #f4c145;
337
337
  --pf-global--danger-color--100: #fe5142;
338
- --pf-global--danger-color--200: #fe6a5d;
338
+ --pf-global--danger-color--200: #ff7468;
339
339
  --pf-global--link--Color: #1fa7f8;
340
340
  --pf-global--link--Color--hover: #73bcf7;
341
341
  --pf-global--link--Color--visited: #a18fff;
@@ -315,7 +315,7 @@
315
315
  --pf-global--palette--black-800: #1b1d21;
316
316
  --pf-global--palette--black-900: #0f1214;
317
317
  --pf-global--palette--red-9999: #fe5142;
318
- --pf-global--palette--red-8888: #fe6a5d;
318
+ --pf-global--palette--red-8888: #ff7468;
319
319
  --pf-global--palette--blue-300: #1fa7f8;
320
320
  --pf-global--BackgroundColor--100: #1b1d21;
321
321
  --pf-global--BackgroundColor--150: #212427;
@@ -335,7 +335,7 @@
335
335
  --pf-global--warning-color--100: #f0ab00;
336
336
  --pf-global--warning-color--200: #f4c145;
337
337
  --pf-global--danger-color--100: #fe5142;
338
- --pf-global--danger-color--200: #fe6a5d;
338
+ --pf-global--danger-color--200: #ff7468;
339
339
  --pf-global--link--Color: #1fa7f8;
340
340
  --pf-global--link--Color--hover: #73bcf7;
341
341
  --pf-global--link--Color--visited: #a18fff;
@@ -424,7 +424,7 @@
424
424
  --pf-global--palette--black-800: #1b1d21;
425
425
  --pf-global--palette--black-900: #0f1214;
426
426
  --pf-global--palette--red-9999: #fe5142;
427
- --pf-global--palette--red-8888: #fe6a5d;
427
+ --pf-global--palette--red-8888: #ff7468;
428
428
  --pf-global--palette--blue-300: #1fa7f8;
429
429
  --pf-global--BackgroundColor--100: #1b1d21;
430
430
  --pf-global--BackgroundColor--150: #212427;
@@ -444,7 +444,7 @@
444
444
  --pf-global--warning-color--100: #f0ab00;
445
445
  --pf-global--warning-color--200: #f4c145;
446
446
  --pf-global--danger-color--100: #fe5142;
447
- --pf-global--danger-color--200: #fe6a5d;
447
+ --pf-global--danger-color--200: #ff7468;
448
448
  --pf-global--link--Color: #1fa7f8;
449
449
  --pf-global--link--Color--hover: #73bcf7;
450
450
  --pf-global--link--Color--visited: #a18fff;
@@ -7902,6 +7902,10 @@ button.pf-c-breadcrumb__link {
7902
7902
  --pf-c-button--m-tertiary--focus--Color: var(--pf-global--palette--black-100);
7903
7903
  --pf-c-button--m-tertiary--active--after--BorderColor: var(--pf-global--BorderColor--100);
7904
7904
  --pf-c-button--m-tertiary--active--Color: var(--pf-global--palette--black-100);
7905
+ --pf-c-button--m-warning--Color: var(--pf-global--palette--black-900);
7906
+ --pf-c-button--m-warning--hover--Color: var(--pf-global--palette--black-900);
7907
+ --pf-c-button--m-warning--focus--Color: var(--pf-global--palette--black-900);
7908
+ --pf-c-button--m-warning--active--Color: var(--pf-global--palette--black-900);
7905
7909
  --pf-c-button--m-warning--hover--BackgroundColor: var(--pf-global--warning-color--200);
7906
7910
  --pf-c-button--m-warning--focus--BackgroundColor: var(--pf-global--warning-color--200);
7907
7911
  --pf-c-button--m-warning--active--BackgroundColor: var(--pf-global--warning-color--200);
@@ -14598,6 +14602,9 @@ label.pf-c-check, .pf-c-check__label,
14598
14602
  -webkit-line-clamp: var(--pf-c-expandable-section--m-truncate__content--LineClamp);
14599
14603
  overflow: hidden;
14600
14604
  }
14605
+ .pf-c-expandable-section.pf-m-detached {
14606
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: 0;
14607
+ }
14601
14608
 
14602
14609
  .pf-c-expandable-section__toggle {
14603
14610
  display: flex;
@@ -30850,6 +30857,7 @@ svg.pf-c-spinner.pf-m-xl {
30850
30857
  .pf-c-timestamp {
30851
30858
  --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
30852
30859
  --pf-c-timestamp--Color: var(--pf-global--Color--200);
30860
+ --pf-c-timestamp--OutlineOffset: 0.1875rem;
30853
30861
  --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
30854
30862
  --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
30855
30863
  --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
@@ -30859,8 +30867,10 @@ svg.pf-c-spinner.pf-m-xl {
30859
30867
  --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
30860
30868
  --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
30861
30869
  --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
30870
+ display: inline-block;
30862
30871
  font-size: var(--pf-c-timestamp--FontSize);
30863
30872
  color: var(--pf-c-timestamp--Color);
30873
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
30864
30874
  }
30865
30875
  .pf-c-timestamp.pf-m-help-text {
30866
30876
  cursor: pointer;
package/patternfly.css CHANGED
@@ -424,7 +424,7 @@
424
424
  --pf-global--palette--black-800: #1b1d21;
425
425
  --pf-global--palette--black-900: #0f1214;
426
426
  --pf-global--palette--red-9999: #fe5142;
427
- --pf-global--palette--red-8888: #fe6a5d;
427
+ --pf-global--palette--red-8888: #ff7468;
428
428
  --pf-global--palette--blue-300: #1fa7f8;
429
429
  --pf-global--BackgroundColor--100: #1b1d21;
430
430
  --pf-global--BackgroundColor--150: #212427;
@@ -444,7 +444,7 @@
444
444
  --pf-global--warning-color--100: #f0ab00;
445
445
  --pf-global--warning-color--200: #f4c145;
446
446
  --pf-global--danger-color--100: #fe5142;
447
- --pf-global--danger-color--200: #fe6a5d;
447
+ --pf-global--danger-color--200: #ff7468;
448
448
  --pf-global--link--Color: #1fa7f8;
449
449
  --pf-global--link--Color--hover: #73bcf7;
450
450
  --pf-global--link--Color--visited: #a18fff;
@@ -8029,6 +8029,10 @@ button.pf-c-breadcrumb__link {
8029
8029
  --pf-c-button--m-tertiary--focus--Color: var(--pf-global--palette--black-100);
8030
8030
  --pf-c-button--m-tertiary--active--after--BorderColor: var(--pf-global--BorderColor--100);
8031
8031
  --pf-c-button--m-tertiary--active--Color: var(--pf-global--palette--black-100);
8032
+ --pf-c-button--m-warning--Color: var(--pf-global--palette--black-900);
8033
+ --pf-c-button--m-warning--hover--Color: var(--pf-global--palette--black-900);
8034
+ --pf-c-button--m-warning--focus--Color: var(--pf-global--palette--black-900);
8035
+ --pf-c-button--m-warning--active--Color: var(--pf-global--palette--black-900);
8032
8036
  --pf-c-button--m-warning--hover--BackgroundColor: var(--pf-global--warning-color--200);
8033
8037
  --pf-c-button--m-warning--focus--BackgroundColor: var(--pf-global--warning-color--200);
8034
8038
  --pf-c-button--m-warning--active--BackgroundColor: var(--pf-global--warning-color--200);
@@ -14725,6 +14729,9 @@ label.pf-c-check, .pf-c-check__label,
14725
14729
  -webkit-line-clamp: var(--pf-c-expandable-section--m-truncate__content--LineClamp);
14726
14730
  overflow: hidden;
14727
14731
  }
14732
+ .pf-c-expandable-section.pf-m-detached {
14733
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: 0;
14734
+ }
14728
14735
 
14729
14736
  .pf-c-expandable-section__toggle {
14730
14737
  display: flex;
@@ -30977,6 +30984,7 @@ svg.pf-c-spinner.pf-m-xl {
30977
30984
  .pf-c-timestamp {
30978
30985
  --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
30979
30986
  --pf-c-timestamp--Color: var(--pf-global--Color--200);
30987
+ --pf-c-timestamp--OutlineOffset: 0.1875rem;
30980
30988
  --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
30981
30989
  --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
30982
30990
  --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
@@ -30986,8 +30994,10 @@ svg.pf-c-spinner.pf-m-xl {
30986
30994
  --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
30987
30995
  --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
30988
30996
  --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
30997
+ display: inline-block;
30989
30998
  font-size: var(--pf-c-timestamp--FontSize);
30990
30999
  color: var(--pf-c-timestamp--Color);
31000
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
30991
31001
  }
30992
31002
  .pf-c-timestamp.pf-m-help-text {
30993
31003
  cursor: pointer;