@patternfly/patternfly 4.163.0 → 4.164.3

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.
@@ -13205,7 +13205,7 @@ label.pf-c-check, .pf-c-check__label,
13205
13205
  .pf-c-form.pf-m-horizontal.pf-m-align-right .pf-c-form__label {
13206
13206
  text-align: right;
13207
13207
  }
13208
- @media (min-width: 768px) {
13208
+ @media screen and (min-width: 768px) {
13209
13209
  .pf-c-form.pf-m-horizontal {
13210
13210
  --pf-c-form__group-label--PaddingBottom: 0;
13211
13211
  }
@@ -13225,6 +13225,126 @@ label.pf-c-check, .pf-c-check__label,
13225
13225
  grid-column: 2;
13226
13226
  }
13227
13227
  }
13228
+ @media screen and (min-width: 0) {
13229
+ .pf-c-form.pf-m-horizontal-on-xs {
13230
+ --pf-c-form__group-label--PaddingBottom: 0;
13231
+ }
13232
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group {
13233
+ display: grid;
13234
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13235
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13236
+ }
13237
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-label {
13238
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13239
+ }
13240
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-label.pf-m-no-padding-top {
13241
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13242
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13243
+ }
13244
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-control {
13245
+ grid-column: 2;
13246
+ }
13247
+ }
13248
+ @media (min-width: 576px) {
13249
+ .pf-c-form.pf-m-horizontal-on-sm {
13250
+ --pf-c-form__group-label--PaddingBottom: 0;
13251
+ }
13252
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group {
13253
+ display: grid;
13254
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13255
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13256
+ }
13257
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-label {
13258
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13259
+ }
13260
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-label.pf-m-no-padding-top {
13261
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13262
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13263
+ }
13264
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-control {
13265
+ grid-column: 2;
13266
+ }
13267
+ }
13268
+ @media (min-width: 768px) {
13269
+ .pf-c-form.pf-m-horizontal-on-md {
13270
+ --pf-c-form__group-label--PaddingBottom: 0;
13271
+ }
13272
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group {
13273
+ display: grid;
13274
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13275
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13276
+ }
13277
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-label {
13278
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13279
+ }
13280
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-label.pf-m-no-padding-top {
13281
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13282
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13283
+ }
13284
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-control {
13285
+ grid-column: 2;
13286
+ }
13287
+ }
13288
+ @media (min-width: 992px) {
13289
+ .pf-c-form.pf-m-horizontal-on-lg {
13290
+ --pf-c-form__group-label--PaddingBottom: 0;
13291
+ }
13292
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group {
13293
+ display: grid;
13294
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13295
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13296
+ }
13297
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-label {
13298
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13299
+ }
13300
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-label.pf-m-no-padding-top {
13301
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13302
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13303
+ }
13304
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-control {
13305
+ grid-column: 2;
13306
+ }
13307
+ }
13308
+ @media (min-width: 1200px) {
13309
+ .pf-c-form.pf-m-horizontal-on-xl {
13310
+ --pf-c-form__group-label--PaddingBottom: 0;
13311
+ }
13312
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group {
13313
+ display: grid;
13314
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13315
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13316
+ }
13317
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-label {
13318
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13319
+ }
13320
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-label.pf-m-no-padding-top {
13321
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13322
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13323
+ }
13324
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-control {
13325
+ grid-column: 2;
13326
+ }
13327
+ }
13328
+ @media (min-width: 1450px) {
13329
+ .pf-c-form.pf-m-horizontal-on-2xl {
13330
+ --pf-c-form__group-label--PaddingBottom: 0;
13331
+ }
13332
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group {
13333
+ display: grid;
13334
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13335
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13336
+ }
13337
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-label {
13338
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13339
+ }
13340
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-label.pf-m-no-padding-top {
13341
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13342
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13343
+ }
13344
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-control {
13345
+ grid-column: 2;
13346
+ }
13347
+ }
13228
13348
  .pf-c-form.pf-m-limit-width {
13229
13349
  max-width: var(--pf-c-form--m-limit-width--MaxWidth);
13230
13350
  }
@@ -14445,6 +14565,7 @@ label.pf-c-input-group__text {
14445
14565
  --pf-c-label--m-compact--PaddingBottom: 0;
14446
14566
  --pf-c-label--m-compact--PaddingLeft: var(--pf-global--spacer--sm);
14447
14567
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14568
+ --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14448
14569
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14449
14570
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14450
14571
  --pf-c-label__text--MaxWidth: 16ch;
@@ -14459,6 +14580,18 @@ label.pf-c-input-group__text {
14459
14580
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14460
14581
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14461
14582
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14583
+ --pf-c-label__editable-text--MaxWidth: 16ch;
14584
+ --pf-c-label__editable-text--BorderWidth: 0;
14585
+ --pf-c-label--m-editable--Cursor: pointer;
14586
+ --pf-c-label--m-editable--TextDecoration: underline;
14587
+ --pf-c-label--m-editable--TextDecorationStyle: dashed;
14588
+ --pf-c-label--m-editable--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
14589
+ --pf-c-label--m-editable--TextDecorationOffset: 0.25rem;
14590
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14591
+ --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14592
+ --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14593
+ --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14594
+ --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14462
14595
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
14463
14596
  --pf-c-label--m-editable--m-editable-active__content--before--BorderWidth: 0;
14464
14597
  --pf-c-label--m-editable--m-editable-active__content--before--BorderColor: transparent;
@@ -14477,6 +14610,7 @@ label.pf-c-input-group__text {
14477
14610
  --pf-c-label--PaddingBottom: var(--pf-c-label--m-compact--PaddingBottom);
14478
14611
  --pf-c-label--PaddingLeft: var(--pf-c-label--m-compact--PaddingLeft);
14479
14612
  --pf-c-label--FontSize: var(--pf-c-label--m-compact--FontSize);
14613
+ --pf-c-label--m-editable--TextDecorationOffset: var(--pf-c-label--m-compact--m-editable--TextDecorationOffset);
14480
14614
  }
14481
14615
  .pf-c-label.pf-m-blue {
14482
14616
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-blue--BackgroundColor);
@@ -14567,7 +14701,23 @@ label.pf-c-input-group__text {
14567
14701
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--link--focus--before--BorderColor);
14568
14702
  }
14569
14703
 
14704
+ .pf-c-label.pf-m-editable {
14705
+ text-decoration: var(--pf-c-label--m-editable--TextDecoration);
14706
+ cursor: var(--pf-c-label--m-editable--Cursor);
14707
+ text-decoration-style: var(--pf-c-label--m-editable--TextDecorationStyle);
14708
+ text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14709
+ text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14710
+ text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14711
+ }
14712
+ .pf-c-label.pf-m-editable:hover {
14713
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
14714
+ }
14715
+ .pf-c-label.pf-m-editable:focus {
14716
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--focus--TextDecorationColor);
14717
+ }
14570
14718
  .pf-c-label.pf-m-editable-active {
14719
+ --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14720
+ --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14571
14721
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14572
14722
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14573
14723
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
@@ -14575,6 +14725,13 @@ label.pf-c-input-group__text {
14575
14725
  .pf-c-label.pf-m-editable-active .pf-c-button {
14576
14726
  visibility: hidden;
14577
14727
  }
14728
+ .pf-c-label .pf-c-label__editable-text {
14729
+ overflow: hidden;
14730
+ text-overflow: ellipsis;
14731
+ white-space: nowrap;
14732
+ max-width: var(--pf-c-label__editable-text--MaxWidth);
14733
+ border-width: var(--pf-c-label__editable-text--BorderWidth);
14734
+ }
14578
14735
  .pf-c-label .pf-c-button {
14579
14736
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14580
14737
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -16862,6 +17019,187 @@ ul.pf-c-list {
16862
17019
  }
16863
17020
  }
16864
17021
 
17022
+ .pf-c-multiple-file-upload {
17023
+ --pf-c-multiple-file-upload--GridTemplateColumns: 1fr;
17024
+ --pf-c-multiple-file-upload--Gap: var(--pf-global--spacer--lg);
17025
+ --pf-c-multiple-file-upload__main--TextAlign: center;
17026
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: auto;
17027
+ --pf-c-multiple-file-upload__main--GridTemplateRows: auto;
17028
+ --pf-c-multiple-file-upload__main--GridTemplateAreas:
17029
+ "title"
17030
+ "upload"
17031
+ "info";
17032
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-global--spacer--md);
17033
+ --pf-c-multiple-file-upload__main--PaddingTop: var(--pf-global--spacer--lg);
17034
+ --pf-c-multiple-file-upload__main--PaddingRight: var(--pf-global--spacer--lg);
17035
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-global--spacer--xl);
17036
+ --pf-c-multiple-file-upload__main--PaddingLeft: var(--pf-global--spacer--lg);
17037
+ --pf-c-multiple-file-upload__main--BorderWidth: var(--pf-global--BorderWidth--sm);
17038
+ --pf-c-multiple-file-upload__main--BorderStyle: dashed;
17039
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-global--BorderColor--100);
17040
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-global--BackgroundColor--100);
17041
+ --pf-c-multiple-file-upload__title--Display: grid;
17042
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: auto;
17043
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-global--spacer--sm);
17044
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-global--Color--200);
17045
+ --pf-c-multiple-file-upload__title-text-separator--Display: block;
17046
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-global--spacer--sm);
17047
+ --pf-c-multiple-file-upload__info--FontSize: var(--pf-global--FontSize--sm);
17048
+ --pf-c-multiple-file-upload__info--Color: var(--pf-global--Color--200);
17049
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-global--spacer--sm);
17050
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderStyle: solid;
17051
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-global--active-color--100);
17052
+ --pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor: var(--pf-global--palette--blue-50);
17053
+ --pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color: var(--pf-global--active-color--100);
17054
+ --pf-c-multiple-file-upload--m-drag-over__main__title-text--Color: var(--pf-global--active-color--100);
17055
+ --pf-c-multiple-file-upload--m-drag-over__main__info--Color: var(--pf-global--active-color--100);
17056
+ --pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
17057
+ --pf-c-multiple-file-upload--m-horizontal__main--TextAlign: left;
17058
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
17059
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
17060
+ "title upload"
17061
+ "info upload";
17062
+ --pf-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-global--spacer--sm) var(--pf-global--spacer--2xl);
17063
+ --pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-global--spacer--lg);
17064
+ --pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
17065
+ --pf-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-global--spacer--xs);
17066
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
17067
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
17068
+ --pf-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
17069
+ --pf-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
17070
+ --pf-c-multiple-file-upload__status-progress--Gap: var(--pf-global--spacer--sm);
17071
+ --pf-c-multiple-file-upload__status-progress-icon--Color: var(--pf-global--Color--200);
17072
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-global--spacer--md);
17073
+ --pf-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-global--spacer--md);
17074
+ --pf-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
17075
+ --pf-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
17076
+ --pf-c-multiple-file-upload__status-item--Gap: var(--pf-global--spacer--sm);
17077
+ --pf-c-multiple-file-upload__status-item--BorderWidth: var(--pf-global--BorderWidth--sm);
17078
+ --pf-c-multiple-file-upload__status-item--BorderColor: var(--pf-global--BorderColor--100);
17079
+ --pf-c-multiple-file-upload__status-item-icon--Color: var(--pf-global--Color--200);
17080
+ --pf-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
17081
+ --pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
17082
+ --pf-c-multiple-file-upload__status-item-progress--Gap: var(--pf-global--spacer--sm);
17083
+ --pf-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-global--primary-color--100);
17084
+ --pf-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-global--Color--200);
17085
+ display: grid;
17086
+ gap: var(--pf-c-multiple-file-upload--Gap);
17087
+ grid-template-columns: var(--pf-c-multiple-file-upload--GridTemplateColumns);
17088
+ }
17089
+ .pf-c-multiple-file-upload.pf-m-horizontal {
17090
+ --pf-c-multiple-file-upload--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
17091
+ --pf-c-multiple-file-upload__main--TextAlign: var(--pf-c-multiple-file-upload--m-horizontal__main--TextAlign);
17092
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
17093
+ --pf-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
17094
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-c-multiple-file-upload--m-horizontal__main--Gap);
17095
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
17096
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
17097
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-c-multiple-file-upload--m-horizontal__title--Gap);
17098
+ --pf-c-multiple-file-upload__title-text-separator--Display: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
17099
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
17100
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__info--MarginTop);
17101
+ }
17102
+ .pf-c-multiple-file-upload.pf-m-drag-over {
17103
+ --pf-c-multiple-file-upload__main--BorderStyle: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderStyle);
17104
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderColor);
17105
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor);
17106
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color);
17107
+ --pf-c-multiple-file-upload__title-text--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-text--Color);
17108
+ --pf-c-multiple-file-upload__info--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__info--Color);
17109
+ }
17110
+
17111
+ .pf-c-multiple-file-upload__main {
17112
+ display: grid;
17113
+ padding: var(--pf-c-multiple-file-upload__main--PaddingTop) var(--pf-c-multiple-file-upload__main--PaddingRight) var(--pf-c-multiple-file-upload__main--PaddingBottom) var(--pf-c-multiple-file-upload__main--PaddingLeft);
17114
+ text-align: var(--pf-c-multiple-file-upload__main--TextAlign);
17115
+ background-color: var(--pf-c-multiple-file-upload__main--BackgroundColor);
17116
+ border: var(--pf-c-multiple-file-upload__main--BorderWidth) var(--pf-c-multiple-file-upload__main--BorderStyle) var(--pf-c-multiple-file-upload__main--BorderColor);
17117
+ grid-template-columns: var(--pf-c-multiple-file-upload__main--GridTemplateColumns);
17118
+ grid-template-rows: var(--pf-c-multiple-file-upload__main--GridTemplateRows);
17119
+ grid-template-areas: var(--pf-c-multiple-file-upload__main--GridTemplateAreas);
17120
+ gap: var(--pf-c-multiple-file-upload__main--Gap);
17121
+ }
17122
+
17123
+ .pf-c-multiple-file-upload__title {
17124
+ display: var(--pf-c-multiple-file-upload__title--Display);
17125
+ grid-template-columns: var(--pf-c-multiple-file-upload__title--GridTemplateColumns);
17126
+ gap: var(--pf-c-multiple-file-upload__title--Gap);
17127
+ grid-area: title;
17128
+ }
17129
+
17130
+ .pf-c-multiple-file-upload__title-icon {
17131
+ color: var(--pf-c-multiple-file-upload__title-icon--Color);
17132
+ }
17133
+
17134
+ .pf-c-multiple-file-upload__title-text {
17135
+ color: var(--pf-c-multiple-file-upload__title-text--Color, inherit);
17136
+ }
17137
+
17138
+ .pf-c-multiple-file-upload__title-text-separator {
17139
+ display: var(--pf-c-multiple-file-upload__title-text-separator--Display);
17140
+ margin-top: var(--pf-c-multiple-file-upload__title-text-separator--MarginTop);
17141
+ }
17142
+
17143
+ .pf-c-multiple-file-upload__upload {
17144
+ grid-area: upload;
17145
+ }
17146
+
17147
+ .pf-c-multiple-file-upload__info {
17148
+ grid-area: info;
17149
+ margin-top: var(--pf-c-multiple-file-upload__info--MarginTop);
17150
+ font-size: var(--pf-c-multiple-file-upload__info--FontSize);
17151
+ color: var(--pf-c-multiple-file-upload__info--Color);
17152
+ }
17153
+
17154
+ .pf-c-multiple-file-upload__status,
17155
+ .pf-c-multiple-file-upload__status-item-main {
17156
+ min-width: 0;
17157
+ }
17158
+
17159
+ .pf-c-multiple-file-upload__status-progress {
17160
+ display: grid;
17161
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-progress--GridTemplateColumns);
17162
+ gap: var(--pf-c-multiple-file-upload__status-progress--Gap);
17163
+ }
17164
+
17165
+ .pf-c-multiple-file-upload__status-progress-icon {
17166
+ color: var(--pf-c-multiple-file-upload__status-progress-icon--Color);
17167
+ }
17168
+
17169
+ .pf-c-multiple-file-upload__status-item {
17170
+ display: grid;
17171
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item--GridTemplateColumns);
17172
+ gap: var(--pf-c-multiple-file-upload__status-item--Gap);
17173
+ padding-top: var(--pf-c-multiple-file-upload__status-item--PaddingTop);
17174
+ padding-bottom: var(--pf-c-multiple-file-upload__status-item--PaddingBottom);
17175
+ border-bottom: var(--pf-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-c-multiple-file-upload__status-item--BorderColor);
17176
+ }
17177
+ .pf-c-multiple-file-upload__status-item:first-child {
17178
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-c-multiple-file-upload__status-item--first-child--PaddingTop);
17179
+ }
17180
+
17181
+ .pf-c-multiple-file-upload__status-item-icon {
17182
+ color: var(--pf-c-multiple-file-upload__status-item-icon--Color);
17183
+ }
17184
+
17185
+ .pf-c-multiple-file-upload__status-item-close {
17186
+ margin-top: var(--pf-c-multiple-file-upload__status-item-close--MarginTop);
17187
+ }
17188
+
17189
+ .pf-c-multiple-file-upload__status-item-progress {
17190
+ display: grid;
17191
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
17192
+ gap: var(--pf-c-multiple-file-upload__status-item-progress--Gap);
17193
+ }
17194
+
17195
+ .pf-c-multiple-file-upload__status-item-progress-text {
17196
+ color: var(--pf-c-multiple-file-upload__status-item-progress-text--Color);
17197
+ }
17198
+
17199
+ .pf-c-multiple-file-upload__status-item-progress-size {
17200
+ color: var(--pf-c-multiple-file-upload__status-item-progress-size--Color);
17201
+ }
17202
+
16865
17203
  .pf-c-nav {
16866
17204
  --pf-c-nav--Transition: var(--pf-global--Transition);
16867
17205
  --pf-c-nav--m-light__item--before--BorderColor: var(--pf-global--BorderColor--300);
@@ -26774,6 +27112,52 @@ svg.pf-c-spinner.pf-m-xl {
26774
27112
  background-color: var(--pf-c-tooltip__content--BackgroundColor);
26775
27113
  }
26776
27114
 
27115
+ .pf-c-truncate {
27116
+ --pf-c-truncate--FontSize: 1rem;
27117
+ display: inline-flex;
27118
+ flex-wrap: nowrap;
27119
+ max-width: 100%;
27120
+ }
27121
+
27122
+ .pf-c-truncate__start,
27123
+ .pf-c-truncate__end {
27124
+ flex-shrink: 1;
27125
+ overflow: hidden;
27126
+ text-overflow: ellipsis;
27127
+ white-space: nowrap;
27128
+ }
27129
+
27130
+ .pf-c-truncate__end {
27131
+ direction: rtl;
27132
+ text-align: left;
27133
+ }
27134
+
27135
+ @supports (text-overflow: "") {
27136
+ .pf-c-truncate__start + .pf-c-truncate__end {
27137
+ text-overflow: "";
27138
+ }
27139
+ }
27140
+ @supports not (text-overflow: "") {
27141
+ .pf-c-truncate__start + .pf-c-truncate__end {
27142
+ font-size: 0;
27143
+ }
27144
+ .pf-c-truncate__start + .pf-c-truncate__end .pf-c-truncate__text {
27145
+ font-size: var(--pf-c-truncate--FontSize);
27146
+ }
27147
+ }
27148
+ @supports (-webkit-hyphens: none) {
27149
+ .pf-c-truncate {
27150
+ display: inline-block;
27151
+ max-width: 100%;
27152
+ overflow: hidden;
27153
+ text-overflow: ellipsis;
27154
+ white-space: nowrap;
27155
+ }
27156
+
27157
+ .pf-c-truncate__end {
27158
+ direction: ltr;
27159
+ }
27160
+ }
26777
27161
  .pf-c-number-input {
26778
27162
  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
26779
27163
  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);