@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.
package/patternfly.css CHANGED
@@ -13327,7 +13327,7 @@ label.pf-c-check, .pf-c-check__label,
13327
13327
  .pf-c-form.pf-m-horizontal.pf-m-align-right .pf-c-form__label {
13328
13328
  text-align: right;
13329
13329
  }
13330
- @media (min-width: 768px) {
13330
+ @media screen and (min-width: 768px) {
13331
13331
  .pf-c-form.pf-m-horizontal {
13332
13332
  --pf-c-form__group-label--PaddingBottom: 0;
13333
13333
  }
@@ -13347,6 +13347,126 @@ label.pf-c-check, .pf-c-check__label,
13347
13347
  grid-column: 2;
13348
13348
  }
13349
13349
  }
13350
+ @media screen and (min-width: 0) {
13351
+ .pf-c-form.pf-m-horizontal-on-xs {
13352
+ --pf-c-form__group-label--PaddingBottom: 0;
13353
+ }
13354
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group {
13355
+ display: grid;
13356
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13357
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13358
+ }
13359
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-label {
13360
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13361
+ }
13362
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-label.pf-m-no-padding-top {
13363
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13364
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13365
+ }
13366
+ .pf-c-form.pf-m-horizontal-on-xs .pf-c-form__group-control {
13367
+ grid-column: 2;
13368
+ }
13369
+ }
13370
+ @media (min-width: 576px) {
13371
+ .pf-c-form.pf-m-horizontal-on-sm {
13372
+ --pf-c-form__group-label--PaddingBottom: 0;
13373
+ }
13374
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group {
13375
+ display: grid;
13376
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13377
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13378
+ }
13379
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-label {
13380
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13381
+ }
13382
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-label.pf-m-no-padding-top {
13383
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13384
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13385
+ }
13386
+ .pf-c-form.pf-m-horizontal-on-sm .pf-c-form__group-control {
13387
+ grid-column: 2;
13388
+ }
13389
+ }
13390
+ @media (min-width: 768px) {
13391
+ .pf-c-form.pf-m-horizontal-on-md {
13392
+ --pf-c-form__group-label--PaddingBottom: 0;
13393
+ }
13394
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group {
13395
+ display: grid;
13396
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13397
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13398
+ }
13399
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-label {
13400
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13401
+ }
13402
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-label.pf-m-no-padding-top {
13403
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13404
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13405
+ }
13406
+ .pf-c-form.pf-m-horizontal-on-md .pf-c-form__group-control {
13407
+ grid-column: 2;
13408
+ }
13409
+ }
13410
+ @media (min-width: 992px) {
13411
+ .pf-c-form.pf-m-horizontal-on-lg {
13412
+ --pf-c-form__group-label--PaddingBottom: 0;
13413
+ }
13414
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group {
13415
+ display: grid;
13416
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13417
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13418
+ }
13419
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-label {
13420
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13421
+ }
13422
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-label.pf-m-no-padding-top {
13423
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13424
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13425
+ }
13426
+ .pf-c-form.pf-m-horizontal-on-lg .pf-c-form__group-control {
13427
+ grid-column: 2;
13428
+ }
13429
+ }
13430
+ @media (min-width: 1200px) {
13431
+ .pf-c-form.pf-m-horizontal-on-xl {
13432
+ --pf-c-form__group-label--PaddingBottom: 0;
13433
+ }
13434
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group {
13435
+ display: grid;
13436
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13437
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13438
+ }
13439
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-label {
13440
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13441
+ }
13442
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-label.pf-m-no-padding-top {
13443
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13444
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13445
+ }
13446
+ .pf-c-form.pf-m-horizontal-on-xl .pf-c-form__group-control {
13447
+ grid-column: 2;
13448
+ }
13449
+ }
13450
+ @media (min-width: 1450px) {
13451
+ .pf-c-form.pf-m-horizontal-on-2xl {
13452
+ --pf-c-form__group-label--PaddingBottom: 0;
13453
+ }
13454
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group {
13455
+ display: grid;
13456
+ grid-column-gap: var(--pf-c-form--m-horizontal__group-label--md--GridColumnGap);
13457
+ grid-template-columns: var(--pf-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-c-form--m-horizontal__group-control--md--GridColumnWidth);
13458
+ }
13459
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-label {
13460
+ padding-top: var(--pf-c-form--m-horizontal__group-label--md--PaddingTop);
13461
+ }
13462
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-label.pf-m-no-padding-top {
13463
+ --pf-c-form--m-horizontal__group-label--md--PaddingTop: var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--PaddingTop);
13464
+ transform: translateY(var(--pf-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
13465
+ }
13466
+ .pf-c-form.pf-m-horizontal-on-2xl .pf-c-form__group-control {
13467
+ grid-column: 2;
13468
+ }
13469
+ }
13350
13470
  .pf-c-form.pf-m-limit-width {
13351
13471
  max-width: var(--pf-c-form--m-limit-width--MaxWidth);
13352
13472
  }
@@ -14567,6 +14687,7 @@ label.pf-c-input-group__text {
14567
14687
  --pf-c-label--m-compact--PaddingBottom: 0;
14568
14688
  --pf-c-label--m-compact--PaddingLeft: var(--pf-global--spacer--sm);
14569
14689
  --pf-c-label--m-compact--FontSize: var(--pf-global--FontSize--xs);
14690
+ --pf-c-label--m-compact--m-editable--TextDecorationOffset: 0.0625rem;
14570
14691
  --pf-c-label__content--Color: var(--pf-global--Color--100);
14571
14692
  --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
14572
14693
  --pf-c-label__text--MaxWidth: 16ch;
@@ -14581,6 +14702,18 @@ label.pf-c-input-group__text {
14581
14702
  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
14582
14703
  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
14583
14704
  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
14705
+ --pf-c-label__editable-text--MaxWidth: 16ch;
14706
+ --pf-c-label__editable-text--BorderWidth: 0;
14707
+ --pf-c-label--m-editable--Cursor: pointer;
14708
+ --pf-c-label--m-editable--TextDecoration: underline;
14709
+ --pf-c-label--m-editable--TextDecorationStyle: dashed;
14710
+ --pf-c-label--m-editable--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
14711
+ --pf-c-label--m-editable--TextDecorationOffset: 0.25rem;
14712
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-global--BorderColor--200);
14713
+ --pf-c-label--m-editable--hover--TextDecorationColor: var(--pf-global--Color--100);
14714
+ --pf-c-label--m-editable--focus--TextDecorationColor: var(--pf-global--Color--100);
14715
+ --pf-c-label--m-editable--m-editable-active--Cursor: auto;
14716
+ --pf-c-label--m-editable--m-editable-active--TextDecoration: none;
14584
14717
  --pf-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
14585
14718
  --pf-c-label--m-editable--m-editable-active__content--before--BorderWidth: 0;
14586
14719
  --pf-c-label--m-editable--m-editable-active__content--before--BorderColor: transparent;
@@ -14599,6 +14732,7 @@ label.pf-c-input-group__text {
14599
14732
  --pf-c-label--PaddingBottom: var(--pf-c-label--m-compact--PaddingBottom);
14600
14733
  --pf-c-label--PaddingLeft: var(--pf-c-label--m-compact--PaddingLeft);
14601
14734
  --pf-c-label--FontSize: var(--pf-c-label--m-compact--FontSize);
14735
+ --pf-c-label--m-editable--TextDecorationOffset: var(--pf-c-label--m-compact--m-editable--TextDecorationOffset);
14602
14736
  }
14603
14737
  .pf-c-label.pf-m-blue {
14604
14738
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-blue--BackgroundColor);
@@ -14689,7 +14823,23 @@ label.pf-c-input-group__text {
14689
14823
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-outline__content--link--focus--before--BorderColor);
14690
14824
  }
14691
14825
 
14826
+ .pf-c-label.pf-m-editable {
14827
+ text-decoration: var(--pf-c-label--m-editable--TextDecoration);
14828
+ cursor: var(--pf-c-label--m-editable--Cursor);
14829
+ text-decoration-style: var(--pf-c-label--m-editable--TextDecorationStyle);
14830
+ text-decoration-thickness: var(--pf-c-label--m-editable--TextDecorationThickness);
14831
+ text-underline-offset: var(--pf-c-label--m-editable--TextDecorationOffset);
14832
+ text-decoration-color: var(--pf-c-label--m-editable--TextDecorationColor);
14833
+ }
14834
+ .pf-c-label.pf-m-editable:hover {
14835
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--hover--TextDecorationColor);
14836
+ }
14837
+ .pf-c-label.pf-m-editable:focus {
14838
+ --pf-c-label--m-editable--TextDecorationColor: var(--pf-c-label--m-editable--focus--TextDecorationColor);
14839
+ }
14692
14840
  .pf-c-label.pf-m-editable-active {
14841
+ --pf-c-label--m-editable--Cursor: var(--pf-c-label--m-editable--m-editable-active--Cursor);
14842
+ --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
14693
14843
  --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
14694
14844
  --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderWidth);
14695
14845
  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-editable--m-editable-active__content--before--BorderColor);
@@ -14697,6 +14847,13 @@ label.pf-c-input-group__text {
14697
14847
  .pf-c-label.pf-m-editable-active .pf-c-button {
14698
14848
  visibility: hidden;
14699
14849
  }
14850
+ .pf-c-label .pf-c-label__editable-text {
14851
+ overflow: hidden;
14852
+ text-overflow: ellipsis;
14853
+ white-space: nowrap;
14854
+ max-width: var(--pf-c-label__editable-text--MaxWidth);
14855
+ border-width: var(--pf-c-label__editable-text--BorderWidth);
14856
+ }
14700
14857
  .pf-c-label .pf-c-button {
14701
14858
  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
14702
14859
  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
@@ -16984,6 +17141,187 @@ ul.pf-c-list {
16984
17141
  }
16985
17142
  }
16986
17143
 
17144
+ .pf-c-multiple-file-upload {
17145
+ --pf-c-multiple-file-upload--GridTemplateColumns: 1fr;
17146
+ --pf-c-multiple-file-upload--Gap: var(--pf-global--spacer--lg);
17147
+ --pf-c-multiple-file-upload__main--TextAlign: center;
17148
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: auto;
17149
+ --pf-c-multiple-file-upload__main--GridTemplateRows: auto;
17150
+ --pf-c-multiple-file-upload__main--GridTemplateAreas:
17151
+ "title"
17152
+ "upload"
17153
+ "info";
17154
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-global--spacer--md);
17155
+ --pf-c-multiple-file-upload__main--PaddingTop: var(--pf-global--spacer--lg);
17156
+ --pf-c-multiple-file-upload__main--PaddingRight: var(--pf-global--spacer--lg);
17157
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-global--spacer--xl);
17158
+ --pf-c-multiple-file-upload__main--PaddingLeft: var(--pf-global--spacer--lg);
17159
+ --pf-c-multiple-file-upload__main--BorderWidth: var(--pf-global--BorderWidth--sm);
17160
+ --pf-c-multiple-file-upload__main--BorderStyle: dashed;
17161
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-global--BorderColor--100);
17162
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-global--BackgroundColor--100);
17163
+ --pf-c-multiple-file-upload__title--Display: grid;
17164
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: auto;
17165
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-global--spacer--sm);
17166
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-global--Color--200);
17167
+ --pf-c-multiple-file-upload__title-text-separator--Display: block;
17168
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-global--spacer--sm);
17169
+ --pf-c-multiple-file-upload__info--FontSize: var(--pf-global--FontSize--sm);
17170
+ --pf-c-multiple-file-upload__info--Color: var(--pf-global--Color--200);
17171
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-global--spacer--sm);
17172
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderStyle: solid;
17173
+ --pf-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-global--active-color--100);
17174
+ --pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor: var(--pf-global--palette--blue-50);
17175
+ --pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color: var(--pf-global--active-color--100);
17176
+ --pf-c-multiple-file-upload--m-drag-over__main__title-text--Color: var(--pf-global--active-color--100);
17177
+ --pf-c-multiple-file-upload--m-drag-over__main__info--Color: var(--pf-global--active-color--100);
17178
+ --pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
17179
+ --pf-c-multiple-file-upload--m-horizontal__main--TextAlign: left;
17180
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
17181
+ --pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
17182
+ "title upload"
17183
+ "info upload";
17184
+ --pf-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-global--spacer--sm) var(--pf-global--spacer--2xl);
17185
+ --pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-global--spacer--lg);
17186
+ --pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
17187
+ --pf-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-global--spacer--xs);
17188
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
17189
+ --pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
17190
+ --pf-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
17191
+ --pf-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
17192
+ --pf-c-multiple-file-upload__status-progress--Gap: var(--pf-global--spacer--sm);
17193
+ --pf-c-multiple-file-upload__status-progress-icon--Color: var(--pf-global--Color--200);
17194
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-global--spacer--md);
17195
+ --pf-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-global--spacer--md);
17196
+ --pf-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
17197
+ --pf-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
17198
+ --pf-c-multiple-file-upload__status-item--Gap: var(--pf-global--spacer--sm);
17199
+ --pf-c-multiple-file-upload__status-item--BorderWidth: var(--pf-global--BorderWidth--sm);
17200
+ --pf-c-multiple-file-upload__status-item--BorderColor: var(--pf-global--BorderColor--100);
17201
+ --pf-c-multiple-file-upload__status-item-icon--Color: var(--pf-global--Color--200);
17202
+ --pf-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
17203
+ --pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
17204
+ --pf-c-multiple-file-upload__status-item-progress--Gap: var(--pf-global--spacer--sm);
17205
+ --pf-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-global--primary-color--100);
17206
+ --pf-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-global--Color--200);
17207
+ display: grid;
17208
+ gap: var(--pf-c-multiple-file-upload--Gap);
17209
+ grid-template-columns: var(--pf-c-multiple-file-upload--GridTemplateColumns);
17210
+ }
17211
+ .pf-c-multiple-file-upload.pf-m-horizontal {
17212
+ --pf-c-multiple-file-upload--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
17213
+ --pf-c-multiple-file-upload__main--TextAlign: var(--pf-c-multiple-file-upload--m-horizontal__main--TextAlign);
17214
+ --pf-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
17215
+ --pf-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
17216
+ --pf-c-multiple-file-upload__main--Gap: var(--pf-c-multiple-file-upload--m-horizontal__main--Gap);
17217
+ --pf-c-multiple-file-upload__main--PaddingBottom: var(--pf-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
17218
+ --pf-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
17219
+ --pf-c-multiple-file-upload__title--Gap: var(--pf-c-multiple-file-upload--m-horizontal__title--Gap);
17220
+ --pf-c-multiple-file-upload__title-text-separator--Display: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
17221
+ --pf-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
17222
+ --pf-c-multiple-file-upload__info--MarginTop: var(--pf-c-multiple-file-upload--m-horizontal__info--MarginTop);
17223
+ }
17224
+ .pf-c-multiple-file-upload.pf-m-drag-over {
17225
+ --pf-c-multiple-file-upload__main--BorderStyle: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderStyle);
17226
+ --pf-c-multiple-file-upload__main--BorderColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BorderColor);
17227
+ --pf-c-multiple-file-upload__main--BackgroundColor: var(--pf-c-multiple-file-upload--m-drag-over__main--BackgroundColor);
17228
+ --pf-c-multiple-file-upload__title-icon--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-icon--Color);
17229
+ --pf-c-multiple-file-upload__title-text--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__title-text--Color);
17230
+ --pf-c-multiple-file-upload__info--Color: var(--pf-c-multiple-file-upload--m-drag-over__main__info--Color);
17231
+ }
17232
+
17233
+ .pf-c-multiple-file-upload__main {
17234
+ display: grid;
17235
+ 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);
17236
+ text-align: var(--pf-c-multiple-file-upload__main--TextAlign);
17237
+ background-color: var(--pf-c-multiple-file-upload__main--BackgroundColor);
17238
+ 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);
17239
+ grid-template-columns: var(--pf-c-multiple-file-upload__main--GridTemplateColumns);
17240
+ grid-template-rows: var(--pf-c-multiple-file-upload__main--GridTemplateRows);
17241
+ grid-template-areas: var(--pf-c-multiple-file-upload__main--GridTemplateAreas);
17242
+ gap: var(--pf-c-multiple-file-upload__main--Gap);
17243
+ }
17244
+
17245
+ .pf-c-multiple-file-upload__title {
17246
+ display: var(--pf-c-multiple-file-upload__title--Display);
17247
+ grid-template-columns: var(--pf-c-multiple-file-upload__title--GridTemplateColumns);
17248
+ gap: var(--pf-c-multiple-file-upload__title--Gap);
17249
+ grid-area: title;
17250
+ }
17251
+
17252
+ .pf-c-multiple-file-upload__title-icon {
17253
+ color: var(--pf-c-multiple-file-upload__title-icon--Color);
17254
+ }
17255
+
17256
+ .pf-c-multiple-file-upload__title-text {
17257
+ color: var(--pf-c-multiple-file-upload__title-text--Color, inherit);
17258
+ }
17259
+
17260
+ .pf-c-multiple-file-upload__title-text-separator {
17261
+ display: var(--pf-c-multiple-file-upload__title-text-separator--Display);
17262
+ margin-top: var(--pf-c-multiple-file-upload__title-text-separator--MarginTop);
17263
+ }
17264
+
17265
+ .pf-c-multiple-file-upload__upload {
17266
+ grid-area: upload;
17267
+ }
17268
+
17269
+ .pf-c-multiple-file-upload__info {
17270
+ grid-area: info;
17271
+ margin-top: var(--pf-c-multiple-file-upload__info--MarginTop);
17272
+ font-size: var(--pf-c-multiple-file-upload__info--FontSize);
17273
+ color: var(--pf-c-multiple-file-upload__info--Color);
17274
+ }
17275
+
17276
+ .pf-c-multiple-file-upload__status,
17277
+ .pf-c-multiple-file-upload__status-item-main {
17278
+ min-width: 0;
17279
+ }
17280
+
17281
+ .pf-c-multiple-file-upload__status-progress {
17282
+ display: grid;
17283
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-progress--GridTemplateColumns);
17284
+ gap: var(--pf-c-multiple-file-upload__status-progress--Gap);
17285
+ }
17286
+
17287
+ .pf-c-multiple-file-upload__status-progress-icon {
17288
+ color: var(--pf-c-multiple-file-upload__status-progress-icon--Color);
17289
+ }
17290
+
17291
+ .pf-c-multiple-file-upload__status-item {
17292
+ display: grid;
17293
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item--GridTemplateColumns);
17294
+ gap: var(--pf-c-multiple-file-upload__status-item--Gap);
17295
+ padding-top: var(--pf-c-multiple-file-upload__status-item--PaddingTop);
17296
+ padding-bottom: var(--pf-c-multiple-file-upload__status-item--PaddingBottom);
17297
+ border-bottom: var(--pf-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-c-multiple-file-upload__status-item--BorderColor);
17298
+ }
17299
+ .pf-c-multiple-file-upload__status-item:first-child {
17300
+ --pf-c-multiple-file-upload__status-item--PaddingTop: var(--pf-c-multiple-file-upload__status-item--first-child--PaddingTop);
17301
+ }
17302
+
17303
+ .pf-c-multiple-file-upload__status-item-icon {
17304
+ color: var(--pf-c-multiple-file-upload__status-item-icon--Color);
17305
+ }
17306
+
17307
+ .pf-c-multiple-file-upload__status-item-close {
17308
+ margin-top: var(--pf-c-multiple-file-upload__status-item-close--MarginTop);
17309
+ }
17310
+
17311
+ .pf-c-multiple-file-upload__status-item-progress {
17312
+ display: grid;
17313
+ grid-template-columns: var(--pf-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
17314
+ gap: var(--pf-c-multiple-file-upload__status-item-progress--Gap);
17315
+ }
17316
+
17317
+ .pf-c-multiple-file-upload__status-item-progress-text {
17318
+ color: var(--pf-c-multiple-file-upload__status-item-progress-text--Color);
17319
+ }
17320
+
17321
+ .pf-c-multiple-file-upload__status-item-progress-size {
17322
+ color: var(--pf-c-multiple-file-upload__status-item-progress-size--Color);
17323
+ }
17324
+
16987
17325
  .pf-c-nav {
16988
17326
  --pf-c-nav--Transition: var(--pf-global--Transition);
16989
17327
  --pf-c-nav--m-light__item--before--BorderColor: var(--pf-global--BorderColor--300);
@@ -26896,6 +27234,52 @@ svg.pf-c-spinner.pf-m-xl {
26896
27234
  background-color: var(--pf-c-tooltip__content--BackgroundColor);
26897
27235
  }
26898
27236
 
27237
+ .pf-c-truncate {
27238
+ --pf-c-truncate--FontSize: 1rem;
27239
+ display: inline-flex;
27240
+ flex-wrap: nowrap;
27241
+ max-width: 100%;
27242
+ }
27243
+
27244
+ .pf-c-truncate__start,
27245
+ .pf-c-truncate__end {
27246
+ flex-shrink: 1;
27247
+ overflow: hidden;
27248
+ text-overflow: ellipsis;
27249
+ white-space: nowrap;
27250
+ }
27251
+
27252
+ .pf-c-truncate__end {
27253
+ direction: rtl;
27254
+ text-align: left;
27255
+ }
27256
+
27257
+ @supports (text-overflow: "") {
27258
+ .pf-c-truncate__start + .pf-c-truncate__end {
27259
+ text-overflow: "";
27260
+ }
27261
+ }
27262
+ @supports not (text-overflow: "") {
27263
+ .pf-c-truncate__start + .pf-c-truncate__end {
27264
+ font-size: 0;
27265
+ }
27266
+ .pf-c-truncate__start + .pf-c-truncate__end .pf-c-truncate__text {
27267
+ font-size: var(--pf-c-truncate--FontSize);
27268
+ }
27269
+ }
27270
+ @supports (-webkit-hyphens: none) {
27271
+ .pf-c-truncate {
27272
+ display: inline-block;
27273
+ max-width: 100%;
27274
+ overflow: hidden;
27275
+ text-overflow: ellipsis;
27276
+ white-space: nowrap;
27277
+ }
27278
+
27279
+ .pf-c-truncate__end {
27280
+ direction: ltr;
27281
+ }
27282
+ }
26899
27283
  .pf-c-number-input {
26900
27284
  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
26901
27285
  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);