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

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