@patternfly/patternfly 6.0.0-alpha.64 → 6.0.0-alpha.66

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 (11) hide show
  1. package/components/BackToTop/back-to-top.css +0 -1
  2. package/components/BackToTop/back-to-top.scss +0 -1
  3. package/components/MultipleFileUpload/multiple-file-upload.css +77 -50
  4. package/components/MultipleFileUpload/multiple-file-upload.scss +82 -53
  5. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  6. package/package.json +5 -5
  7. package/patternfly-no-globals.css +77 -51
  8. package/patternfly-theme-dark-unversioned.css +77 -51
  9. package/patternfly.css +77 -51
  10. package/patternfly.min.css +1 -1
  11. package/patternfly.min.css.map +1 -1
package/patternfly.css CHANGED
@@ -7561,7 +7561,6 @@ button) {
7561
7561
  }
7562
7562
  .pf-v5-c-back-to-top .pf-v5-c-button {
7563
7563
  --pf-v5-c-button--FontSize: var(--pf-v5-c-back-to-top--c-button--FontSize);
7564
- --pf-v5-c-button--BorderRadius: var(--pf-v5-c-back-to-top--c-button--BorderRadius);
7565
7564
  --pf-v5-c-button--PaddingTop: var(--pf-v5-c-back-to-top--c-button--PaddingTop);
7566
7565
  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-back-to-top--c-button--PaddingRight);
7567
7566
  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-back-to-top--c-button--PaddingBottom);
@@ -20918,9 +20917,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20918
20917
  }
20919
20918
  }
20920
20919
 
20921
- .pf-v5-c-multiple-file-upload {
20920
+ :root,
20921
+ :where(.pf-v5-c-multiple-file-upload) {
20922
20922
  --pf-v5-c-multiple-file-upload--GridTemplateColumns: 1fr;
20923
- --pf-v5-c-multiple-file-upload--Gap: var(--pf-v5-global--spacer--lg);
20923
+ --pf-v5-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
20924
20924
  --pf-v5-c-multiple-file-upload__main--TextAlign: center;
20925
20925
  --pf-v5-c-multiple-file-upload__main--GridTemplateColumns: auto;
20926
20926
  --pf-v5-c-multiple-file-upload__main--GridTemplateRows: auto;
@@ -20928,59 +20928,74 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20928
20928
  "title"
20929
20929
  "upload"
20930
20930
  "info";
20931
- --pf-v5-c-multiple-file-upload__main--Gap: var(--pf-v5-global--spacer--md);
20932
- --pf-v5-c-multiple-file-upload__main--PaddingTop: var(--pf-v5-global--spacer--lg);
20933
- --pf-v5-c-multiple-file-upload__main--PaddingRight: var(--pf-v5-global--spacer--lg);
20934
- --pf-v5-c-multiple-file-upload__main--PaddingBottom: var(--pf-v5-global--spacer--xl);
20935
- --pf-v5-c-multiple-file-upload__main--PaddingLeft: var(--pf-v5-global--spacer--lg);
20936
- --pf-v5-c-multiple-file-upload__main--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
20931
+ --pf-v5-c-multiple-file-upload__main--PaddingTop: var(--pf-t--global--spacer--xl);
20932
+ --pf-v5-c-multiple-file-upload__main--PaddingRight: var(--pf-t--global--spacer--xl);
20933
+ --pf-v5-c-multiple-file-upload__main--PaddingBottom: var(--pf-t--global--spacer--xl);
20934
+ --pf-v5-c-multiple-file-upload__main--PaddingLeft: var(--pf-t--global--spacer--xl);
20935
+ --pf-v5-c-multiple-file-upload__main--BorderWidth: var(--pf-t--global--border--width--regular);
20937
20936
  --pf-v5-c-multiple-file-upload__main--BorderStyle: dashed;
20938
- --pf-v5-c-multiple-file-upload__main--BorderColor: var(--pf-v5-global--BorderColor--100);
20939
- --pf-v5-c-multiple-file-upload__main--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
20937
+ --pf-v5-c-multiple-file-upload__main--BorderColor: var(--pf-t--global--border--color--default);
20938
+ --pf-v5-c-multiple-file-upload__main--BorderRadius: var(--pf-t--global--border--radius--medium);
20940
20939
  --pf-v5-c-multiple-file-upload__title--Display: grid;
20941
20940
  --pf-v5-c-multiple-file-upload__title--GridTemplateColumns: auto;
20942
- --pf-v5-c-multiple-file-upload__title--Gap: var(--pf-v5-global--spacer--sm);
20943
- --pf-v5-c-multiple-file-upload__title-icon--Color: var(--pf-v5-global--icon--Color--dark);
20941
+ --pf-v5-c-multiple-file-upload__title--Gap: var(--pf-t--global--spacer--lg);
20942
+ --pf-v5-c-multiple-file-upload__title-text--Color: var(--pf-t--global--text--color--regular);
20943
+ --pf-v5-c-multiple-file-upload__title-text--FontFamily: var(--pf-t--global--font--family--heading);
20944
+ --pf-v5-c-multiple-file-upload__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
20945
+ --pf-v5-c-multiple-file-upload__title-text--FontWeight: var(--pf-t--global--font--weight--heading);
20946
+ --pf-v5-c-multiple-file-upload__title-icon--Color: var(--pf-t--global--icon--color--regular);
20947
+ --pf-v5-c-multiple-file-upload__title-icon--FontSize: var(--pf-t--global--icon--size--xl);
20944
20948
  --pf-v5-c-multiple-file-upload__title-text-separator--Display: block;
20945
- --pf-v5-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-v5-global--spacer--sm);
20946
- --pf-v5-c-multiple-file-upload__info--FontSize: var(--pf-v5-global--FontSize--sm);
20947
- --pf-v5-c-multiple-file-upload__info--Color: var(--pf-v5-global--Color--200);
20948
- --pf-v5-c-multiple-file-upload__info--MarginTop: var(--pf-v5-global--spacer--sm);
20949
- --pf-v5-c-multiple-file-upload--m-drag-over__main--BorderStyle: solid;
20950
- --pf-v5-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-v5-global--active-color--100);
20951
- --pf-v5-c-multiple-file-upload--m-drag-over__main--BackgroundColor: var(--pf-v5-global--palette--blue-50);
20952
- --pf-v5-c-multiple-file-upload--m-drag-over__main__title-icon--Color: var(--pf-v5-global--active-color--100);
20953
- --pf-v5-c-multiple-file-upload--m-drag-over__main__title-text--Color: var(--pf-v5-global--active-color--100);
20954
- --pf-v5-c-multiple-file-upload--m-drag-over__main__info--Color: var(--pf-v5-global--active-color--100);
20949
+ --pf-v5-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-t--global--spacer--sm);
20950
+ --pf-v5-c-multiple-file-upload__title-text-separator--MarginBottom: var(--pf-t--global--spacer--sm);
20951
+ --pf-v5-c-multiple-file-upload__title-text-separator--Color: var(--pf-t--global--text--color--regular);
20952
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-t--global--font--family--body);
20953
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-t--global--font--size--body--lg);
20954
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-t--global--font--weight--body);
20955
+ --pf-v5-c-multiple-file-upload__info--FontSize: var(--pf-t--global--font--size--body--default);
20956
+ --pf-v5-c-multiple-file-upload__info--Color: var(--pf-t--global--text--color--subtle);
20957
+ --pf-v5-c-multiple-file-upload__info--MarginTop: var(--pf-t--global--spacer--lg);
20958
+ --pf-v5-c-multiple-file-upload--m-drag-over__main--BorderStyle: dashed;
20959
+ --pf-v5-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-t--global--border--color--clicked);
20955
20960
  --pf-v5-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
20956
20961
  --pf-v5-c-multiple-file-upload--m-horizontal__main--TextAlign: start;
20957
20962
  --pf-v5-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
20958
20963
  --pf-v5-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
20959
20964
  "title upload"
20960
20965
  "info upload";
20961
- --pf-v5-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-v5-global--spacer--sm) var(--pf-v5-global--spacer--2xl);
20962
- --pf-v5-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-v5-global--spacer--lg);
20966
+ --pf-v5-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--lg);
20967
+ --pf-v5-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-t--global--spacer--lg);
20963
20968
  --pf-v5-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
20964
- --pf-v5-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-v5-global--spacer--xs);
20969
+ --pf-v5-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-t--global--spacer--sm);
20970
+ --pf-v5-c-multiple-file-upload--m-horizontal__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
20971
+ --pf-v5-c-multiple-file-upload--m-horizontal__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
20965
20972
  --pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
20966
20973
  --pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
20974
+ --pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily: var(--pf-t--global--font--family--heading);
20975
+ --pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize: var(--pf-t--global--font--size--heading--xs);
20976
+ --pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight: var(--pf-t--global--font--weight--heading);
20967
20977
  --pf-v5-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
20978
+ --pf-v5-c-multiple-file-upload__status--PaddingTop: var(--pf-t--global--spacer--sm);
20979
+ --pf-v5-c-multiple-file-upload__status--PaddingBottom: var(--pf-t--global--spacer--sm);
20980
+ --pf-v5-c-multiple-file-upload__status--PaddingLeft: var(--pf-t--global--spacer--md);
20981
+ --pf-v5-c-multiple-file-upload__status--PaddingRight: var(--pf-t--global--spacer--md);
20968
20982
  --pf-v5-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
20969
- --pf-v5-c-multiple-file-upload__status-progress--Gap: var(--pf-v5-global--spacer--sm);
20970
- --pf-v5-c-multiple-file-upload__status-progress-icon--Color: var(--pf-v5-global--icon--Color--dark);
20971
- --pf-v5-c-multiple-file-upload__status-item--PaddingTop: var(--pf-v5-global--spacer--md);
20972
- --pf-v5-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-v5-global--spacer--md);
20973
- --pf-v5-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
20983
+ --pf-v5-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
20984
+ --pf-v5-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--regular);
20985
+ --pf-v5-c-multiple-file-upload__status-item--PaddingTop: var(--pf-t--global--spacer--md);
20986
+ --pf-v5-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-t--global--spacer--md);
20974
20987
  --pf-v5-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
20975
- --pf-v5-c-multiple-file-upload__status-item--Gap: var(--pf-v5-global--spacer--sm);
20976
- --pf-v5-c-multiple-file-upload__status-item--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
20977
- --pf-v5-c-multiple-file-upload__status-item--BorderColor: var(--pf-v5-global--BorderColor--100);
20978
- --pf-v5-c-multiple-file-upload__status-item-icon--Color: var(--pf-v5-global--icon--Color--dark);
20979
- --pf-v5-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
20988
+ --pf-v5-c-multiple-file-upload__status-item--Gap: var(--pf-t--global--spacer--sm);
20989
+ --pf-v5-c-multiple-file-upload__status-item--BorderWidth: var(--pf-t--global--border--width--regular);
20990
+ --pf-v5-c-multiple-file-upload__status-item--BorderColor: var(--pf-t--global--border--color--default);
20991
+ --pf-v5-c-multiple-file-upload__status-item-icon--Color: var(--pf-t--global--icon--color--regular);
20980
20992
  --pf-v5-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
20981
- --pf-v5-c-multiple-file-upload__status-item-progress--Gap: var(--pf-v5-global--spacer--sm);
20982
- --pf-v5-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-v5-global--primary-color--100);
20983
- --pf-v5-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-v5-global--Color--200);
20993
+ --pf-v5-c-multiple-file-upload__status-item-progress--Gap: var(--pf-t--global--spacer--sm);
20994
+ --pf-v5-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-t--global--text--color--regular);
20995
+ --pf-v5-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-t--global--text--color--subtle);
20996
+ }
20997
+
20998
+ .pf-v5-c-multiple-file-upload {
20984
20999
  display: grid;
20985
21000
  grid-template-columns: var(--pf-v5-c-multiple-file-upload--GridTemplateColumns);
20986
21001
  gap: var(--pf-v5-c-multiple-file-upload--Gap);
@@ -20994,17 +21009,18 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
20994
21009
  --pf-v5-c-multiple-file-upload__main--PaddingBottom: var(--pf-v5-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
20995
21010
  --pf-v5-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-v5-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
20996
21011
  --pf-v5-c-multiple-file-upload__title--Gap: var(--pf-v5-c-multiple-file-upload--m-horizontal__title--Gap);
21012
+ --pf-v5-c-multiple-file-upload__title-icon--FontSize: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-icon--FontSize);
21013
+ --pf-v5-c-multiple-file-upload__title-text--FontSize: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text--FontSize);
21014
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily);
20997
21015
  --pf-v5-c-multiple-file-upload__title-text-separator--Display: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
20998
21016
  --pf-v5-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
21017
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize);
21018
+ --pf-v5-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-v5-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight);
20999
21019
  --pf-v5-c-multiple-file-upload__info--MarginTop: var(--pf-v5-c-multiple-file-upload--m-horizontal__info--MarginTop);
21000
21020
  }
21001
21021
  .pf-v5-c-multiple-file-upload.pf-m-drag-over {
21002
21022
  --pf-v5-c-multiple-file-upload__main--BorderStyle: var(--pf-v5-c-multiple-file-upload--m-drag-over__main--BorderStyle);
21003
21023
  --pf-v5-c-multiple-file-upload__main--BorderColor: var(--pf-v5-c-multiple-file-upload--m-drag-over__main--BorderColor);
21004
- --pf-v5-c-multiple-file-upload__main--BackgroundColor: var(--pf-v5-c-multiple-file-upload--m-drag-over__main--BackgroundColor);
21005
- --pf-v5-c-multiple-file-upload__title-icon--Color: var(--pf-v5-c-multiple-file-upload--m-drag-over__main__title-icon--Color);
21006
- --pf-v5-c-multiple-file-upload__title-text--Color: var(--pf-v5-c-multiple-file-upload--m-drag-over__main__title-text--Color);
21007
- --pf-v5-c-multiple-file-upload__info--Color: var(--pf-v5-c-multiple-file-upload--m-drag-over__main__info--Color);
21008
21024
  }
21009
21025
 
21010
21026
  .pf-v5-c-multiple-file-upload__main {
@@ -21013,13 +21029,14 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21013
21029
  grid-template-rows: var(--pf-v5-c-multiple-file-upload__main--GridTemplateRows);
21014
21030
  grid-template-columns: var(--pf-v5-c-multiple-file-upload__main--GridTemplateColumns);
21015
21031
  gap: var(--pf-v5-c-multiple-file-upload__main--Gap);
21032
+ align-items: center;
21016
21033
  padding-block-start: var(--pf-v5-c-multiple-file-upload__main--PaddingTop);
21017
21034
  padding-block-end: var(--pf-v5-c-multiple-file-upload__main--PaddingBottom);
21018
21035
  padding-inline-start: var(--pf-v5-c-multiple-file-upload__main--PaddingLeft);
21019
21036
  padding-inline-end: var(--pf-v5-c-multiple-file-upload__main--PaddingRight);
21020
21037
  text-align: var(--pf-v5-c-multiple-file-upload__main--TextAlign);
21021
- background-color: var(--pf-v5-c-multiple-file-upload__main--BackgroundColor);
21022
21038
  border: var(--pf-v5-c-multiple-file-upload__main--BorderWidth) var(--pf-v5-c-multiple-file-upload__main--BorderStyle) var(--pf-v5-c-multiple-file-upload__main--BorderColor);
21039
+ border-radius: var(--pf-v5-c-multiple-file-upload__main--BorderRadius);
21023
21040
  }
21024
21041
 
21025
21042
  .pf-v5-c-multiple-file-upload__title {
@@ -21030,16 +21047,25 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21030
21047
  }
21031
21048
 
21032
21049
  .pf-v5-c-multiple-file-upload__title-icon {
21050
+ font-size: var(--pf-v5-c-multiple-file-upload__title-icon--FontSize);
21033
21051
  color: var(--pf-v5-c-multiple-file-upload__title-icon--Color);
21034
21052
  }
21035
21053
 
21036
21054
  .pf-v5-c-multiple-file-upload__title-text {
21055
+ font-family: var(--pf-v5-c-multiple-file-upload__title-text--FontFamily);
21056
+ font-size: var(--pf-v5-c-multiple-file-upload__title-text--FontSize);
21057
+ font-weight: var(--pf-v5-c-multiple-file-upload__title-text--FontWeight);
21037
21058
  color: var(--pf-v5-c-multiple-file-upload__title-text--Color, inherit);
21038
21059
  }
21039
21060
 
21040
21061
  .pf-v5-c-multiple-file-upload__title-text-separator {
21041
21062
  display: var(--pf-v5-c-multiple-file-upload__title-text-separator--Display);
21042
21063
  margin-block-start: var(--pf-v5-c-multiple-file-upload__title-text-separator--MarginTop);
21064
+ margin-block-end: var(--pf-v5-c-multiple-file-upload__title-text-separator--MarginBottom);
21065
+ font-family: var(--pf-v5-c-multiple-file-upload__title-text-separator--FontFamily);
21066
+ font-size: var(--pf-v5-c-multiple-file-upload__title-text-separator--FontSize);
21067
+ font-weight: var(--pf-v5-c-multiple-file-upload__title-text-separator--FontWeight);
21068
+ color: var(--pf-v5-c-multiple-file-upload__title-text-separator--Color);
21043
21069
  }
21044
21070
 
21045
21071
  .pf-v5-c-multiple-file-upload__upload {
@@ -21053,6 +21079,13 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21053
21079
  color: var(--pf-v5-c-multiple-file-upload__info--Color);
21054
21080
  }
21055
21081
 
21082
+ .pf-v5-c-multiple-file-upload__status {
21083
+ padding-block-start: var(--pf-v5-c-multiple-file-upload__status--PaddingTop);
21084
+ padding-block-end: var(--pf-v5-c-multiple-file-upload__status--PaddingBottom);
21085
+ padding-inline-start: var(--pf-v5-c-multiple-file-upload__status--PaddingLeft);
21086
+ padding-inline-end: var(--pf-v5-c-multiple-file-upload__status--PaddingRight);
21087
+ }
21088
+
21056
21089
  .pf-v5-c-multiple-file-upload__status,
21057
21090
  .pf-v5-c-multiple-file-upload__status-item-main {
21058
21091
  min-width: 0;
@@ -21076,18 +21109,11 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
21076
21109
  padding-block-end: var(--pf-v5-c-multiple-file-upload__status-item--PaddingBottom);
21077
21110
  border-block-end: var(--pf-v5-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-v5-c-multiple-file-upload__status-item--BorderColor);
21078
21111
  }
21079
- .pf-v5-c-multiple-file-upload__status-item:first-child {
21080
- --pf-v5-c-multiple-file-upload__status-item--PaddingTop: var(--pf-v5-c-multiple-file-upload__status-item--first-child--PaddingTop);
21081
- }
21082
21112
 
21083
21113
  .pf-v5-c-multiple-file-upload__status-item-icon {
21084
21114
  color: var(--pf-v5-c-multiple-file-upload__status-item-icon--Color);
21085
21115
  }
21086
21116
 
21087
- .pf-v5-c-multiple-file-upload__status-item-close {
21088
- margin-block-start: var(--pf-v5-c-multiple-file-upload__status-item-close--MarginTop);
21089
- }
21090
-
21091
21117
  .pf-v5-c-multiple-file-upload__status-item-progress {
21092
21118
  display: grid;
21093
21119
  grid-template-columns: var(--pf-v5-c-multiple-file-upload__status-item-progress--GridTemplateColumns);