@patternfly/react-core 4.239.1 → 4.240.0

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/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # 4.240.0 (2022-09-16)
7
+
8
+
9
+ ### Features
10
+
11
+ * **charts:** Update Victory dependencies ([#7986](https://github.com/patternfly/patternfly-react/issues/7986)) ([bbee15f](https://github.com/patternfly/patternfly-react/commit/bbee15fd0e00288dfa72c88a79a685b5405a355e))
12
+
13
+
14
+
15
+
16
+
6
17
  ## 4.239.1 (2022-09-15)
7
18
 
8
19
  **Note:** Version bump only for package @patternfly/react-core
@@ -297,6 +297,238 @@
297
297
  --pf-c-action-list--child--spacer: var(--pf-c-action-list--m-icon--spacer);
298
298
  }
299
299
 
300
+ .pf-c-alert {
301
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
302
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
303
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
304
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
305
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
306
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
307
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
308
+ }
309
+
310
+ .pf-c-alert {
311
+ --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
312
+ --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
313
+ --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
314
+ --pf-c-alert--GridTemplateAreas:
315
+ "icon title action"
316
+ ". description description"
317
+ ". actiongroup actiongroup";
318
+ --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
319
+ --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
320
+ --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
321
+ --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
322
+ --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
323
+ --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
324
+ --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
325
+ --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
326
+ --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
327
+ --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
328
+ --pf-c-alert__toggle-icon--Rotate: 0;
329
+ --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
330
+ --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
331
+ --pf-c-alert__icon--MarginTop: 0.0625rem;
332
+ --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
333
+ --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
334
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
335
+ --pf-c-alert__title--Color: var(--pf-global--default-color--300);
336
+ --pf-c-alert__title--max-lines: 1;
337
+ --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
338
+ --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
339
+ --pf-c-alert__action--TranslateY: 0.125rem;
340
+ --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
341
+ --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
342
+ --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
343
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
344
+ --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
345
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
346
+ --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
347
+ --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
348
+ --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
349
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
350
+ --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
351
+ --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
352
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
353
+ --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
354
+ --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
355
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
356
+ --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
357
+ --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
358
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
359
+ --pf-c-alert--m-inline--BoxShadow: none;
360
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
361
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
362
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
363
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
364
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
365
+ --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
366
+ --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
367
+ --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
368
+ --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
369
+ --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
370
+ --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
371
+ --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
372
+ --pf-c-alert--m-expandable--GridTemplateAreas:
373
+ "toggle icon title action"
374
+ ". . description description"
375
+ ". . actiongroup actiongroup";
376
+ --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
377
+ --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
378
+ --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
379
+ color: var(--pf-global--Color--100);
380
+ position: relative;
381
+ display: grid;
382
+ padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
383
+ font-size: var(--pf-c-alert__FontSize);
384
+ background-color: var(--pf-c-alert--BackgroundColor);
385
+ border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
386
+ box-shadow: var(--pf-c-alert--BoxShadow);
387
+ grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
388
+ grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
389
+ }
390
+
391
+ .pf-c-alert.pf-m-success {
392
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
393
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
394
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
395
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
396
+ }
397
+
398
+ .pf-c-alert.pf-m-danger {
399
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
400
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
401
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
402
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
403
+ }
404
+
405
+ .pf-c-alert.pf-m-warning {
406
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
407
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
408
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
409
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
410
+ }
411
+
412
+ .pf-c-alert.pf-m-info {
413
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
414
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
415
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
416
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
417
+ }
418
+
419
+ .pf-c-alert.pf-m-inline {
420
+ --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
421
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
422
+ }
423
+
424
+ .pf-c-alert.pf-m-plain {
425
+ --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
426
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
427
+ --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
428
+ --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
429
+ --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
430
+ --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
431
+ }
432
+
433
+ .pf-c-alert.pf-m-expandable {
434
+ --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
435
+ --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
436
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
437
+ }
438
+
439
+ .pf-c-alert.pf-m-expanded {
440
+ --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
441
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
442
+ }
443
+
444
+ .pf-c-alert__toggle {
445
+ margin-top: var(--pf-c-alert__toggle--MarginTop);
446
+ margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
447
+ margin-left: var(--pf-c-alert__toggle--MarginLeft);
448
+ }
449
+
450
+ .pf-c-alert__toggle-icon {
451
+ display: inline-block;
452
+ transition: var(--pf-c-alert__toggle-icon--Transition);
453
+ transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
454
+ }
455
+
456
+ .pf-c-alert__icon {
457
+ grid-area: icon;
458
+ display: flex;
459
+ margin-top: var(--pf-c-alert__icon--MarginTop);
460
+ margin-right: var(--pf-c-alert__icon--MarginRight);
461
+ font-size: var(--pf-c-alert__icon--FontSize);
462
+ color: var(--pf-c-alert__icon--Color);
463
+ }
464
+
465
+ .pf-c-alert__title {
466
+ grid-area: title;
467
+ font-weight: var(--pf-c-alert__title--FontWeight);
468
+ color: var(--pf-c-alert__title--Color);
469
+ word-break: break-word;
470
+ }
471
+
472
+ .pf-c-alert__title.pf-m-truncate {
473
+ display: -webkit-box;
474
+ -webkit-box-orient: vertical;
475
+ -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
476
+ overflow: hidden;
477
+ }
478
+
479
+ .pf-c-alert__description {
480
+ grid-area: description;
481
+ padding-top: var(--pf-c-alert__description--PaddingTop);
482
+ word-break: break-word;
483
+ }
484
+
485
+ .pf-c-alert__description + .pf-c-alert__action-group {
486
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
487
+ }
488
+
489
+ .pf-c-alert__action {
490
+ grid-area: action;
491
+ margin-top: var(--pf-c-alert__action--MarginTop);
492
+ margin-right: var(--pf-c-alert__action--MarginRight);
493
+ margin-bottom: var(--pf-c-alert__action--MarginBottom);
494
+ transform: translateY(var(--pf-c-alert__action--TranslateY));
495
+ }
496
+
497
+ .pf-c-alert__action > .pf-c-button {
498
+ --pf-c-button--LineHeight: 1;
499
+ }
500
+
501
+ .pf-c-alert__action-group {
502
+ grid-area: actiongroup;
503
+ padding-top: var(--pf-c-alert__action-group--PaddingTop);
504
+ }
505
+
506
+ .pf-c-alert__action-group > .pf-c-button {
507
+ --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
508
+ }
509
+
510
+ .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
511
+ margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
512
+ }
513
+
514
+ .pf-m-overpass-font .pf-c-alert__title {
515
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
516
+ }
517
+
518
+ :where(.pf-theme-dark) .pf-c-alert {
519
+ --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
520
+ --pf-c-alert__title--Color: var(--pf-global--default-color--200);
521
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
522
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
523
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
524
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
525
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
526
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
527
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
528
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
529
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
530
+ }
531
+
300
532
  .pf-c-app-launcher {
301
533
  --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
302
534
  --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -1268,288 +1500,56 @@ textarea.pf-c-form-control {
1268
1500
  --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height);
1269
1501
  }
1270
1502
 
1271
- @media (min-width: 576px) {
1272
- .pf-c-avatar.pf-m-xl {
1273
- --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width));
1274
- }
1275
- }
1276
- @media (min-width: 768px) {
1277
- .pf-c-avatar.pf-m-xl {
1278
- --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width)));
1279
- }
1280
- }
1281
- @media (min-width: 992px) {
1282
- .pf-c-avatar.pf-m-xl {
1283
- --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width))));
1284
- }
1285
- }
1286
- @media (min-width: 1200px) {
1287
- .pf-c-avatar.pf-m-xl {
1288
- --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-xl, var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width)))));
1289
- }
1290
- }
1291
- @media (min-width: 1450px) {
1292
- .pf-c-avatar.pf-m-xl {
1293
- --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-2xl, var(--pf-c-avatar--m-xl--Width-on-xl, var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width))))));
1294
- }
1295
- }
1296
- @media (min-width: 576px) {
1297
- .pf-c-avatar.pf-m-xl {
1298
- --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height));
1299
- }
1300
- }
1301
- @media (min-width: 768px) {
1302
- .pf-c-avatar.pf-m-xl {
1303
- --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height)));
1304
- }
1305
- }
1306
- @media (min-width: 992px) {
1307
- .pf-c-avatar.pf-m-xl {
1308
- --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))));
1309
- }
1310
- }
1311
- @media (min-width: 1200px) {
1312
- .pf-c-avatar.pf-m-xl {
1313
- --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height)))));
1314
- }
1315
- }
1316
- @media (min-width: 1450px) {
1317
- .pf-c-avatar.pf-m-xl {
1318
- --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-2xl, var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))))));
1319
- }
1320
- }
1321
- .pf-c-alert {
1322
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
1323
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
1324
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
1325
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
1326
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
1327
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
1328
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
1329
- }
1330
-
1331
- .pf-c-alert {
1332
- --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
1333
- --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
1334
- --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
1335
- --pf-c-alert--GridTemplateAreas:
1336
- "icon title action"
1337
- ". description description"
1338
- ". actiongroup actiongroup";
1339
- --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
1340
- --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
1341
- --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
1342
- --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
1343
- --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
1344
- --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
1345
- --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
1346
- --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
1347
- --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
1348
- --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
1349
- --pf-c-alert__toggle-icon--Rotate: 0;
1350
- --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
1351
- --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
1352
- --pf-c-alert__icon--MarginTop: 0.0625rem;
1353
- --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
1354
- --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
1355
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
1356
- --pf-c-alert__title--Color: var(--pf-global--default-color--300);
1357
- --pf-c-alert__title--max-lines: 1;
1358
- --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
1359
- --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
1360
- --pf-c-alert__action--TranslateY: 0.125rem;
1361
- --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
1362
- --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
1363
- --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
1364
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1365
- --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
1366
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1367
- --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
1368
- --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
1369
- --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
1370
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
1371
- --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
1372
- --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
1373
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
1374
- --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
1375
- --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
1376
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
1377
- --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
1378
- --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
1379
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
1380
- --pf-c-alert--m-inline--BoxShadow: none;
1381
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
1382
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
1383
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
1384
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
1385
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
1386
- --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
1387
- --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
1388
- --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
1389
- --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
1390
- --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
1391
- --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
1392
- --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
1393
- --pf-c-alert--m-expandable--GridTemplateAreas:
1394
- "toggle icon title action"
1395
- ". . description description"
1396
- ". . actiongroup actiongroup";
1397
- --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1398
- --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
1399
- --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1400
- color: var(--pf-global--Color--100);
1401
- position: relative;
1402
- display: grid;
1403
- padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
1404
- font-size: var(--pf-c-alert__FontSize);
1405
- background-color: var(--pf-c-alert--BackgroundColor);
1406
- border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
1407
- box-shadow: var(--pf-c-alert--BoxShadow);
1408
- grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
1409
- grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
1410
- }
1411
-
1412
- .pf-c-alert.pf-m-success {
1413
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
1414
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
1415
- --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
1416
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
1417
- }
1418
-
1419
- .pf-c-alert.pf-m-danger {
1420
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
1421
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
1422
- --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
1423
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
1424
- }
1425
-
1426
- .pf-c-alert.pf-m-warning {
1427
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
1428
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
1429
- --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
1430
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
1431
- }
1432
-
1433
- .pf-c-alert.pf-m-info {
1434
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
1435
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
1436
- --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
1437
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
1438
- }
1439
-
1440
- .pf-c-alert.pf-m-inline {
1441
- --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
1442
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
1443
- }
1444
-
1445
- .pf-c-alert.pf-m-plain {
1446
- --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
1447
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
1448
- --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
1449
- --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
1450
- --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
1451
- --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
1452
- }
1453
-
1454
- .pf-c-alert.pf-m-expandable {
1455
- --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
1456
- --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
1457
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
1458
- }
1459
-
1460
- .pf-c-alert.pf-m-expanded {
1461
- --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
1462
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
1463
- }
1464
-
1465
- .pf-c-alert__toggle {
1466
- margin-top: var(--pf-c-alert__toggle--MarginTop);
1467
- margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
1468
- margin-left: var(--pf-c-alert__toggle--MarginLeft);
1469
- }
1470
-
1471
- .pf-c-alert__toggle-icon {
1472
- display: inline-block;
1473
- transition: var(--pf-c-alert__toggle-icon--Transition);
1474
- transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
1475
- }
1476
-
1477
- .pf-c-alert__icon {
1478
- grid-area: icon;
1479
- display: flex;
1480
- margin-top: var(--pf-c-alert__icon--MarginTop);
1481
- margin-right: var(--pf-c-alert__icon--MarginRight);
1482
- font-size: var(--pf-c-alert__icon--FontSize);
1483
- color: var(--pf-c-alert__icon--Color);
1484
- }
1485
-
1486
- .pf-c-alert__title {
1487
- grid-area: title;
1488
- font-weight: var(--pf-c-alert__title--FontWeight);
1489
- color: var(--pf-c-alert__title--Color);
1490
- word-break: break-word;
1491
- }
1492
-
1493
- .pf-c-alert__title.pf-m-truncate {
1494
- display: -webkit-box;
1495
- -webkit-box-orient: vertical;
1496
- -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
1497
- overflow: hidden;
1503
+ @media (min-width: 576px) {
1504
+ .pf-c-avatar.pf-m-xl {
1505
+ --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width));
1506
+ }
1498
1507
  }
1499
-
1500
- .pf-c-alert__description {
1501
- grid-area: description;
1502
- padding-top: var(--pf-c-alert__description--PaddingTop);
1503
- word-break: break-word;
1508
+ @media (min-width: 768px) {
1509
+ .pf-c-avatar.pf-m-xl {
1510
+ --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width)));
1511
+ }
1504
1512
  }
1505
-
1506
- .pf-c-alert__description + .pf-c-alert__action-group {
1507
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
1513
+ @media (min-width: 992px) {
1514
+ .pf-c-avatar.pf-m-xl {
1515
+ --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width))));
1516
+ }
1508
1517
  }
1509
-
1510
- .pf-c-alert__action {
1511
- grid-area: action;
1512
- margin-top: var(--pf-c-alert__action--MarginTop);
1513
- margin-right: var(--pf-c-alert__action--MarginRight);
1514
- margin-bottom: var(--pf-c-alert__action--MarginBottom);
1515
- transform: translateY(var(--pf-c-alert__action--TranslateY));
1518
+ @media (min-width: 1200px) {
1519
+ .pf-c-avatar.pf-m-xl {
1520
+ --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-xl, var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width)))));
1521
+ }
1516
1522
  }
1517
-
1518
- .pf-c-alert__action > .pf-c-button {
1519
- --pf-c-button--LineHeight: 1;
1523
+ @media (min-width: 1450px) {
1524
+ .pf-c-avatar.pf-m-xl {
1525
+ --pf-c-avatar--Width: var(--pf-c-avatar--m-xl--Width-on-2xl, var(--pf-c-avatar--m-xl--Width-on-xl, var(--pf-c-avatar--m-xl--Width-on-lg, var(--pf-c-avatar--m-xl--Width-on-md, var(--pf-c-avatar--m-xl--Width-on-sm, var(--pf-c-avatar--m-xl--Width))))));
1526
+ }
1520
1527
  }
1521
-
1522
- .pf-c-alert__action-group {
1523
- grid-area: actiongroup;
1524
- padding-top: var(--pf-c-alert__action-group--PaddingTop);
1528
+ @media (min-width: 576px) {
1529
+ .pf-c-avatar.pf-m-xl {
1530
+ --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height));
1531
+ }
1525
1532
  }
1526
-
1527
- .pf-c-alert__action-group > .pf-c-button {
1528
- --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
1533
+ @media (min-width: 768px) {
1534
+ .pf-c-avatar.pf-m-xl {
1535
+ --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height)));
1536
+ }
1529
1537
  }
1530
-
1531
- .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
1532
- margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
1538
+ @media (min-width: 992px) {
1539
+ .pf-c-avatar.pf-m-xl {
1540
+ --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))));
1541
+ }
1533
1542
  }
1534
-
1535
- .pf-m-overpass-font .pf-c-alert__title {
1536
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
1543
+ @media (min-width: 1200px) {
1544
+ .pf-c-avatar.pf-m-xl {
1545
+ --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height)))));
1546
+ }
1537
1547
  }
1538
-
1539
- :where(.pf-theme-dark) .pf-c-alert {
1540
- --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
1541
- --pf-c-alert__title--Color: var(--pf-global--default-color--200);
1542
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
1543
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
1544
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
1545
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
1546
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
1547
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
1548
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
1549
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
1550
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
1548
+ @media (min-width: 1450px) {
1549
+ .pf-c-avatar.pf-m-xl {
1550
+ --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-2xl, var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))))));
1551
+ }
1551
1552
  }
1552
-
1553
1553
  .pf-c-back-to-top {
1554
1554
  --pf-c-back-to-top--Right: var(--pf-global--spacer--2xl);
1555
1555
  --pf-c-back-to-top--Bottom: var(--pf-global--spacer--lg);
@@ -3424,6 +3424,89 @@ label.pf-c-check, .pf-c-check__label,
3424
3424
  --pf-c-chip--m-draggable--BackgroundColor: var(--pf-global--palette--black-600);
3425
3425
  }
3426
3426
 
3427
+ .pf-c-chip-group {
3428
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
3429
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
3430
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
3431
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
3432
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
3433
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
3434
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
3435
+ }
3436
+
3437
+ .pf-c-chip-group {
3438
+ color: var(--pf-global--Color--100);
3439
+ --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
3440
+ --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
3441
+ --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
3442
+ --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
3443
+ --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
3444
+ --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
3445
+ --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
3446
+ --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
3447
+ --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
3448
+ --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
3449
+ --pf-c-chip-group__label--MaxWidth: 18ch;
3450
+ --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
3451
+ --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
3452
+ --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
3453
+ --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
3454
+ max-width: 100%;
3455
+ }
3456
+
3457
+ .pf-c-chip-group.pf-m-category {
3458
+ padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
3459
+ padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
3460
+ padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
3461
+ padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
3462
+ background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
3463
+ border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
3464
+ }
3465
+
3466
+ .pf-c-chip-group__main {
3467
+ display: flex;
3468
+ flex: 1;
3469
+ flex-wrap: wrap;
3470
+ align-items: baseline;
3471
+ min-width: 0;
3472
+ }
3473
+
3474
+ .pf-c-chip-group__list {
3475
+ margin-right: var(--pf-c-chip-group__list--MarginRight);
3476
+ margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
3477
+ }
3478
+
3479
+ .pf-c-chip-group,
3480
+ .pf-c-chip-group__list {
3481
+ display: inline-flex;
3482
+ flex-wrap: wrap;
3483
+ align-items: center;
3484
+ min-width: 0;
3485
+ }
3486
+
3487
+ .pf-c-chip-group__list-item {
3488
+ display: inline-flex;
3489
+ min-width: 0;
3490
+ margin-right: var(--pf-c-chip-group__list-item--MarginRight);
3491
+ margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
3492
+ }
3493
+
3494
+ .pf-c-chip-group__label {
3495
+ overflow: hidden;
3496
+ text-overflow: ellipsis;
3497
+ white-space: nowrap;
3498
+ max-width: var(--pf-c-chip-group__label--MaxWidth);
3499
+ margin-right: var(--pf-c-chip-group__label--MarginRight);
3500
+ font-size: var(--pf-c-chip-group__label--FontSize);
3501
+ }
3502
+
3503
+ .pf-c-chip-group__close {
3504
+ display: flex;
3505
+ align-self: flex-start;
3506
+ margin-top: var(--pf-c-chip-group__close--MarginTop);
3507
+ margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
3508
+ }
3509
+
3427
3510
  .pf-c-clipboard-copy {
3428
3511
  --pf-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
3429
3512
  --pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
@@ -5380,89 +5463,6 @@ label.pf-c-check, .pf-c-check__label,
5380
5463
  overflow-y: visible;
5381
5464
  }
5382
5465
  }
5383
- .pf-c-chip-group {
5384
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
5385
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
5386
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
5387
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
5388
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
5389
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
5390
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
5391
- }
5392
-
5393
- .pf-c-chip-group {
5394
- color: var(--pf-global--Color--100);
5395
- --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
5396
- --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
5397
- --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
5398
- --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
5399
- --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
5400
- --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
5401
- --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
5402
- --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
5403
- --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
5404
- --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
5405
- --pf-c-chip-group__label--MaxWidth: 18ch;
5406
- --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
5407
- --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
5408
- --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
5409
- --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
5410
- max-width: 100%;
5411
- }
5412
-
5413
- .pf-c-chip-group.pf-m-category {
5414
- padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
5415
- padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
5416
- padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
5417
- padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
5418
- background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
5419
- border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
5420
- }
5421
-
5422
- .pf-c-chip-group__main {
5423
- display: flex;
5424
- flex: 1;
5425
- flex-wrap: wrap;
5426
- align-items: baseline;
5427
- min-width: 0;
5428
- }
5429
-
5430
- .pf-c-chip-group__list {
5431
- margin-right: var(--pf-c-chip-group__list--MarginRight);
5432
- margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
5433
- }
5434
-
5435
- .pf-c-chip-group,
5436
- .pf-c-chip-group__list {
5437
- display: inline-flex;
5438
- flex-wrap: wrap;
5439
- align-items: center;
5440
- min-width: 0;
5441
- }
5442
-
5443
- .pf-c-chip-group__list-item {
5444
- display: inline-flex;
5445
- min-width: 0;
5446
- margin-right: var(--pf-c-chip-group__list-item--MarginRight);
5447
- margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
5448
- }
5449
-
5450
- .pf-c-chip-group__label {
5451
- overflow: hidden;
5452
- text-overflow: ellipsis;
5453
- white-space: nowrap;
5454
- max-width: var(--pf-c-chip-group__label--MaxWidth);
5455
- margin-right: var(--pf-c-chip-group__label--MarginRight);
5456
- font-size: var(--pf-c-chip-group__label--FontSize);
5457
- }
5458
-
5459
- .pf-c-chip-group__close {
5460
- display: flex;
5461
- align-self: flex-start;
5462
- margin-top: var(--pf-c-chip-group__close--MarginTop);
5463
- margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
5464
- }
5465
-
5466
5466
  .pf-c-date-picker {
5467
5467
  --pf-c-date-picker--m-top__calendar--Top: 0;
5468
5468
  --pf-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-core",
3
- "version": "4.239.1",
3
+ "version": "4.240.0",
4
4
  "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
5
5
  "main": "dist/js/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -44,9 +44,9 @@
44
44
  "generate": "node scripts/copyStyles.js"
45
45
  },
46
46
  "dependencies": {
47
- "@patternfly/react-icons": "^4.90.1",
48
- "@patternfly/react-styles": "^4.89.1",
49
- "@patternfly/react-tokens": "^4.91.1",
47
+ "@patternfly/react-icons": "^4.91.0",
48
+ "@patternfly/react-styles": "^4.90.0",
49
+ "@patternfly/react-tokens": "^4.92.0",
50
50
  "focus-trap": "6.9.2",
51
51
  "react-dropzone": "9.0.0",
52
52
  "tippy.js": "5.1.2",
@@ -70,5 +70,5 @@
70
70
  "react": "^16.8.0 || ^17.0.0",
71
71
  "react-dom": "^16.8.0 || ^17.0.0"
72
72
  },
73
- "gitHead": "1e85a2dbd916188d8629b8631f67d1c337bfb456"
73
+ "gitHead": "2703bc1465144000deac49dab1b9d779093205c3"
74
74
  }