@patternfly/react-table 4.60.5 → 4.60.6

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.
@@ -7227,6 +7227,37 @@ svg.pf-c-spinner.pf-m-xl {
7227
7227
  --pf-c-accordion__expanded-content-body--PaddingTop: var(--pf-c-accordion__expanded-content-body--expanded-content-body--PaddingTop);
7228
7228
  }
7229
7229
 
7230
+ .pf-c-action-list {
7231
+ --pf-c-action-list--m-icon--spacer: 0;
7232
+ --pf-c-action-list--child--spacer-base: var(--pf-global--spacer--md);
7233
+ --pf-c-action-list--group--spacer-base: var(--pf-global--spacer--2xl);
7234
+ }
7235
+
7236
+ .pf-c-action-list,
7237
+ .pf-c-action-list__group {
7238
+ --pf-c-action-list--child--spacer: var(--pf-c-action-list--child--spacer-base);
7239
+ --pf-c-action-list--group--spacer: var(--pf-c-action-list--group--spacer-base);
7240
+ display: flex;
7241
+ align-items: center;
7242
+ }
7243
+
7244
+ .pf-c-action-list > * + *,
7245
+ .pf-c-action-list__group > * + * {
7246
+ margin-left: var(--pf-c-action-list--child--spacer);
7247
+ }
7248
+
7249
+ .pf-c-action-list > * + .pf-c-action-list__group,
7250
+ .pf-c-action-list .pf-c-action-list__group + *,
7251
+ .pf-c-action-list__group > * + .pf-c-action-list__group,
7252
+ .pf-c-action-list__group .pf-c-action-list__group + * {
7253
+ margin-left: var(--pf-c-action-list--group--spacer);
7254
+ }
7255
+
7256
+ .pf-c-action-list.pf-m-icons,
7257
+ .pf-c-action-list__group.pf-m-icons {
7258
+ --pf-c-action-list--child--spacer: var(--pf-c-action-list--m-icon--spacer);
7259
+ }
7260
+
7230
7261
  .pf-c-alert {
7231
7262
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
7232
7263
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -8209,6 +8240,221 @@ button.pf-c-breadcrumb__link {
8209
8240
  visibility: hidden;
8210
8241
  }
8211
8242
 
8243
+ .pf-c-calendar-month {
8244
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
8245
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
8246
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
8247
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
8248
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
8249
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
8250
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
8251
+ }
8252
+
8253
+ .pf-c-calendar-month {
8254
+ --pf-c-calendar-month--BackgroundColor: var(--pf-global--BackgroundColor--100);
8255
+ --pf-c-calendar-month--PaddingTop: var(--pf-global--spacer--lg);
8256
+ --pf-c-calendar-month--PaddingRight: var(--pf-global--spacer--lg);
8257
+ --pf-c-calendar-month--PaddingBottom: var(--pf-global--spacer--md);
8258
+ --pf-c-calendar-month--PaddingLeft: var(--pf-global--spacer--lg);
8259
+ --pf-c-calendar-month--FontSize: var(--pf-global--FontSize--sm);
8260
+ --pf-c-calendar-month__header--MarginBottom: var(--pf-global--spacer--md);
8261
+ --pf-c-calendar-month__header-year--Width: 8ch;
8262
+ --pf-c-calendar-month__header-nav-control--MarginRight: 0;
8263
+ --pf-c-calendar-month__header-nav-control--MarginLeft: 0;
8264
+ --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: var(--pf-global--spacer--sm);
8265
+ --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
8266
+ --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: calc(var(--pf-global--spacer--md) * -1);
8267
+ --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: var(--pf-global--spacer--sm);
8268
+ --pf-c-calendar-month__days--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
8269
+ --pf-c-calendar-month__days--BorderBottomColor: var(--pf-global--BorderColor--100);
8270
+ --pf-c-calendar-month__day--PaddingBottom: var(--pf-global--spacer--md);
8271
+ --pf-c-calendar-month__day--FontWeight: var(--pf-global--FontWeight--normal);
8272
+ --pf-c-calendar-month__dates-cell--PaddingTop: 0.125rem;
8273
+ --pf-c-calendar-month__dates-cell--PaddingRight: 0.125rem;
8274
+ --pf-c-calendar-month__dates-cell--PaddingBottom: 0.125rem;
8275
+ --pf-c-calendar-month__dates-cell--PaddingLeft: 0.125rem;
8276
+ --pf-c-calendar-month__dates-row--first-child__dates-cell--PaddingTop: var(--pf-global--spacer--sm);
8277
+ --pf-c-calendar-month__dates-cell--m-current__date--BackgroundColor: var(--pf-global--BackgroundColor--200);
8278
+ --pf-c-calendar-month__dates-cell--m-selected__date--BackgroundColor: var(--pf-global--active-color--100);
8279
+ --pf-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-global--active-color--100);
8280
+ --pf-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor: var(--pf-global--primary-color--200);
8281
+ --pf-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-global--primary-color--200);
8282
+ --pf-c-calendar-month__dates-cell--m-selected__date--focus--BoxShadow: 0 0 0.3125rem var(--pf-global--primary-color--100);
8283
+ --pf-c-calendar-month__dates-cell--m-selected__date--Color: var(--pf-global--Color--light-100);
8284
+ --pf-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
8285
+ --pf-c-calendar-month__dates-cell--before--Top: 0;
8286
+ --pf-c-calendar-month__dates-cell--before--Right: 0;
8287
+ --pf-c-calendar-month__dates-cell--before--Bottom: var(--pf-c-calendar-month__dates-cell--PaddingBottom);
8288
+ --pf-c-calendar-month__dates-cell--before--Left: 0;
8289
+ --pf-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-global--palette--blue-50);
8290
+ --pf-c-calendar-month__dates-cell--m-in-range--m-start-range--before--Left: 50%;
8291
+ --pf-c-calendar-month__dates-cell--m-in-range--m-end-range--before--Right: 50%;
8292
+ --pf-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-global--palette--blue-100);
8293
+ --pf-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-global--palette--blue-100);
8294
+ --pf-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-global--disabled-color--100);
8295
+ --pf-c-calendar-month__date--Width: 4ch;
8296
+ --pf-c-calendar-month__date--Height: 4ch;
8297
+ --pf-c-calendar-month__date--BorderRadius: var(--pf-global--BorderRadius--lg);
8298
+ --pf-c-calendar-month__date--Color: var(--pf-global--Color--100);
8299
+ --pf-c-calendar-month__date--BackgroundColor: transparent;
8300
+ --pf-c-calendar-month__date--disabled--Color: var(--pf-global--disabled-color--200);
8301
+ --pf-c-calendar-month__date--after--BorderWidth: var(--pf-global--BorderWidth--md);
8302
+ --pf-c-calendar-month__date--after--BorderColor: transparent;
8303
+ --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-global--palette--blue-50);
8304
+ --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-global--palette--blue-50);
8305
+ --pf-c-calendar-month__date--focus--after--BorderColor: var(--pf-global--active-color--100);
8306
+ --pf-c-calendar-month__date--focus--BoxShadow: none;
8307
+ color: var(--pf-global--Color--100);
8308
+ display: inline-flex;
8309
+ flex-direction: column;
8310
+ padding: var(--pf-c-calendar-month--PaddingTop) var(--pf-c-calendar-month--PaddingRight) var(--pf-c-calendar-month--PaddingBottom) var(--pf-c-calendar-month--PaddingLeft);
8311
+ font-size: var(--pf-c-calendar-month--FontSize);
8312
+ background-color: var(--pf-c-calendar-month--BackgroundColor);
8313
+ }
8314
+
8315
+ .pf-c-calendar-month__header {
8316
+ display: flex;
8317
+ margin-bottom: var(--pf-c-calendar-month__header--MarginBottom);
8318
+ }
8319
+
8320
+ .pf-c-calendar-month__header-nav-control {
8321
+ margin-right: var(--pf-c-calendar-month__header-nav-control--MarginRight);
8322
+ margin-left: var(--pf-c-calendar-month__header-nav-control--MarginLeft);
8323
+ }
8324
+
8325
+ .pf-c-calendar-month__header-nav-control.pf-m-prev-month {
8326
+ --pf-c-calendar-month__header-nav-control--MarginRight: var(--pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight);
8327
+ --pf-c-calendar-month__header-nav-control--MarginLeft: var(--pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft);
8328
+ }
8329
+
8330
+ .pf-c-calendar-month__header-nav-control.pf-m-next-month {
8331
+ --pf-c-calendar-month__header-nav-control--MarginRight: var(--pf-c-calendar-month__header-nav-control--m-next-month--MarginRight);
8332
+ --pf-c-calendar-month__header-nav-control--MarginLeft: var(--pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft);
8333
+ }
8334
+
8335
+ .pf-c-calendar-month__header-month {
8336
+ flex-grow: 1;
8337
+ }
8338
+
8339
+ .pf-c-calendar-month__header-year {
8340
+ width: var(--pf-c-calendar-month__header-year--Width);
8341
+ }
8342
+
8343
+ .pf-c-calendar-month__calendar {
8344
+ table-layout: fixed;
8345
+ }
8346
+
8347
+ .pf-c-calendar-month__days {
8348
+ border-bottom: var(--pf-c-calendar-month__days--BorderBottomWidth) solid var(--pf-c-calendar-month__days--BorderBottomColor);
8349
+ }
8350
+
8351
+ .pf-c-calendar-month__day {
8352
+ padding-bottom: var(--pf-c-calendar-month__day--PaddingBottom);
8353
+ font-weight: var(--pf-c-calendar-month__day--FontWeight);
8354
+ text-align: center;
8355
+ }
8356
+
8357
+ .pf-c-calendar-month__dates-row:first-child {
8358
+ --pf-c-calendar-month__dates-cell--PaddingTop: var(--pf-c-calendar-month__dates-row--first-child__dates-cell--PaddingTop);
8359
+ }
8360
+
8361
+ .pf-c-calendar-month__dates-cell {
8362
+ --pf-c-calendar-month__dates-cell--before--Top: var(--pf-c-calendar-month__dates-cell--PaddingTop);
8363
+ position: relative;
8364
+ padding: var(--pf-c-calendar-month__dates-cell--PaddingTop) var(--pf-c-calendar-month__dates-cell--PaddingRight) var(--pf-c-calendar-month__dates-cell--PaddingBottom) var(--pf-c-calendar-month__dates-cell--PaddingLeft);
8365
+ text-align: center;
8366
+ }
8367
+
8368
+ .pf-c-calendar-month__dates-cell::before {
8369
+ position: absolute;
8370
+ top: var(--pf-c-calendar-month__dates-cell--before--Top);
8371
+ right: var(--pf-c-calendar-month__dates-cell--before--Right);
8372
+ bottom: var(--pf-c-calendar-month__dates-cell--before--Bottom);
8373
+ left: var(--pf-c-calendar-month__dates-cell--before--Left);
8374
+ content: "";
8375
+ background-color: var(--pf-c-calendar-month__dates-cell--before--BackgroundColor);
8376
+ }
8377
+
8378
+ .pf-c-calendar-month__dates-cell.pf-m-current {
8379
+ --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-current__date--BackgroundColor);
8380
+ }
8381
+
8382
+ .pf-c-calendar-month__dates-cell.pf-m-in-range {
8383
+ --pf-c-calendar-month__dates-cell--before--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor);
8384
+ --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor);
8385
+ --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor);
8386
+ }
8387
+
8388
+ .pf-c-calendar-month__dates-cell.pf-m-start-range {
8389
+ --pf-c-calendar-month__dates-cell--before--Left: var(--pf-c-calendar-month__dates-cell--m-in-range--m-start-range--before--Left);
8390
+ }
8391
+
8392
+ .pf-c-calendar-month__dates-cell.pf-m-end-range {
8393
+ --pf-c-calendar-month__dates-cell--before--Right: var(--pf-c-calendar-month__dates-cell--m-in-range--m-end-range--before--Right);
8394
+ }
8395
+
8396
+ .pf-c-calendar-month__dates-cell.pf-m-adjacent-month {
8397
+ --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__dates-cell--m-adjacent-month__date--Color);
8398
+ }
8399
+
8400
+ .pf-c-calendar-month__dates-cell.pf-m-selected {
8401
+ --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--BackgroundColor);
8402
+ --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor);
8403
+ --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor);
8404
+ --pf-c-calendar-month__date--focus--after--BorderColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor);
8405
+ --pf-c-calendar-month__date--focus--BoxShadow: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--BoxShadow);
8406
+ --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__dates-cell--m-selected__date--Color);
8407
+ }
8408
+
8409
+ .pf-c-calendar-month__dates-cell.pf-m-disabled {
8410
+ --pf-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
8411
+ --pf-c-calendar-month__date--BackgroundColor: transparent;
8412
+ }
8413
+
8414
+ .pf-c-calendar-month__date {
8415
+ position: relative;
8416
+ display: inline-flex;
8417
+ align-items: center;
8418
+ justify-content: center;
8419
+ width: var(--pf-c-calendar-month__date--Width);
8420
+ height: var(--pf-c-calendar-month__date--Height);
8421
+ line-height: 1;
8422
+ color: var(--pf-c-calendar-month__date--Color);
8423
+ background-color: var(--pf-c-calendar-month__date--BackgroundColor);
8424
+ border: 0;
8425
+ }
8426
+
8427
+ .pf-c-calendar-month__date::after {
8428
+ position: absolute;
8429
+ top: 0;
8430
+ right: 0;
8431
+ bottom: 0;
8432
+ left: 0;
8433
+ content: "";
8434
+ border: var(--pf-c-calendar-month__date--after--BorderWidth) solid var(--pf-c-calendar-month__date--after--BorderColor);
8435
+ }
8436
+
8437
+ .pf-c-calendar-month__date, .pf-c-calendar-month__date::after {
8438
+ border-radius: var(--pf-c-calendar-month__date--BorderRadius);
8439
+ }
8440
+
8441
+ .pf-c-calendar-month__date:hover, .pf-c-calendar-month__date.pf-m-hover {
8442
+ --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__date--hover--BackgroundColor);
8443
+ }
8444
+
8445
+ .pf-c-calendar-month__date:focus, .pf-c-calendar-month__date.pf-m-focus {
8446
+ --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__date--focus--BackgroundColor);
8447
+ --pf-c-calendar-month__date--after--BorderColor: var(--pf-c-calendar-month__date--focus--after--BorderColor);
8448
+ outline: 0;
8449
+ box-shadow: var(--pf-c-calendar-month__date--focus--BoxShadow);
8450
+ }
8451
+
8452
+ .pf-c-calendar-month__date:disabled {
8453
+ pointer-events: none;
8454
+ --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__date--disabled--Color);
8455
+ --pf-c-calendar-month__date--hover--focus--BorderColor: transparent;
8456
+ }
8457
+
8212
8458
  .pf-c-card {
8213
8459
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
8214
8460
  --pf-c-card--BoxShadow: var(--pf-global--BoxShadow--sm);
@@ -8556,222 +8802,7 @@ button.pf-c-breadcrumb__link {
8556
8802
  font-weight: var(--pf-global--FontWeight--normal);
8557
8803
  }
8558
8804
 
8559
- .pf-c-calendar-month {
8560
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
8561
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
8562
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
8563
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
8564
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
8565
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
8566
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
8567
- }
8568
-
8569
- .pf-c-calendar-month {
8570
- --pf-c-calendar-month--BackgroundColor: var(--pf-global--BackgroundColor--100);
8571
- --pf-c-calendar-month--PaddingTop: var(--pf-global--spacer--lg);
8572
- --pf-c-calendar-month--PaddingRight: var(--pf-global--spacer--lg);
8573
- --pf-c-calendar-month--PaddingBottom: var(--pf-global--spacer--md);
8574
- --pf-c-calendar-month--PaddingLeft: var(--pf-global--spacer--lg);
8575
- --pf-c-calendar-month--FontSize: var(--pf-global--FontSize--sm);
8576
- --pf-c-calendar-month__header--MarginBottom: var(--pf-global--spacer--md);
8577
- --pf-c-calendar-month__header-year--Width: 8ch;
8578
- --pf-c-calendar-month__header-nav-control--MarginRight: 0;
8579
- --pf-c-calendar-month__header-nav-control--MarginLeft: 0;
8580
- --pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight: var(--pf-global--spacer--sm);
8581
- --pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
8582
- --pf-c-calendar-month__header-nav-control--m-next-month--MarginRight: calc(var(--pf-global--spacer--md) * -1);
8583
- --pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft: var(--pf-global--spacer--sm);
8584
- --pf-c-calendar-month__days--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
8585
- --pf-c-calendar-month__days--BorderBottomColor: var(--pf-global--BorderColor--100);
8586
- --pf-c-calendar-month__day--PaddingBottom: var(--pf-global--spacer--md);
8587
- --pf-c-calendar-month__day--FontWeight: var(--pf-global--FontWeight--normal);
8588
- --pf-c-calendar-month__dates-cell--PaddingTop: 0.125rem;
8589
- --pf-c-calendar-month__dates-cell--PaddingRight: 0.125rem;
8590
- --pf-c-calendar-month__dates-cell--PaddingBottom: 0.125rem;
8591
- --pf-c-calendar-month__dates-cell--PaddingLeft: 0.125rem;
8592
- --pf-c-calendar-month__dates-row--first-child__dates-cell--PaddingTop: var(--pf-global--spacer--sm);
8593
- --pf-c-calendar-month__dates-cell--m-current__date--BackgroundColor: var(--pf-global--BackgroundColor--200);
8594
- --pf-c-calendar-month__dates-cell--m-selected__date--BackgroundColor: var(--pf-global--active-color--100);
8595
- --pf-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-global--active-color--100);
8596
- --pf-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor: var(--pf-global--primary-color--200);
8597
- --pf-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-global--primary-color--200);
8598
- --pf-c-calendar-month__dates-cell--m-selected__date--focus--BoxShadow: 0 0 0.3125rem var(--pf-global--primary-color--100);
8599
- --pf-c-calendar-month__dates-cell--m-selected__date--Color: var(--pf-global--Color--light-100);
8600
- --pf-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
8601
- --pf-c-calendar-month__dates-cell--before--Top: 0;
8602
- --pf-c-calendar-month__dates-cell--before--Right: 0;
8603
- --pf-c-calendar-month__dates-cell--before--Bottom: var(--pf-c-calendar-month__dates-cell--PaddingBottom);
8604
- --pf-c-calendar-month__dates-cell--before--Left: 0;
8605
- --pf-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-global--palette--blue-50);
8606
- --pf-c-calendar-month__dates-cell--m-in-range--m-start-range--before--Left: 50%;
8607
- --pf-c-calendar-month__dates-cell--m-in-range--m-end-range--before--Right: 50%;
8608
- --pf-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-global--palette--blue-100);
8609
- --pf-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-global--palette--blue-100);
8610
- --pf-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-global--disabled-color--100);
8611
- --pf-c-calendar-month__date--Width: 4ch;
8612
- --pf-c-calendar-month__date--Height: 4ch;
8613
- --pf-c-calendar-month__date--BorderRadius: var(--pf-global--BorderRadius--lg);
8614
- --pf-c-calendar-month__date--Color: var(--pf-global--Color--100);
8615
- --pf-c-calendar-month__date--BackgroundColor: transparent;
8616
- --pf-c-calendar-month__date--disabled--Color: var(--pf-global--disabled-color--200);
8617
- --pf-c-calendar-month__date--after--BorderWidth: var(--pf-global--BorderWidth--md);
8618
- --pf-c-calendar-month__date--after--BorderColor: transparent;
8619
- --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-global--palette--blue-50);
8620
- --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-global--palette--blue-50);
8621
- --pf-c-calendar-month__date--focus--after--BorderColor: var(--pf-global--active-color--100);
8622
- --pf-c-calendar-month__date--focus--BoxShadow: none;
8623
- color: var(--pf-global--Color--100);
8624
- display: inline-flex;
8625
- flex-direction: column;
8626
- padding: var(--pf-c-calendar-month--PaddingTop) var(--pf-c-calendar-month--PaddingRight) var(--pf-c-calendar-month--PaddingBottom) var(--pf-c-calendar-month--PaddingLeft);
8627
- font-size: var(--pf-c-calendar-month--FontSize);
8628
- background-color: var(--pf-c-calendar-month--BackgroundColor);
8629
- }
8630
-
8631
- .pf-c-calendar-month__header {
8632
- display: flex;
8633
- margin-bottom: var(--pf-c-calendar-month__header--MarginBottom);
8634
- }
8635
-
8636
- .pf-c-calendar-month__header-nav-control {
8637
- margin-right: var(--pf-c-calendar-month__header-nav-control--MarginRight);
8638
- margin-left: var(--pf-c-calendar-month__header-nav-control--MarginLeft);
8639
- }
8640
-
8641
- .pf-c-calendar-month__header-nav-control.pf-m-prev-month {
8642
- --pf-c-calendar-month__header-nav-control--MarginRight: var(--pf-c-calendar-month__header-nav-control--m-prev-month--MarginRight);
8643
- --pf-c-calendar-month__header-nav-control--MarginLeft: var(--pf-c-calendar-month__header-nav-control--m-prev-month--MarginLeft);
8644
- }
8645
-
8646
- .pf-c-calendar-month__header-nav-control.pf-m-next-month {
8647
- --pf-c-calendar-month__header-nav-control--MarginRight: var(--pf-c-calendar-month__header-nav-control--m-next-month--MarginRight);
8648
- --pf-c-calendar-month__header-nav-control--MarginLeft: var(--pf-c-calendar-month__header-nav-control--m-next-month--MarginLeft);
8649
- }
8650
-
8651
- .pf-c-calendar-month__header-month {
8652
- flex-grow: 1;
8653
- }
8654
-
8655
- .pf-c-calendar-month__header-year {
8656
- width: var(--pf-c-calendar-month__header-year--Width);
8657
- }
8658
-
8659
- .pf-c-calendar-month__calendar {
8660
- table-layout: fixed;
8661
- }
8662
-
8663
- .pf-c-calendar-month__days {
8664
- border-bottom: var(--pf-c-calendar-month__days--BorderBottomWidth) solid var(--pf-c-calendar-month__days--BorderBottomColor);
8665
- }
8666
-
8667
- .pf-c-calendar-month__day {
8668
- padding-bottom: var(--pf-c-calendar-month__day--PaddingBottom);
8669
- font-weight: var(--pf-c-calendar-month__day--FontWeight);
8670
- text-align: center;
8671
- }
8672
-
8673
- .pf-c-calendar-month__dates-row:first-child {
8674
- --pf-c-calendar-month__dates-cell--PaddingTop: var(--pf-c-calendar-month__dates-row--first-child__dates-cell--PaddingTop);
8675
- }
8676
-
8677
- .pf-c-calendar-month__dates-cell {
8678
- --pf-c-calendar-month__dates-cell--before--Top: var(--pf-c-calendar-month__dates-cell--PaddingTop);
8679
- position: relative;
8680
- padding: var(--pf-c-calendar-month__dates-cell--PaddingTop) var(--pf-c-calendar-month__dates-cell--PaddingRight) var(--pf-c-calendar-month__dates-cell--PaddingBottom) var(--pf-c-calendar-month__dates-cell--PaddingLeft);
8681
- text-align: center;
8682
- }
8683
-
8684
- .pf-c-calendar-month__dates-cell::before {
8685
- position: absolute;
8686
- top: var(--pf-c-calendar-month__dates-cell--before--Top);
8687
- right: var(--pf-c-calendar-month__dates-cell--before--Right);
8688
- bottom: var(--pf-c-calendar-month__dates-cell--before--Bottom);
8689
- left: var(--pf-c-calendar-month__dates-cell--before--Left);
8690
- content: "";
8691
- background-color: var(--pf-c-calendar-month__dates-cell--before--BackgroundColor);
8692
- }
8693
-
8694
- .pf-c-calendar-month__dates-cell.pf-m-current {
8695
- --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-current__date--BackgroundColor);
8696
- }
8697
-
8698
- .pf-c-calendar-month__dates-cell.pf-m-in-range {
8699
- --pf-c-calendar-month__dates-cell--before--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor);
8700
- --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor);
8701
- --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor);
8702
- }
8703
-
8704
- .pf-c-calendar-month__dates-cell.pf-m-start-range {
8705
- --pf-c-calendar-month__dates-cell--before--Left: var(--pf-c-calendar-month__dates-cell--m-in-range--m-start-range--before--Left);
8706
- }
8707
-
8708
- .pf-c-calendar-month__dates-cell.pf-m-end-range {
8709
- --pf-c-calendar-month__dates-cell--before--Right: var(--pf-c-calendar-month__dates-cell--m-in-range--m-end-range--before--Right);
8710
- }
8711
-
8712
- .pf-c-calendar-month__dates-cell.pf-m-adjacent-month {
8713
- --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__dates-cell--m-adjacent-month__date--Color);
8714
- }
8715
-
8716
- .pf-c-calendar-month__dates-cell.pf-m-selected {
8717
- --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--BackgroundColor);
8718
- --pf-c-calendar-month__date--hover--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor);
8719
- --pf-c-calendar-month__date--focus--BackgroundColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor);
8720
- --pf-c-calendar-month__date--focus--after--BorderColor: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor);
8721
- --pf-c-calendar-month__date--focus--BoxShadow: var(--pf-c-calendar-month__dates-cell--m-selected__date--focus--BoxShadow);
8722
- --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__dates-cell--m-selected__date--Color);
8723
- }
8724
-
8725
- .pf-c-calendar-month__dates-cell.pf-m-disabled {
8726
- --pf-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
8727
- --pf-c-calendar-month__date--BackgroundColor: transparent;
8728
- }
8729
-
8730
- .pf-c-calendar-month__date {
8731
- position: relative;
8732
- display: inline-flex;
8733
- align-items: center;
8734
- justify-content: center;
8735
- width: var(--pf-c-calendar-month__date--Width);
8736
- height: var(--pf-c-calendar-month__date--Height);
8737
- line-height: 1;
8738
- color: var(--pf-c-calendar-month__date--Color);
8739
- background-color: var(--pf-c-calendar-month__date--BackgroundColor);
8740
- border: 0;
8741
- }
8742
-
8743
- .pf-c-calendar-month__date::after {
8744
- position: absolute;
8745
- top: 0;
8746
- right: 0;
8747
- bottom: 0;
8748
- left: 0;
8749
- content: "";
8750
- border: var(--pf-c-calendar-month__date--after--BorderWidth) solid var(--pf-c-calendar-month__date--after--BorderColor);
8751
- }
8752
-
8753
- .pf-c-calendar-month__date, .pf-c-calendar-month__date::after {
8754
- border-radius: var(--pf-c-calendar-month__date--BorderRadius);
8755
- }
8756
-
8757
- .pf-c-calendar-month__date:hover, .pf-c-calendar-month__date.pf-m-hover {
8758
- --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__date--hover--BackgroundColor);
8759
- }
8760
-
8761
- .pf-c-calendar-month__date:focus, .pf-c-calendar-month__date.pf-m-focus {
8762
- --pf-c-calendar-month__date--BackgroundColor: var(--pf-c-calendar-month__date--focus--BackgroundColor);
8763
- --pf-c-calendar-month__date--after--BorderColor: var(--pf-c-calendar-month__date--focus--after--BorderColor);
8764
- outline: 0;
8765
- box-shadow: var(--pf-c-calendar-month__date--focus--BoxShadow);
8766
- }
8767
-
8768
- .pf-c-calendar-month__date:disabled {
8769
- pointer-events: none;
8770
- --pf-c-calendar-month__date--Color: var(--pf-c-calendar-month__date--disabled--Color);
8771
- --pf-c-calendar-month__date--hover--focus--BorderColor: transparent;
8772
- }
8773
-
8774
- .pf-c-chip-group {
8805
+ .pf-c-chip-group {
8775
8806
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
8776
8807
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
8777
8808
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -13666,37 +13697,6 @@ label.pf-c-input-group__text {
13666
13697
  --pf-c-sidebar__panel--FlexBasis: 100%;
13667
13698
  }
13668
13699
  }
13669
- .pf-c-action-list {
13670
- --pf-c-action-list--m-icon--spacer: 0;
13671
- --pf-c-action-list--child--spacer-base: var(--pf-global--spacer--md);
13672
- --pf-c-action-list--group--spacer-base: var(--pf-global--spacer--2xl);
13673
- }
13674
-
13675
- .pf-c-action-list,
13676
- .pf-c-action-list__group {
13677
- --pf-c-action-list--child--spacer: var(--pf-c-action-list--child--spacer-base);
13678
- --pf-c-action-list--group--spacer: var(--pf-c-action-list--group--spacer-base);
13679
- display: flex;
13680
- align-items: center;
13681
- }
13682
-
13683
- .pf-c-action-list > * + *,
13684
- .pf-c-action-list__group > * + * {
13685
- margin-left: var(--pf-c-action-list--child--spacer);
13686
- }
13687
-
13688
- .pf-c-action-list > * + .pf-c-action-list__group,
13689
- .pf-c-action-list .pf-c-action-list__group + *,
13690
- .pf-c-action-list__group > * + .pf-c-action-list__group,
13691
- .pf-c-action-list__group .pf-c-action-list__group + * {
13692
- margin-left: var(--pf-c-action-list--group--spacer);
13693
- }
13694
-
13695
- .pf-c-action-list.pf-m-icons,
13696
- .pf-c-action-list__group.pf-m-icons {
13697
- --pf-c-action-list--child--spacer: var(--pf-c-action-list--m-icon--spacer);
13698
- }
13699
-
13700
13700
  .pf-c-label {
13701
13701
  --pf-c-label--PaddingTop: var(--pf-global--spacer--xs);
13702
13702
  --pf-c-label--PaddingRight: var(--pf-global--spacer--sm);
@@ -18990,198 +18990,6 @@ ul.pf-c-list {
18990
18990
  flex: 1 0 auto;
18991
18991
  }
18992
18992
 
18993
- .pf-c-popover {
18994
- --pf-c-popover--FontSize: var(--pf-global--FontSize--sm);
18995
- --pf-c-popover--MinWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
18996
- --pf-c-popover--MaxWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
18997
- --pf-c-popover--BoxShadow: var(--pf-global--BoxShadow--lg);
18998
- --pf-c-popover--m-danger__title-icon--Color: var(--pf-global--danger-color--100);
18999
- --pf-c-popover--m-warning__title-icon--Color: var(--pf-global--warning-color--100);
19000
- --pf-c-popover--m-success__title-icon--Color: var(--pf-global--success-color--100);
19001
- --pf-c-popover--m-info__title-icon--Color: var(--pf-global--info-color--100);
19002
- --pf-c-popover--m-default__title-icon--Color: var(--pf-global--default-color--200);
19003
- --pf-c-popover--m-danger__title-text--Color: var(--pf-global--danger-color--200);
19004
- --pf-c-popover--m-warning__title-text--Color: var(--pf-global--warning-color--200);
19005
- --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--200);
19006
- --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--200);
19007
- --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--300);
19008
- --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--100);
19009
- --pf-c-popover__content--PaddingTop: var(--pf-global--spacer--md);
19010
- --pf-c-popover__content--PaddingRight: var(--pf-global--spacer--md);
19011
- --pf-c-popover__content--PaddingBottom: var(--pf-global--spacer--md);
19012
- --pf-c-popover__content--PaddingLeft: var(--pf-global--spacer--md);
19013
- --pf-c-popover__arrow--Width: var(--pf-global--arrow--width-lg);
19014
- --pf-c-popover__arrow--Height: var(--pf-global--arrow--width-lg);
19015
- --pf-c-popover__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
19016
- --pf-c-popover__arrow--BackgroundColor: var(--pf-global--BackgroundColor--100);
19017
- --pf-c-popover__arrow--m-top--TranslateX: -50%;
19018
- --pf-c-popover__arrow--m-top--TranslateY: 50%;
19019
- --pf-c-popover__arrow--m-top--Rotate: 45deg;
19020
- --pf-c-popover__arrow--m-right--TranslateX: -50%;
19021
- --pf-c-popover__arrow--m-right--TranslateY: -50%;
19022
- --pf-c-popover__arrow--m-right--Rotate: 45deg;
19023
- --pf-c-popover__arrow--m-bottom--TranslateX: -50%;
19024
- --pf-c-popover__arrow--m-bottom--TranslateY: -50%;
19025
- --pf-c-popover__arrow--m-bottom--Rotate: 45deg;
19026
- --pf-c-popover__arrow--m-left--TranslateX: 50%;
19027
- --pf-c-popover__arrow--m-left--TranslateY: -50%;
19028
- --pf-c-popover__arrow--m-left--Rotate: 45deg;
19029
- --pf-c-popover--c-button--MarginLeft: var(--pf-global--spacer--sm);
19030
- --pf-c-popover--c-button--Top: calc(var(--pf-c-popover__content--PaddingTop) - var(--pf-global--spacer--form-element));
19031
- --pf-c-popover--c-button--Right: var(--pf-global--spacer--md);
19032
- --pf-c-popover--c-button--sibling--PaddingRight: var(--pf-global--spacer--2xl);
19033
- --pf-c-popover--c-title--MarginBottom: var(--pf-global--spacer--sm);
19034
- --pf-c-popover__title--MarginBottom: var(--pf-global--spacer--sm);
19035
- --pf-c-popover__title--LineHeight: var(--pf-global--LineHeight--md);
19036
- --pf-c-popover__title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
19037
- --pf-c-popover__title--FontSize: var(--pf-global--FontSize--md);
19038
- --pf-c-popover__title-icon--MarginRight: var(--pf-global--spacer--sm);
19039
- --pf-c-popover__title-icon--Color: var(--pf-global--Color--100);
19040
- --pf-c-popover__footer--MarginTop: var(--pf-global--spacer--md);
19041
- position: relative;
19042
- min-width: var(--pf-c-popover--MinWidth);
19043
- max-width: var(--pf-c-popover--MaxWidth);
19044
- font-size: var(--pf-c-popover--FontSize);
19045
- box-shadow: var(--pf-c-popover--BoxShadow);
19046
- }
19047
-
19048
- .pf-c-popover.pf-m-no-padding {
19049
- --pf-c-popover__content--PaddingTop: 0px;
19050
- --pf-c-popover__content--PaddingRight: 0px;
19051
- --pf-c-popover__content--PaddingBottom: 0px;
19052
- --pf-c-popover__content--PaddingLeft: 0px;
19053
- }
19054
-
19055
- .pf-c-popover.pf-m-width-auto {
19056
- --pf-c-popover--MinWidth: auto;
19057
- --pf-c-popover--MaxWidth: none;
19058
- }
19059
-
19060
- .pf-c-popover.pf-m-top .pf-c-popover__arrow, .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-top-right .pf-c-popover__arrow {
19061
- bottom: 0;
19062
- left: 50%;
19063
- transform: translateX(var(--pf-c-popover__arrow--m-top--TranslateX)) translateY(var(--pf-c-popover__arrow--m-top--TranslateY)) rotate(var(--pf-c-popover__arrow--m-top--Rotate));
19064
- }
19065
-
19066
- .pf-c-popover.pf-m-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
19067
- top: 0;
19068
- left: 50%;
19069
- transform: translateX(var(--pf-c-popover__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-popover__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-popover__arrow--m-bottom--Rotate));
19070
- }
19071
-
19072
- .pf-c-popover.pf-m-left .pf-c-popover__arrow, .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow {
19073
- top: 50%;
19074
- right: 0;
19075
- transform: translateX(var(--pf-c-popover__arrow--m-left--TranslateX)) translateY(var(--pf-c-popover__arrow--m-left--TranslateY)) rotate(var(--pf-c-popover__arrow--m-left--Rotate));
19076
- }
19077
-
19078
- .pf-c-popover.pf-m-right .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
19079
- top: 50%;
19080
- left: 0;
19081
- transform: translateX(var(--pf-c-popover__arrow--m-right--TranslateX)) translateY(var(--pf-c-popover__arrow--m-right--TranslateY)) rotate(var(--pf-c-popover__arrow--m-right--Rotate));
19082
- }
19083
-
19084
- .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow {
19085
- top: var(--pf-c-popover__arrow--Height);
19086
- }
19087
-
19088
- .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
19089
- top: auto;
19090
- bottom: 0;
19091
- }
19092
-
19093
- .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow {
19094
- left: var(--pf-c-popover__arrow--Width);
19095
- }
19096
-
19097
- .pf-c-popover.pf-m-top-right .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
19098
- right: 0;
19099
- left: auto;
19100
- }
19101
-
19102
- .pf-c-popover.pf-m-danger {
19103
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-danger__title-icon--Color);
19104
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-danger__title-text--Color);
19105
- }
19106
-
19107
- .pf-c-popover.pf-m-warning {
19108
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-warning__title-icon--Color);
19109
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-warning__title-text--Color);
19110
- }
19111
-
19112
- .pf-c-popover.pf-m-success {
19113
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-success__title-icon--Color);
19114
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-success__title-text--Color);
19115
- }
19116
-
19117
- .pf-c-popover.pf-m-default {
19118
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-default__title-icon--Color);
19119
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-default__title-text--Color);
19120
- }
19121
-
19122
- .pf-c-popover.pf-m-info {
19123
- --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-info__title-icon--Color);
19124
- --pf-c-popover__title-text--Color: var(--pf-c-popover--m-info__title-text--Color);
19125
- }
19126
-
19127
- .pf-c-popover__content {
19128
- position: relative;
19129
- padding: var(--pf-c-popover__content--PaddingTop) var(--pf-c-popover__content--PaddingRight) var(--pf-c-popover__content--PaddingBottom) var(--pf-c-popover__content--PaddingLeft);
19130
- background-color: var(--pf-c-popover__content--BackgroundColor);
19131
- }
19132
-
19133
- .pf-c-popover__content > .pf-c-title {
19134
- margin-bottom: var(--pf-c-popover--c-title--MarginBottom);
19135
- }
19136
-
19137
- .pf-c-popover__content > .pf-c-button {
19138
- position: absolute;
19139
- top: var(--pf-c-popover--c-button--Top);
19140
- right: var(--pf-c-popover--c-button--Right);
19141
- }
19142
-
19143
- .pf-c-popover__content > .pf-c-button + * {
19144
- padding-right: var(--pf-c-popover--c-button--sibling--PaddingRight);
19145
- }
19146
-
19147
- .pf-c-popover__arrow {
19148
- position: absolute;
19149
- width: var(--pf-c-popover__arrow--Width);
19150
- height: var(--pf-c-popover__arrow--Height);
19151
- pointer-events: none;
19152
- background-color: var(--pf-c-popover__arrow--BackgroundColor);
19153
- box-shadow: var(--pf-c-popover__arrow--BoxShadow);
19154
- }
19155
-
19156
- .pf-c-popover__title {
19157
- flex: 0 0 auto;
19158
- margin-bottom: var(--pf-c-popover__title--MarginBottom);
19159
- font-family: var(--pf-c-popover__title--FontFamily);
19160
- font-size: var(--pf-c-popover__title--FontSize);
19161
- line-height: var(--pf-c-popover__title--LineHeight);
19162
- }
19163
-
19164
- .pf-c-popover__title.pf-m-icon {
19165
- display: flex;
19166
- }
19167
-
19168
- .pf-c-popover__title-icon {
19169
- margin-right: var(--pf-c-popover__title-icon--MarginRight);
19170
- color: var(--pf-c-popover__title-icon--Color);
19171
- }
19172
-
19173
- .pf-c-popover__title-text {
19174
- color: var(--pf-c-popover__title-text--Color, inherit);
19175
- }
19176
-
19177
- .pf-c-popover__body {
19178
- word-wrap: break-word;
19179
- }
19180
-
19181
- .pf-c-popover__footer {
19182
- margin-top: var(--pf-c-popover__footer--MarginTop);
19183
- }
19184
-
19185
18993
  .pf-c-pagination {
19186
18994
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
19187
18995
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
@@ -19533,457 +19341,649 @@ ul.pf-c-list {
19533
19341
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
19534
19342
  }
19535
19343
  }
19536
- .pf-c-progress {
19537
- --pf-c-progress--GridGap: var(--pf-global--spacer--md);
19538
- --pf-c-progress__bar--before--BackgroundColor: var(--pf-global--primary-color--100);
19539
- --pf-c-progress__bar--Height: var(--pf-global--spacer--md);
19540
- --pf-c-progress__bar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
19541
- --pf-c-progress__measure--m-static-width--MinWidth: 4.5ch;
19542
- --pf-c-progress__status-icon--Color: var(--pf-global--Color--100);
19543
- --pf-c-progress__status-icon--MarginLeft: var(--pf-global--spacer--sm);
19544
- --pf-c-progress__bar--before--Opacity: .2;
19545
- --pf-c-progress__indicator--Height: var(--pf-c-progress__bar--Height);
19546
- --pf-c-progress__indicator--BackgroundColor: var(--pf-c-progress__bar--before--BackgroundColor);
19547
- --pf-c-progress--m-success__bar--BackgroundColor: var(--pf-global--success-color--100);
19548
- --pf-c-progress--m-warning__bar--BackgroundColor: var(--pf-global--warning-color--100);
19549
- --pf-c-progress--m-danger__bar--BackgroundColor: var(--pf-global--danger-color--100);
19550
- --pf-c-progress--m-success__status-icon--Color: var(--pf-global--success-color--100);
19551
- --pf-c-progress--m-warning__status-icon--Color: var(--pf-global--warning-color--100);
19552
- --pf-c-progress--m-danger__status-icon--Color: var(--pf-global--danger-color--100);
19553
- --pf-c-progress--m-inside__indicator--MinWidth: var(--pf-global--spacer--xl);
19554
- --pf-c-progress--m-inside__measure--Color: var(--pf-global--Color--light-100);
19555
- --pf-c-progress--m-success--m-inside__measure--Color: var(--pf-global--Color--light-100);
19556
- --pf-c-progress--m-warning--m-inside__measure--Color: var(--pf-global--Color--dark-100);
19557
- --pf-c-progress--m-inside__measure--FontSize: var(--pf-global--FontSize--sm);
19558
- --pf-c-progress--m-outside__measure--FontSize: var(--pf-global--FontSize--sm);
19559
- --pf-c-progress--m-sm__bar--Height: var(--pf-global--spacer--sm);
19560
- --pf-c-progress--m-sm__description--FontSize: var(--pf-global--FontSize--sm);
19561
- --pf-c-progress--m-sm__measure--FontSize: var(--pf-global--FontSize--sm);
19562
- --pf-c-progress--m-lg__bar--Height: var(--pf-global--spacer--lg);
19563
- display: grid;
19564
- align-items: end;
19565
- grid-gap: var(--pf-c-progress--GridGap);
19566
- grid-template-columns: auto auto;
19567
- grid-template-rows: 1fr auto;
19568
- }
19569
-
19570
- .pf-c-progress.pf-m-sm {
19571
- --pf-c-progress__bar--Height: var(--pf-c-progress--m-sm__bar--Height);
19572
- }
19573
-
19574
- .pf-c-progress.pf-m-sm .pf-c-progress__description {
19575
- font-size: var(--pf-c-progress--m-sm__description--FontSize);
19576
- }
19577
-
19578
- .pf-c-progress.pf-m-sm .pf-c-progress__measure {
19579
- font-size: var(--pf-c-progress--m-sm__measure--FontSize);
19580
- }
19581
-
19582
- .pf-c-progress.pf-m-lg {
19583
- --pf-c-progress__bar--Height: var(--pf-c-progress--m-lg__bar--Height);
19584
- }
19585
-
19586
- .pf-c-progress.pf-m-inside .pf-c-progress__indicator {
19587
- display: flex;
19588
- align-items: center;
19589
- justify-content: center;
19590
- min-width: var(--pf-c-progress--m-inside__indicator--MinWidth);
19591
- }
19592
-
19593
- .pf-c-progress.pf-m-inside .pf-c-progress__measure {
19594
- font-size: var(--pf-c-progress--m-inside__measure--FontSize);
19595
- color: var(--pf-c-progress--m-inside__measure--Color);
19596
- text-align: center;
19597
- }
19598
-
19599
- .pf-c-progress.pf-m-outside .pf-c-progress__description {
19600
- grid-column: 1/3;
19601
- }
19602
-
19603
- .pf-c-progress.pf-m-outside .pf-c-progress__status {
19604
- grid-column: 2/3;
19605
- grid-row: 2/3;
19606
- align-self: center;
19607
- }
19608
-
19609
- .pf-c-progress.pf-m-outside .pf-c-progress__measure {
19610
- display: inline-block;
19611
- font-size: var(--pf-c-progress--m-outside__measure--FontSize);
19612
- }
19613
-
19614
- .pf-c-progress.pf-m-outside .pf-c-progress__measure.pf-m-static-width {
19615
- min-width: var(--pf-c-progress__measure--m-static-width--MinWidth);
19616
- text-align: left;
19617
- }
19344
+ .pf-c-popover {
19345
+ --pf-c-popover--FontSize: var(--pf-global--FontSize--sm);
19346
+ --pf-c-popover--MinWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
19347
+ --pf-c-popover--MaxWidth: calc(var(--pf-c-popover__content--PaddingLeft) + var(--pf-c-popover__content--PaddingRight) + 18.75rem);
19348
+ --pf-c-popover--BoxShadow: var(--pf-global--BoxShadow--lg);
19349
+ --pf-c-popover--m-danger__title-icon--Color: var(--pf-global--danger-color--100);
19350
+ --pf-c-popover--m-warning__title-icon--Color: var(--pf-global--warning-color--100);
19351
+ --pf-c-popover--m-success__title-icon--Color: var(--pf-global--success-color--100);
19352
+ --pf-c-popover--m-info__title-icon--Color: var(--pf-global--info-color--100);
19353
+ --pf-c-popover--m-default__title-icon--Color: var(--pf-global--default-color--200);
19354
+ --pf-c-popover--m-danger__title-text--Color: var(--pf-global--danger-color--200);
19355
+ --pf-c-popover--m-warning__title-text--Color: var(--pf-global--warning-color--200);
19356
+ --pf-c-popover--m-success__title-text--Color: var(--pf-global--success-color--200);
19357
+ --pf-c-popover--m-info__title-text--Color: var(--pf-global--info-color--200);
19358
+ --pf-c-popover--m-default__title-text--Color: var(--pf-global--default-color--300);
19359
+ --pf-c-popover__content--BackgroundColor: var(--pf-global--BackgroundColor--100);
19360
+ --pf-c-popover__content--PaddingTop: var(--pf-global--spacer--md);
19361
+ --pf-c-popover__content--PaddingRight: var(--pf-global--spacer--md);
19362
+ --pf-c-popover__content--PaddingBottom: var(--pf-global--spacer--md);
19363
+ --pf-c-popover__content--PaddingLeft: var(--pf-global--spacer--md);
19364
+ --pf-c-popover__arrow--Width: var(--pf-global--arrow--width-lg);
19365
+ --pf-c-popover__arrow--Height: var(--pf-global--arrow--width-lg);
19366
+ --pf-c-popover__arrow--BoxShadow: var(--pf-global--BoxShadow--lg);
19367
+ --pf-c-popover__arrow--BackgroundColor: var(--pf-global--BackgroundColor--100);
19368
+ --pf-c-popover__arrow--m-top--TranslateX: -50%;
19369
+ --pf-c-popover__arrow--m-top--TranslateY: 50%;
19370
+ --pf-c-popover__arrow--m-top--Rotate: 45deg;
19371
+ --pf-c-popover__arrow--m-right--TranslateX: -50%;
19372
+ --pf-c-popover__arrow--m-right--TranslateY: -50%;
19373
+ --pf-c-popover__arrow--m-right--Rotate: 45deg;
19374
+ --pf-c-popover__arrow--m-bottom--TranslateX: -50%;
19375
+ --pf-c-popover__arrow--m-bottom--TranslateY: -50%;
19376
+ --pf-c-popover__arrow--m-bottom--Rotate: 45deg;
19377
+ --pf-c-popover__arrow--m-left--TranslateX: 50%;
19378
+ --pf-c-popover__arrow--m-left--TranslateY: -50%;
19379
+ --pf-c-popover__arrow--m-left--Rotate: 45deg;
19380
+ --pf-c-popover--c-button--MarginLeft: var(--pf-global--spacer--sm);
19381
+ --pf-c-popover--c-button--Top: calc(var(--pf-c-popover__content--PaddingTop) - var(--pf-global--spacer--form-element));
19382
+ --pf-c-popover--c-button--Right: var(--pf-global--spacer--md);
19383
+ --pf-c-popover--c-button--sibling--PaddingRight: var(--pf-global--spacer--2xl);
19384
+ --pf-c-popover--c-title--MarginBottom: var(--pf-global--spacer--sm);
19385
+ --pf-c-popover__title--MarginBottom: var(--pf-global--spacer--sm);
19386
+ --pf-c-popover__title--LineHeight: var(--pf-global--LineHeight--md);
19387
+ --pf-c-popover__title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
19388
+ --pf-c-popover__title--FontSize: var(--pf-global--FontSize--md);
19389
+ --pf-c-popover__title-icon--MarginRight: var(--pf-global--spacer--sm);
19390
+ --pf-c-popover__title-icon--Color: var(--pf-global--Color--100);
19391
+ --pf-c-popover__footer--MarginTop: var(--pf-global--spacer--md);
19392
+ position: relative;
19393
+ min-width: var(--pf-c-popover--MinWidth);
19394
+ max-width: var(--pf-c-popover--MaxWidth);
19395
+ font-size: var(--pf-c-popover--FontSize);
19396
+ box-shadow: var(--pf-c-popover--BoxShadow);
19397
+ }
19618
19398
 
19619
- .pf-c-progress.pf-m-outside .pf-c-progress__bar,
19620
- .pf-c-progress.pf-m-outside .pf-c-progress__indicator {
19621
- grid-column: 1/2;
19399
+ .pf-c-popover.pf-m-no-padding {
19400
+ --pf-c-popover__content--PaddingTop: 0px;
19401
+ --pf-c-popover__content--PaddingRight: 0px;
19402
+ --pf-c-popover__content--PaddingBottom: 0px;
19403
+ --pf-c-popover__content--PaddingLeft: 0px;
19622
19404
  }
19623
19405
 
19624
- .pf-c-progress.pf-m-singleline {
19625
- grid-template-rows: 1fr;
19406
+ .pf-c-popover.pf-m-width-auto {
19407
+ --pf-c-popover--MinWidth: auto;
19408
+ --pf-c-popover--MaxWidth: none;
19626
19409
  }
19627
19410
 
19628
- .pf-c-progress.pf-m-singleline .pf-c-progress__description {
19629
- display: none;
19630
- visibility: hidden;
19411
+ .pf-c-popover.pf-m-top .pf-c-popover__arrow, .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-top-right .pf-c-popover__arrow {
19412
+ bottom: 0;
19413
+ left: 50%;
19414
+ transform: translateX(var(--pf-c-popover__arrow--m-top--TranslateX)) translateY(var(--pf-c-popover__arrow--m-top--TranslateY)) rotate(var(--pf-c-popover__arrow--m-top--Rotate));
19631
19415
  }
19632
19416
 
19633
- .pf-c-progress.pf-m-singleline .pf-c-progress__bar {
19634
- grid-row: 1/2;
19635
- grid-column: 1/2;
19417
+ .pf-c-popover.pf-m-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
19418
+ top: 0;
19419
+ left: 50%;
19420
+ transform: translateX(var(--pf-c-popover__arrow--m-bottom--TranslateX)) translateY(var(--pf-c-popover__arrow--m-bottom--TranslateY)) rotate(var(--pf-c-popover__arrow--m-bottom--Rotate));
19636
19421
  }
19637
19422
 
19638
- .pf-c-progress.pf-m-singleline .pf-c-progress__status {
19639
- grid-row: 1/2;
19640
- grid-column: 2/3;
19423
+ .pf-c-popover.pf-m-left .pf-c-popover__arrow, .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow {
19424
+ top: 50%;
19425
+ right: 0;
19426
+ transform: translateX(var(--pf-c-popover__arrow--m-left--TranslateX)) translateY(var(--pf-c-popover__arrow--m-left--TranslateY)) rotate(var(--pf-c-popover__arrow--m-left--Rotate));
19641
19427
  }
19642
19428
 
19643
- .pf-c-progress.pf-m-outside, .pf-c-progress.pf-m-singleline {
19644
- grid-template-columns: 1fr fit-content(50%);
19429
+ .pf-c-popover.pf-m-right .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
19430
+ top: 50%;
19431
+ left: 0;
19432
+ transform: translateX(var(--pf-c-popover__arrow--m-right--TranslateX)) translateY(var(--pf-c-popover__arrow--m-right--TranslateY)) rotate(var(--pf-c-popover__arrow--m-right--Rotate));
19645
19433
  }
19646
19434
 
19647
- .pf-c-progress.pf-m-success {
19648
- --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-success__bar--BackgroundColor);
19649
- --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-success__status-icon--Color);
19650
- --pf-c-progress--m-inside__measure--Color: var(--pf-c-progress--m-success--m-inside__measure--Color);
19435
+ .pf-c-popover.pf-m-left-top .pf-c-popover__arrow, .pf-c-popover.pf-m-right-top .pf-c-popover__arrow {
19436
+ top: var(--pf-c-popover__arrow--Height);
19651
19437
  }
19652
19438
 
19653
- .pf-c-progress.pf-m-warning {
19654
- --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-warning__bar--BackgroundColor);
19655
- --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-warning__status-icon--Color);
19656
- --pf-c-progress--m-inside__measure--Color: var(--pf-c-progress--m-warning--m-inside__measure--Color);
19439
+ .pf-c-popover.pf-m-left-bottom .pf-c-popover__arrow, .pf-c-popover.pf-m-right-bottom .pf-c-popover__arrow {
19440
+ top: auto;
19441
+ bottom: 0;
19657
19442
  }
19658
19443
 
19659
- .pf-c-progress.pf-m-danger {
19660
- --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-danger__bar--BackgroundColor);
19661
- --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-danger__status-icon--Color);
19444
+ .pf-c-popover.pf-m-top-left .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-left .pf-c-popover__arrow {
19445
+ left: var(--pf-c-popover__arrow--Width);
19662
19446
  }
19663
19447
 
19664
- .pf-c-progress__description {
19665
- word-break: break-word;
19666
- grid-column: 1/2;
19448
+ .pf-c-popover.pf-m-top-right .pf-c-popover__arrow, .pf-c-popover.pf-m-bottom-right .pf-c-popover__arrow {
19449
+ right: 0;
19450
+ left: auto;
19667
19451
  }
19668
19452
 
19669
- .pf-c-progress__description.pf-m-truncate {
19670
- overflow: hidden;
19671
- text-overflow: ellipsis;
19672
- white-space: nowrap;
19453
+ .pf-c-popover.pf-m-danger {
19454
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-danger__title-icon--Color);
19455
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-danger__title-text--Color);
19673
19456
  }
19674
19457
 
19675
- .pf-c-progress__status {
19676
- grid-column: 2/3;
19677
- grid-row: 1/2;
19678
- text-align: right;
19679
- word-break: break-word;
19458
+ .pf-c-popover.pf-m-warning {
19459
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-warning__title-icon--Color);
19460
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-warning__title-text--Color);
19680
19461
  }
19681
19462
 
19682
- .pf-c-progress__status-icon {
19683
- margin-left: var(--pf-c-progress__status-icon--MarginLeft);
19684
- color: var(--pf-c-progress__status-icon--Color);
19463
+ .pf-c-popover.pf-m-success {
19464
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-success__title-icon--Color);
19465
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-success__title-text--Color);
19685
19466
  }
19686
19467
 
19687
- .pf-c-progress__bar {
19468
+ .pf-c-popover.pf-m-default {
19469
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-default__title-icon--Color);
19470
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-default__title-text--Color);
19471
+ }
19472
+
19473
+ .pf-c-popover.pf-m-info {
19474
+ --pf-c-popover__title-icon--Color: var(--pf-c-popover--m-info__title-icon--Color);
19475
+ --pf-c-popover__title-text--Color: var(--pf-c-popover--m-info__title-text--Color);
19476
+ }
19477
+
19478
+ .pf-c-popover__content {
19688
19479
  position: relative;
19689
- grid-column: 1/3;
19690
- grid-row: 2/3;
19691
- align-self: center;
19692
- height: var(--pf-c-progress__bar--Height);
19693
- background-color: var(--pf-c-progress__bar--BackgroundColor);
19480
+ padding: var(--pf-c-popover__content--PaddingTop) var(--pf-c-popover__content--PaddingRight) var(--pf-c-popover__content--PaddingBottom) var(--pf-c-popover__content--PaddingLeft);
19481
+ background-color: var(--pf-c-popover__content--BackgroundColor);
19694
19482
  }
19695
19483
 
19696
- .pf-c-progress__bar::before {
19484
+ .pf-c-popover__content > .pf-c-title {
19485
+ margin-bottom: var(--pf-c-popover--c-title--MarginBottom);
19486
+ }
19487
+
19488
+ .pf-c-popover__content > .pf-c-button {
19697
19489
  position: absolute;
19698
- top: 0;
19699
- left: 0;
19700
- width: 100%;
19701
- height: 100%;
19702
- content: "";
19703
- background-color: var(--pf-c-progress__bar--before--BackgroundColor);
19704
- opacity: var(--pf-c-progress__bar--before--Opacity);
19490
+ top: var(--pf-c-popover--c-button--Top);
19491
+ right: var(--pf-c-popover--c-button--Right);
19705
19492
  }
19706
19493
 
19707
- .pf-c-progress__indicator {
19494
+ .pf-c-popover__content > .pf-c-button + * {
19495
+ padding-right: var(--pf-c-popover--c-button--sibling--PaddingRight);
19496
+ }
19497
+
19498
+ .pf-c-popover__arrow {
19708
19499
  position: absolute;
19709
- top: 0;
19710
- left: 0;
19711
- height: var(--pf-c-progress__indicator--Height);
19712
- background-color: var(--pf-c-progress__indicator--BackgroundColor);
19500
+ width: var(--pf-c-popover__arrow--Width);
19501
+ height: var(--pf-c-popover__arrow--Height);
19502
+ pointer-events: none;
19503
+ background-color: var(--pf-c-popover__arrow--BackgroundColor);
19504
+ box-shadow: var(--pf-c-popover__arrow--BoxShadow);
19713
19505
  }
19714
19506
 
19715
- .pf-c-progress-stepper {
19716
- --pf-c-progress-stepper--GridAutoFlow: column;
19717
- --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
19718
- --pf-c-progress-stepper--GridTemplateColumns: initial;
19719
- --pf-c-progress-stepper--m-vertical--GridAutoFlow: row;
19720
- --pf-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
19721
- --pf-c-progress-stepper--m-compact--GridAutoFlow: row;
19722
- --pf-c-progress-stepper--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
19723
- --pf-c-progress-stepper__step-connector--JustifyContent: start;
19724
- --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
19725
- --pf-c-progress-stepper__step-icon--ZIndex: var(--pf-global--ZIndex--xs);
19726
- --pf-c-progress-stepper__step-icon--Width: 1.75rem;
19727
- --pf-c-progress-stepper__step-icon--Height: var(--pf-c-progress-stepper__step-icon--Width);
19728
- --pf-c-progress-stepper__step-icon--FontSize: var(--pf-global--icon--FontSize--md);
19729
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--Color--100);
19730
- --pf-c-progress-stepper__step-icon--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
19731
- --pf-c-progress-stepper__step-icon--BorderWidth: var(--pf-global--BorderWidth--md);
19732
- --pf-c-progress-stepper__step-icon--BorderColor: var(--pf-global--BorderColor--100);
19733
- --pf-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
19734
- --pf-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-global--icon--FontSize--sm);
19735
- --pf-c-progress-stepper__pficon--MarginTop: 3px;
19736
- --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: -5px;
19737
- --pf-c-progress-stepper--m-compact__pficon--MarginTop: 2px;
19738
- --pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop: -3px;
19739
- --pf-c-progress-stepper__step-connector--before--Top: calc(var(--pf-c-progress-stepper__step-icon--Height) / 2);
19740
- --pf-c-progress-stepper__step-connector--before--Left: 0;
19741
- --pf-c-progress-stepper__step-connector--before--Width: 100%;
19742
- --pf-c-progress-stepper__step-connector--before--Height: auto;
19743
- --pf-c-progress-stepper__step-connector--before--BorderRightColor: unset;
19744
- --pf-c-progress-stepper__step-connector--before--BorderRightWidth: 0;
19745
- --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
19746
- --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-global--BorderColor--100);
19747
- --pf-c-progress-stepper__step-connector--before--Transform: translateY(-50%);
19748
- --pf-c-progress-stepper--m-center__step-connector--before--Left: 50%;
19749
- --pf-c-progress-stepper--m-vertical__step-connector--before--Top: 0;
19750
- --pf-c-progress-stepper--m-vertical__step-connector--before--Left: calc(var(--pf-c-progress-stepper__step-icon--Width) / 2);
19751
- --pf-c-progress-stepper--m-vertical__step-connector--before--Width: auto;
19752
- --pf-c-progress-stepper--m-vertical__step-connector--before--Height: 100%;
19753
- --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth: var(--pf-global--BorderWidth--md);
19754
- --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor: var(--pf-global--BorderColor--100);
19755
- --pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth: 0;
19756
- --pf-c-progress-stepper--m-vertical__step-connector--before--Transform: translateX(-50%);
19757
- --pf-c-progress-stepper__step-main--MarginTop: var(--pf-global--spacer--sm);
19758
- --pf-c-progress-stepper__step-main--MarginRight: var(--pf-global--spacer--sm);
19759
- --pf-c-progress-stepper__step-main--MarginBottom: 0;
19760
- --pf-c-progress-stepper__step-main--MarginLeft: 0;
19761
- --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
19762
- --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
19763
- --pf-c-progress-stepper--m-vertical__step-main--MarginTop: var(--pf-global--spacer--xs);
19764
- --pf-c-progress-stepper--m-vertical__step-main--MarginRight: 0;
19765
- --pf-c-progress-stepper--m-vertical__step-main--MarginBottom: var(--pf-global--spacer--xl);
19766
- --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-global--spacer--xs);
19767
- --pf-c-progress-stepper--m-compact__step-main--MarginTop: 0;
19768
- --pf-c-progress-stepper--m-compact__step-main--MarginBottom: var(--pf-global--spacer--sm);
19769
- --pf-c-progress-stepper__step-title--Color: var(--pf-global--Color--100);
19770
- --pf-c-progress-stepper__step-title--TextAlign: left;
19771
- --pf-c-progress-stepper__step-title--FontSize: var(--pf-global--FontSize--md);
19772
- --pf-c-progress-stepper__step-title--FontWeight: var(--pf-global--FontWeight--normal);
19773
- --pf-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-global--FontWeight--bold);
19774
- --pf-c-progress-stepper__step--m-current__step-title--Color: var(--pf-global--Color--100);
19775
- --pf-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-global--Color--200);
19776
- --pf-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-global--danger-color--100);
19777
- --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
19778
- --pf-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-global--FontSize--sm);
19779
- --pf-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-global--FontWeight--normal);
19780
- --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
19781
- --pf-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
19782
- --pf-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
19783
- --pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
19784
- --pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
19785
- --pf-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-global--Color--100);
19786
- --pf-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-global--Color--100);
19787
- --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-global--danger-color--200);
19788
- --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color: var(--pf-global--danger-color--200);
19789
- --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor: var(--pf-global--danger-color--100);
19790
- --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor: var(--pf-global--danger-color--200);
19791
- --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor: var(--pf-global--danger-color--200);
19792
- --pf-c-progress-stepper__step-description--MarginTop: var(--pf-global--spacer--xs);
19793
- --pf-c-progress-stepper__step-description--FontSize: var(--pf-global--FontSize--sm);
19794
- --pf-c-progress-stepper__step-description--Color: var(--pf-global--Color--200);
19795
- --pf-c-progress-stepper__step-description--TextAlign: left;
19796
- --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
19797
- position: relative;
19798
- display: grid;
19799
- grid-auto-flow: var(--pf-c-progress-stepper--GridAutoFlow);
19800
- grid-template-columns: var(--pf-c-progress-stepper--GridTemplateColumns);
19801
- grid-template-rows: var(--pf-c-progress-stepper--GridTemplateRows);
19802
- grid-auto-columns: 1fr;
19507
+ .pf-c-popover__title {
19508
+ flex: 0 0 auto;
19509
+ margin-bottom: var(--pf-c-popover__title--MarginBottom);
19510
+ font-family: var(--pf-c-popover__title--FontFamily);
19511
+ font-size: var(--pf-c-popover__title--FontSize);
19512
+ line-height: var(--pf-c-popover__title--LineHeight);
19803
19513
  }
19804
19514
 
19805
- .pf-c-progress-stepper.pf-m-center {
19806
- --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-center__step-connector--before--Left);
19807
- --pf-c-progress-stepper__step-connector--JustifyContent: var(--pf-c-progress-stepper--m-center__step-connector--JustifyContent);
19808
- --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-center__step-main--MarginRight);
19809
- --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-center__step-main--MarginLeft);
19810
- --pf-c-progress-stepper__step-description--MarginRight: var(--pf-c-progress-stepper--m-center__step-description--MarginRight);
19811
- --pf-c-progress-stepper__step-description--MarginLeft: var(--pf-c-progress-stepper--m-center__step-description--MarginLeft);
19812
- --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
19813
- --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign);
19515
+ .pf-c-popover__title.pf-m-icon {
19516
+ display: flex;
19814
19517
  }
19815
19518
 
19816
- .pf-c-progress-stepper.pf-m-vertical {
19817
- --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
19818
- --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
19819
- --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
19820
- --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
19821
- --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
19822
- --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
19823
- --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
19824
- --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
19825
- --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
19826
- --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
19827
- --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
19828
- --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
19829
- --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
19830
- --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
19519
+ .pf-c-popover__title-icon {
19520
+ margin-right: var(--pf-c-popover__title-icon--MarginRight);
19521
+ color: var(--pf-c-popover__title-icon--Color);
19831
19522
  }
19832
19523
 
19833
- .pf-c-progress-stepper.pf-m-compact {
19834
- --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-compact--GridAutoFlow);
19835
- --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-compact--GridTemplateColumns);
19836
- --pf-c-progress-stepper__step-icon--Width: var(--pf-c-progress-stepper--m-compact__step-icon--Width);
19837
- --pf-c-progress-stepper__step-icon--FontSize: var(--pf-c-progress-stepper--m-compact__step-icon--FontSize);
19838
- --pf-c-progress-stepper__pficon--MarginTop: var(--pf-c-progress-stepper--m-compact__pficon--MarginTop);
19839
- --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: var(--pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop);
19840
- --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-compact__step-main--MarginTop);
19841
- --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-compact__step-main--MarginBottom);
19842
- --pf-c-progress-stepper__step-title--FontSize: var(--pf-c-progress-stepper--m-compact__step-title--FontSize);
19843
- --pf-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-c-progress-stepper--m-compact__step-title--FontWeight);
19524
+ .pf-c-popover__title-text {
19525
+ color: var(--pf-c-popover__title-text--Color, inherit);
19844
19526
  }
19845
19527
 
19846
- .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step:not(.pf-m-current) .pf-c-progress-stepper__step-main {
19847
- position: fixed;
19848
- top: 0;
19849
- left: 0;
19850
- overflow: hidden;
19851
- clip: rect(0, 0, 0, 0);
19852
- white-space: nowrap;
19853
- border: 0;
19528
+ .pf-c-popover__body {
19529
+ word-wrap: break-word;
19854
19530
  }
19855
19531
 
19856
- .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-description {
19857
- display: none;
19532
+ .pf-c-popover__footer {
19533
+ margin-top: var(--pf-c-popover__footer--MarginTop);
19858
19534
  }
19859
19535
 
19860
- .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step.pf-m-current .pf-c-progress-stepper__step-main {
19861
- grid-column: 1/-1;
19862
- grid-row: 1/2;
19536
+ .pf-c-progress {
19537
+ --pf-c-progress--GridGap: var(--pf-global--spacer--md);
19538
+ --pf-c-progress__bar--before--BackgroundColor: var(--pf-global--primary-color--100);
19539
+ --pf-c-progress__bar--Height: var(--pf-global--spacer--md);
19540
+ --pf-c-progress__bar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
19541
+ --pf-c-progress__measure--m-static-width--MinWidth: 4.5ch;
19542
+ --pf-c-progress__status-icon--Color: var(--pf-global--Color--100);
19543
+ --pf-c-progress__status-icon--MarginLeft: var(--pf-global--spacer--sm);
19544
+ --pf-c-progress__bar--before--Opacity: .2;
19545
+ --pf-c-progress__indicator--Height: var(--pf-c-progress__bar--Height);
19546
+ --pf-c-progress__indicator--BackgroundColor: var(--pf-c-progress__bar--before--BackgroundColor);
19547
+ --pf-c-progress--m-success__bar--BackgroundColor: var(--pf-global--success-color--100);
19548
+ --pf-c-progress--m-warning__bar--BackgroundColor: var(--pf-global--warning-color--100);
19549
+ --pf-c-progress--m-danger__bar--BackgroundColor: var(--pf-global--danger-color--100);
19550
+ --pf-c-progress--m-success__status-icon--Color: var(--pf-global--success-color--100);
19551
+ --pf-c-progress--m-warning__status-icon--Color: var(--pf-global--warning-color--100);
19552
+ --pf-c-progress--m-danger__status-icon--Color: var(--pf-global--danger-color--100);
19553
+ --pf-c-progress--m-inside__indicator--MinWidth: var(--pf-global--spacer--xl);
19554
+ --pf-c-progress--m-inside__measure--Color: var(--pf-global--Color--light-100);
19555
+ --pf-c-progress--m-success--m-inside__measure--Color: var(--pf-global--Color--light-100);
19556
+ --pf-c-progress--m-warning--m-inside__measure--Color: var(--pf-global--Color--dark-100);
19557
+ --pf-c-progress--m-inside__measure--FontSize: var(--pf-global--FontSize--sm);
19558
+ --pf-c-progress--m-outside__measure--FontSize: var(--pf-global--FontSize--sm);
19559
+ --pf-c-progress--m-sm__bar--Height: var(--pf-global--spacer--sm);
19560
+ --pf-c-progress--m-sm__description--FontSize: var(--pf-global--FontSize--sm);
19561
+ --pf-c-progress--m-sm__measure--FontSize: var(--pf-global--FontSize--sm);
19562
+ --pf-c-progress--m-lg__bar--Height: var(--pf-global--spacer--lg);
19563
+ display: grid;
19564
+ align-items: end;
19565
+ grid-gap: var(--pf-c-progress--GridGap);
19566
+ grid-template-columns: auto auto;
19567
+ grid-template-rows: 1fr auto;
19863
19568
  }
19864
19569
 
19865
- .pf-c-progress-stepper__step {
19866
- display: contents;
19570
+ .pf-c-progress.pf-m-sm {
19571
+ --pf-c-progress__bar--Height: var(--pf-c-progress--m-sm__bar--Height);
19867
19572
  }
19868
19573
 
19869
- .pf-c-progress-stepper__step.pf-m-current {
19870
- --pf-c-progress-stepper__step-title--FontWeight: var(--pf-c-progress-stepper__step--m-current__step-title--FontWeight);
19871
- --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-current__step-title--Color);
19574
+ .pf-c-progress.pf-m-sm .pf-c-progress__description {
19575
+ font-size: var(--pf-c-progress--m-sm__description--FontSize);
19872
19576
  }
19873
19577
 
19874
- .pf-c-progress-stepper__step.pf-m-pending {
19875
- --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-pending__step-title--Color);
19578
+ .pf-c-progress.pf-m-sm .pf-c-progress__measure {
19579
+ font-size: var(--pf-c-progress--m-sm__measure--FontSize);
19876
19580
  }
19877
19581
 
19878
- .pf-c-progress-stepper__step.pf-m-success {
19879
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--success-color--100);
19582
+ .pf-c-progress.pf-m-lg {
19583
+ --pf-c-progress__bar--Height: var(--pf-c-progress--m-lg__bar--Height);
19880
19584
  }
19881
19585
 
19882
- .pf-c-progress-stepper__step.pf-m-danger {
19883
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--danger-color--100);
19884
- --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--Color);
19885
- --pf-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color);
19886
- --pf-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color);
19887
- --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor);
19888
- --pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor);
19889
- --pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor);
19586
+ .pf-c-progress.pf-m-inside .pf-c-progress__indicator {
19587
+ display: flex;
19588
+ align-items: center;
19589
+ justify-content: center;
19590
+ min-width: var(--pf-c-progress--m-inside__indicator--MinWidth);
19890
19591
  }
19891
19592
 
19892
- .pf-c-progress-stepper__step.pf-m-warning {
19893
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--warning-color--100);
19593
+ .pf-c-progress.pf-m-inside .pf-c-progress__measure {
19594
+ font-size: var(--pf-c-progress--m-inside__measure--FontSize);
19595
+ color: var(--pf-c-progress--m-inside__measure--Color);
19596
+ text-align: center;
19894
19597
  }
19895
19598
 
19896
- .pf-c-progress-stepper__step.pf-m-info {
19897
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--info-color--100);
19599
+ .pf-c-progress.pf-m-outside .pf-c-progress__description {
19600
+ grid-column: 1/3;
19898
19601
  }
19899
19602
 
19900
- .pf-c-progress-stepper__step-connector {
19901
- position: relative;
19902
- display: flex;
19903
- justify-content: var(--pf-c-progress-stepper__step-connector--JustifyContent);
19904
- width: 100%;
19603
+ .pf-c-progress.pf-m-outside .pf-c-progress__status {
19604
+ grid-column: 2/3;
19605
+ grid-row: 2/3;
19606
+ align-self: center;
19905
19607
  }
19906
19608
 
19907
- .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-connector::before {
19908
- position: absolute;
19909
- top: var(--pf-c-progress-stepper__step-connector--before--Top);
19910
- left: var(--pf-c-progress-stepper__step-connector--before--Left);
19911
- width: var(--pf-c-progress-stepper__step-connector--before--Width);
19912
- height: var(--pf-c-progress-stepper__step-connector--before--Height);
19913
- content: "";
19914
- border-right: var(--pf-c-progress-stepper__step-connector--before--BorderRightWidth) solid var(--pf-c-progress-stepper__step-connector--before--BorderRightColor);
19915
- border-bottom: var(--pf-c-progress-stepper__step-connector--before--BorderBottomWidth) solid var(--pf-c-progress-stepper__step-connector--before--BorderBottomColor);
19916
- transform: var(--pf-c-progress-stepper__step-connector--before--Transform);
19609
+ .pf-c-progress.pf-m-outside .pf-c-progress__measure {
19610
+ display: inline-block;
19611
+ font-size: var(--pf-c-progress--m-outside__measure--FontSize);
19917
19612
  }
19918
19613
 
19919
- .pf-c-progress-stepper__step-icon {
19920
- z-index: var(--pf-c-progress-stepper__step-icon--ZIndex);
19921
- display: flex;
19922
- align-items: center;
19923
- justify-content: center;
19924
- width: var(--pf-c-progress-stepper__step-icon--Width);
19925
- height: var(--pf-c-progress-stepper__step-icon--Height);
19926
- font-size: var(--pf-c-progress-stepper__step-icon--FontSize);
19927
- color: var(--pf-c-progress-stepper__step-icon--Color);
19928
- background-color: var(--pf-c-progress-stepper__step-icon--BackgroundColor);
19929
- border: var(--pf-c-progress-stepper__step-icon--BorderWidth) solid var(--pf-c-progress-stepper__step-icon--BorderColor);
19930
- border-radius: 50%;
19614
+ .pf-c-progress.pf-m-outside .pf-c-progress__measure.pf-m-static-width {
19615
+ min-width: var(--pf-c-progress__measure--m-static-width--MinWidth);
19616
+ text-align: left;
19931
19617
  }
19932
19618
 
19933
- .pf-c-progress-stepper__step-icon .pficon {
19934
- margin-top: var(--pf-c-progress-stepper__pficon--MarginTop);
19619
+ .pf-c-progress.pf-m-outside .pf-c-progress__bar,
19620
+ .pf-c-progress.pf-m-outside .pf-c-progress__indicator {
19621
+ grid-column: 1/2;
19935
19622
  }
19936
19623
 
19937
- .pf-c-progress-stepper__step-icon .fa-exclamation-triangle {
19938
- margin-top: var(--pf-c-progress-stepper__fa-exclamation-triangle--MarginTop);
19624
+ .pf-c-progress.pf-m-singleline {
19625
+ grid-template-rows: 1fr;
19939
19626
  }
19940
19627
 
19941
- .pf-c-progress-stepper__step-main {
19942
- margin: var(--pf-c-progress-stepper__step-main--MarginTop) var(--pf-c-progress-stepper__step-main--MarginRight) var(--pf-c-progress-stepper__step-main--MarginBottom) var(--pf-c-progress-stepper__step-main--MarginLeft);
19628
+ .pf-c-progress.pf-m-singleline .pf-c-progress__description {
19629
+ display: none;
19630
+ visibility: hidden;
19943
19631
  }
19944
19632
 
19945
- .pf-c-progress-stepper__step-title {
19946
- font-size: var(--pf-c-progress-stepper__step-title--FontSize);
19947
- font-weight: var(--pf-c-progress-stepper__step-title--FontWeight);
19948
- color: var(--pf-c-progress-stepper__step-title--Color);
19949
- text-align: var(--pf-c-progress-stepper__step-title--TextAlign);
19633
+ .pf-c-progress.pf-m-singleline .pf-c-progress__bar {
19634
+ grid-row: 1/2;
19635
+ grid-column: 1/2;
19950
19636
  }
19951
19637
 
19952
- .pf-c-progress-stepper__step-title.pf-m-help-text {
19953
- text-decoration: underline;
19954
- cursor: pointer;
19955
- text-decoration-style: dashed;
19956
- text-decoration-color: var(--pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor);
19957
- text-decoration-thickness: var(--pf-c-progress-stepper__step-title--m-help-text--TextDecorationThickness);
19958
- text-underline-offset: var(--pf-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
19638
+ .pf-c-progress.pf-m-singleline .pf-c-progress__status {
19639
+ grid-row: 1/2;
19640
+ grid-column: 2/3;
19959
19641
  }
19960
19642
 
19961
- .pf-c-progress-stepper__step-title.pf-m-help-text:hover {
19962
- --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step-title--m-help-text--hover--Color);
19963
- --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor);
19643
+ .pf-c-progress.pf-m-outside, .pf-c-progress.pf-m-singleline {
19644
+ grid-template-columns: 1fr fit-content(50%);
19964
19645
  }
19965
19646
 
19966
- .pf-c-progress-stepper__step-title.pf-m-help-text:focus {
19967
- --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step-title--m-help-text--focus--Color);
19968
- --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor);
19647
+ .pf-c-progress.pf-m-success {
19648
+ --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-success__bar--BackgroundColor);
19649
+ --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-success__status-icon--Color);
19650
+ --pf-c-progress--m-inside__measure--Color: var(--pf-c-progress--m-success--m-inside__measure--Color);
19969
19651
  }
19970
19652
 
19971
- .pf-c-progress-stepper__step-description {
19972
- margin-top: var(--pf-c-progress-stepper__step-description--MarginTop);
19973
- font-size: var(--pf-c-progress-stepper__step-description--FontSize);
19974
- color: var(--pf-c-progress-stepper__step-description--Color);
19975
- text-align: var(--pf-c-progress-stepper__step-description--TextAlign);
19653
+ .pf-c-progress.pf-m-warning {
19654
+ --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-warning__bar--BackgroundColor);
19655
+ --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-warning__status-icon--Color);
19656
+ --pf-c-progress--m-inside__measure--Color: var(--pf-c-progress--m-warning--m-inside__measure--Color);
19976
19657
  }
19977
19658
 
19978
- .pf-c-radio {
19979
- --pf-c-radio--GridGap: var(--pf-global--spacer--xs) var(--pf-global--spacer--sm);
19980
- --pf-c-radio__label--disabled--Color: var(--pf-global--disabled-color--100);
19981
- --pf-c-radio__label--Color: var(--pf-global--Color--100);
19982
- --pf-c-radio__label--FontWeight: var(--pf-global--FontWeight--normal);
19983
- --pf-c-radio__label--FontSize: var(--pf-global--FontSize--md);
19984
- --pf-c-radio__label--LineHeight: var(--pf-global--LineHeight--sm);
19985
- --pf-c-radio__input--Height: var(--pf-c-radio__label--FontSize);
19986
- --pf-c-radio__input--MarginTop: calc(((var(--pf-c-radio__label--FontSize) * var(--pf-c-radio__label--LineHeight)) - var(--pf-c-radio__input--Height)) / 2);
19659
+ .pf-c-progress.pf-m-danger {
19660
+ --pf-c-progress__bar--before--BackgroundColor: var(--pf-c-progress--m-danger__bar--BackgroundColor);
19661
+ --pf-c-progress__status-icon--Color: var(--pf-c-progress--m-danger__status-icon--Color);
19662
+ }
19663
+
19664
+ .pf-c-progress__description {
19665
+ word-break: break-word;
19666
+ grid-column: 1/2;
19667
+ }
19668
+
19669
+ .pf-c-progress__description.pf-m-truncate {
19670
+ overflow: hidden;
19671
+ text-overflow: ellipsis;
19672
+ white-space: nowrap;
19673
+ }
19674
+
19675
+ .pf-c-progress__status {
19676
+ grid-column: 2/3;
19677
+ grid-row: 1/2;
19678
+ text-align: right;
19679
+ word-break: break-word;
19680
+ }
19681
+
19682
+ .pf-c-progress__status-icon {
19683
+ margin-left: var(--pf-c-progress__status-icon--MarginLeft);
19684
+ color: var(--pf-c-progress__status-icon--Color);
19685
+ }
19686
+
19687
+ .pf-c-progress__bar {
19688
+ position: relative;
19689
+ grid-column: 1/3;
19690
+ grid-row: 2/3;
19691
+ align-self: center;
19692
+ height: var(--pf-c-progress__bar--Height);
19693
+ background-color: var(--pf-c-progress__bar--BackgroundColor);
19694
+ }
19695
+
19696
+ .pf-c-progress__bar::before {
19697
+ position: absolute;
19698
+ top: 0;
19699
+ left: 0;
19700
+ width: 100%;
19701
+ height: 100%;
19702
+ content: "";
19703
+ background-color: var(--pf-c-progress__bar--before--BackgroundColor);
19704
+ opacity: var(--pf-c-progress__bar--before--Opacity);
19705
+ }
19706
+
19707
+ .pf-c-progress__indicator {
19708
+ position: absolute;
19709
+ top: 0;
19710
+ left: 0;
19711
+ height: var(--pf-c-progress__indicator--Height);
19712
+ background-color: var(--pf-c-progress__indicator--BackgroundColor);
19713
+ }
19714
+
19715
+ .pf-c-progress-stepper {
19716
+ --pf-c-progress-stepper--GridAutoFlow: column;
19717
+ --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
19718
+ --pf-c-progress-stepper--GridTemplateColumns: initial;
19719
+ --pf-c-progress-stepper--m-vertical--GridAutoFlow: row;
19720
+ --pf-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
19721
+ --pf-c-progress-stepper--m-compact--GridAutoFlow: row;
19722
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
19723
+ --pf-c-progress-stepper__step-connector--JustifyContent: start;
19724
+ --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
19725
+ --pf-c-progress-stepper__step-icon--ZIndex: var(--pf-global--ZIndex--xs);
19726
+ --pf-c-progress-stepper__step-icon--Width: 1.75rem;
19727
+ --pf-c-progress-stepper__step-icon--Height: var(--pf-c-progress-stepper__step-icon--Width);
19728
+ --pf-c-progress-stepper__step-icon--FontSize: var(--pf-global--icon--FontSize--md);
19729
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--Color--100);
19730
+ --pf-c-progress-stepper__step-icon--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
19731
+ --pf-c-progress-stepper__step-icon--BorderWidth: var(--pf-global--BorderWidth--md);
19732
+ --pf-c-progress-stepper__step-icon--BorderColor: var(--pf-global--BorderColor--100);
19733
+ --pf-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
19734
+ --pf-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-global--icon--FontSize--sm);
19735
+ --pf-c-progress-stepper__pficon--MarginTop: 3px;
19736
+ --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: -5px;
19737
+ --pf-c-progress-stepper--m-compact__pficon--MarginTop: 2px;
19738
+ --pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop: -3px;
19739
+ --pf-c-progress-stepper__step-connector--before--Top: calc(var(--pf-c-progress-stepper__step-icon--Height) / 2);
19740
+ --pf-c-progress-stepper__step-connector--before--Left: 0;
19741
+ --pf-c-progress-stepper__step-connector--before--Width: 100%;
19742
+ --pf-c-progress-stepper__step-connector--before--Height: auto;
19743
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: unset;
19744
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: 0;
19745
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
19746
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-global--BorderColor--100);
19747
+ --pf-c-progress-stepper__step-connector--before--Transform: translateY(-50%);
19748
+ --pf-c-progress-stepper--m-center__step-connector--before--Left: 50%;
19749
+ --pf-c-progress-stepper--m-vertical__step-connector--before--Top: 0;
19750
+ --pf-c-progress-stepper--m-vertical__step-connector--before--Left: calc(var(--pf-c-progress-stepper__step-icon--Width) / 2);
19751
+ --pf-c-progress-stepper--m-vertical__step-connector--before--Width: auto;
19752
+ --pf-c-progress-stepper--m-vertical__step-connector--before--Height: 100%;
19753
+ --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth: var(--pf-global--BorderWidth--md);
19754
+ --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor: var(--pf-global--BorderColor--100);
19755
+ --pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth: 0;
19756
+ --pf-c-progress-stepper--m-vertical__step-connector--before--Transform: translateX(-50%);
19757
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-global--spacer--sm);
19758
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-global--spacer--sm);
19759
+ --pf-c-progress-stepper__step-main--MarginBottom: 0;
19760
+ --pf-c-progress-stepper__step-main--MarginLeft: 0;
19761
+ --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
19762
+ --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
19763
+ --pf-c-progress-stepper--m-vertical__step-main--MarginTop: var(--pf-global--spacer--xs);
19764
+ --pf-c-progress-stepper--m-vertical__step-main--MarginRight: 0;
19765
+ --pf-c-progress-stepper--m-vertical__step-main--MarginBottom: var(--pf-global--spacer--xl);
19766
+ --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-global--spacer--xs);
19767
+ --pf-c-progress-stepper--m-compact__step-main--MarginTop: 0;
19768
+ --pf-c-progress-stepper--m-compact__step-main--MarginBottom: var(--pf-global--spacer--sm);
19769
+ --pf-c-progress-stepper__step-title--Color: var(--pf-global--Color--100);
19770
+ --pf-c-progress-stepper__step-title--TextAlign: left;
19771
+ --pf-c-progress-stepper__step-title--FontSize: var(--pf-global--FontSize--md);
19772
+ --pf-c-progress-stepper__step-title--FontWeight: var(--pf-global--FontWeight--normal);
19773
+ --pf-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-global--FontWeight--bold);
19774
+ --pf-c-progress-stepper__step--m-current__step-title--Color: var(--pf-global--Color--100);
19775
+ --pf-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-global--Color--200);
19776
+ --pf-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-global--danger-color--100);
19777
+ --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
19778
+ --pf-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-global--FontSize--sm);
19779
+ --pf-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-global--FontWeight--normal);
19780
+ --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
19781
+ --pf-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
19782
+ --pf-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
19783
+ --pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
19784
+ --pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
19785
+ --pf-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-global--Color--100);
19786
+ --pf-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-global--Color--100);
19787
+ --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-global--danger-color--200);
19788
+ --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color: var(--pf-global--danger-color--200);
19789
+ --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor: var(--pf-global--danger-color--100);
19790
+ --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor: var(--pf-global--danger-color--200);
19791
+ --pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor: var(--pf-global--danger-color--200);
19792
+ --pf-c-progress-stepper__step-description--MarginTop: var(--pf-global--spacer--xs);
19793
+ --pf-c-progress-stepper__step-description--FontSize: var(--pf-global--FontSize--sm);
19794
+ --pf-c-progress-stepper__step-description--Color: var(--pf-global--Color--200);
19795
+ --pf-c-progress-stepper__step-description--TextAlign: left;
19796
+ --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
19797
+ position: relative;
19798
+ display: grid;
19799
+ grid-auto-flow: var(--pf-c-progress-stepper--GridAutoFlow);
19800
+ grid-template-columns: var(--pf-c-progress-stepper--GridTemplateColumns);
19801
+ grid-template-rows: var(--pf-c-progress-stepper--GridTemplateRows);
19802
+ grid-auto-columns: 1fr;
19803
+ }
19804
+
19805
+ .pf-c-progress-stepper.pf-m-center {
19806
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-center__step-connector--before--Left);
19807
+ --pf-c-progress-stepper__step-connector--JustifyContent: var(--pf-c-progress-stepper--m-center__step-connector--JustifyContent);
19808
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-center__step-main--MarginRight);
19809
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-center__step-main--MarginLeft);
19810
+ --pf-c-progress-stepper__step-description--MarginRight: var(--pf-c-progress-stepper--m-center__step-description--MarginRight);
19811
+ --pf-c-progress-stepper__step-description--MarginLeft: var(--pf-c-progress-stepper--m-center__step-description--MarginLeft);
19812
+ --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
19813
+ --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign);
19814
+ }
19815
+
19816
+ .pf-c-progress-stepper.pf-m-vertical {
19817
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
19818
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
19819
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
19820
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
19821
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
19822
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
19823
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
19824
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
19825
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
19826
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
19827
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
19828
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
19829
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
19830
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
19831
+ }
19832
+
19833
+ .pf-c-progress-stepper.pf-m-compact {
19834
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-compact--GridAutoFlow);
19835
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-compact--GridTemplateColumns);
19836
+ --pf-c-progress-stepper__step-icon--Width: var(--pf-c-progress-stepper--m-compact__step-icon--Width);
19837
+ --pf-c-progress-stepper__step-icon--FontSize: var(--pf-c-progress-stepper--m-compact__step-icon--FontSize);
19838
+ --pf-c-progress-stepper__pficon--MarginTop: var(--pf-c-progress-stepper--m-compact__pficon--MarginTop);
19839
+ --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: var(--pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop);
19840
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-compact__step-main--MarginTop);
19841
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-compact__step-main--MarginBottom);
19842
+ --pf-c-progress-stepper__step-title--FontSize: var(--pf-c-progress-stepper--m-compact__step-title--FontSize);
19843
+ --pf-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-c-progress-stepper--m-compact__step-title--FontWeight);
19844
+ }
19845
+
19846
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step:not(.pf-m-current) .pf-c-progress-stepper__step-main {
19847
+ position: fixed;
19848
+ top: 0;
19849
+ left: 0;
19850
+ overflow: hidden;
19851
+ clip: rect(0, 0, 0, 0);
19852
+ white-space: nowrap;
19853
+ border: 0;
19854
+ }
19855
+
19856
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-description {
19857
+ display: none;
19858
+ }
19859
+
19860
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step.pf-m-current .pf-c-progress-stepper__step-main {
19861
+ grid-column: 1/-1;
19862
+ grid-row: 1/2;
19863
+ }
19864
+
19865
+ .pf-c-progress-stepper__step {
19866
+ display: contents;
19867
+ }
19868
+
19869
+ .pf-c-progress-stepper__step.pf-m-current {
19870
+ --pf-c-progress-stepper__step-title--FontWeight: var(--pf-c-progress-stepper__step--m-current__step-title--FontWeight);
19871
+ --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-current__step-title--Color);
19872
+ }
19873
+
19874
+ .pf-c-progress-stepper__step.pf-m-pending {
19875
+ --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-pending__step-title--Color);
19876
+ }
19877
+
19878
+ .pf-c-progress-stepper__step.pf-m-success {
19879
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--success-color--100);
19880
+ }
19881
+
19882
+ .pf-c-progress-stepper__step.pf-m-danger {
19883
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--danger-color--100);
19884
+ --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--Color);
19885
+ --pf-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color);
19886
+ --pf-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color);
19887
+ --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor);
19888
+ --pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor);
19889
+ --pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor);
19890
+ }
19891
+
19892
+ .pf-c-progress-stepper__step.pf-m-warning {
19893
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--warning-color--100);
19894
+ }
19895
+
19896
+ .pf-c-progress-stepper__step.pf-m-info {
19897
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--info-color--100);
19898
+ }
19899
+
19900
+ .pf-c-progress-stepper__step-connector {
19901
+ position: relative;
19902
+ display: flex;
19903
+ justify-content: var(--pf-c-progress-stepper__step-connector--JustifyContent);
19904
+ width: 100%;
19905
+ }
19906
+
19907
+ .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-connector::before {
19908
+ position: absolute;
19909
+ top: var(--pf-c-progress-stepper__step-connector--before--Top);
19910
+ left: var(--pf-c-progress-stepper__step-connector--before--Left);
19911
+ width: var(--pf-c-progress-stepper__step-connector--before--Width);
19912
+ height: var(--pf-c-progress-stepper__step-connector--before--Height);
19913
+ content: "";
19914
+ border-right: var(--pf-c-progress-stepper__step-connector--before--BorderRightWidth) solid var(--pf-c-progress-stepper__step-connector--before--BorderRightColor);
19915
+ border-bottom: var(--pf-c-progress-stepper__step-connector--before--BorderBottomWidth) solid var(--pf-c-progress-stepper__step-connector--before--BorderBottomColor);
19916
+ transform: var(--pf-c-progress-stepper__step-connector--before--Transform);
19917
+ }
19918
+
19919
+ .pf-c-progress-stepper__step-icon {
19920
+ z-index: var(--pf-c-progress-stepper__step-icon--ZIndex);
19921
+ display: flex;
19922
+ align-items: center;
19923
+ justify-content: center;
19924
+ width: var(--pf-c-progress-stepper__step-icon--Width);
19925
+ height: var(--pf-c-progress-stepper__step-icon--Height);
19926
+ font-size: var(--pf-c-progress-stepper__step-icon--FontSize);
19927
+ color: var(--pf-c-progress-stepper__step-icon--Color);
19928
+ background-color: var(--pf-c-progress-stepper__step-icon--BackgroundColor);
19929
+ border: var(--pf-c-progress-stepper__step-icon--BorderWidth) solid var(--pf-c-progress-stepper__step-icon--BorderColor);
19930
+ border-radius: 50%;
19931
+ }
19932
+
19933
+ .pf-c-progress-stepper__step-icon .pficon {
19934
+ margin-top: var(--pf-c-progress-stepper__pficon--MarginTop);
19935
+ }
19936
+
19937
+ .pf-c-progress-stepper__step-icon .fa-exclamation-triangle {
19938
+ margin-top: var(--pf-c-progress-stepper__fa-exclamation-triangle--MarginTop);
19939
+ }
19940
+
19941
+ .pf-c-progress-stepper__step-main {
19942
+ margin: var(--pf-c-progress-stepper__step-main--MarginTop) var(--pf-c-progress-stepper__step-main--MarginRight) var(--pf-c-progress-stepper__step-main--MarginBottom) var(--pf-c-progress-stepper__step-main--MarginLeft);
19943
+ }
19944
+
19945
+ .pf-c-progress-stepper__step-title {
19946
+ font-size: var(--pf-c-progress-stepper__step-title--FontSize);
19947
+ font-weight: var(--pf-c-progress-stepper__step-title--FontWeight);
19948
+ color: var(--pf-c-progress-stepper__step-title--Color);
19949
+ text-align: var(--pf-c-progress-stepper__step-title--TextAlign);
19950
+ }
19951
+
19952
+ .pf-c-progress-stepper__step-title.pf-m-help-text {
19953
+ text-decoration: underline;
19954
+ cursor: pointer;
19955
+ text-decoration-style: dashed;
19956
+ text-decoration-color: var(--pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor);
19957
+ text-decoration-thickness: var(--pf-c-progress-stepper__step-title--m-help-text--TextDecorationThickness);
19958
+ text-underline-offset: var(--pf-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
19959
+ }
19960
+
19961
+ .pf-c-progress-stepper__step-title.pf-m-help-text:hover {
19962
+ --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step-title--m-help-text--hover--Color);
19963
+ --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor);
19964
+ }
19965
+
19966
+ .pf-c-progress-stepper__step-title.pf-m-help-text:focus {
19967
+ --pf-c-progress-stepper__step-title--Color: var(--pf-c-progress-stepper__step-title--m-help-text--focus--Color);
19968
+ --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor);
19969
+ }
19970
+
19971
+ .pf-c-progress-stepper__step-description {
19972
+ margin-top: var(--pf-c-progress-stepper__step-description--MarginTop);
19973
+ font-size: var(--pf-c-progress-stepper__step-description--FontSize);
19974
+ color: var(--pf-c-progress-stepper__step-description--Color);
19975
+ text-align: var(--pf-c-progress-stepper__step-description--TextAlign);
19976
+ }
19977
+
19978
+ .pf-c-radio {
19979
+ --pf-c-radio--GridGap: var(--pf-global--spacer--xs) var(--pf-global--spacer--sm);
19980
+ --pf-c-radio__label--disabled--Color: var(--pf-global--disabled-color--100);
19981
+ --pf-c-radio__label--Color: var(--pf-global--Color--100);
19982
+ --pf-c-radio__label--FontWeight: var(--pf-global--FontWeight--normal);
19983
+ --pf-c-radio__label--FontSize: var(--pf-global--FontSize--md);
19984
+ --pf-c-radio__label--LineHeight: var(--pf-global--LineHeight--sm);
19985
+ --pf-c-radio__input--Height: var(--pf-c-radio__label--FontSize);
19986
+ --pf-c-radio__input--MarginTop: calc(((var(--pf-c-radio__label--FontSize) * var(--pf-c-radio__label--LineHeight)) - var(--pf-c-radio__input--Height)) / 2);
19987
19987
  --pf-c-radio__input--first-child--MarginLeft: 0.0625rem;
19988
19988
  --pf-c-radio__input--last-child--MarginRight: 0.0625rem;
19989
19989
  --pf-c-radio__description--FontSize: var(--pf-global--FontSize--sm);
@@ -20380,1403 +20380,1116 @@ label.pf-c-radio, .pf-c-radio__label,
20380
20380
  --pf-c-select__menu-search--PaddingLeft: var(--pf-c-select__menu-item--PaddingLeft);
20381
20381
  --pf-c-select__menu-group--menu-group--PaddingTop: var(--pf-global--spacer--sm);
20382
20382
  --pf-c-select__menu-group-title--PaddingTop: var(--pf-c-select__menu-item--PaddingTop);
20383
- --pf-c-select__menu-group-title--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20384
- --pf-c-select__menu-group-title--PaddingBottom: var(--pf-c-select__menu-item--PaddingBottom);
20385
- --pf-c-select__menu-group-title--PaddingLeft: var(--pf-c-select__menu-item--PaddingLeft);
20386
- --pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--sm);
20387
- --pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
20388
- --pf-c-select__menu-group-title--Color: var(--pf-global--Color--dark-200);
20389
- --pf-c-select__menu-item-count--MarginLeft: var(--pf-global--spacer--md);
20390
- --pf-c-select__menu-item-count--FontSize: var(--pf-global--FontSize--sm);
20391
- --pf-c-select__menu-item-count--Color: var(--pf-global--Color--200);
20392
- --pf-c-select__menu-item--disabled__menu-item-count--Color: var(--pf-global--Color--dark-200);
20393
- --pf-c-select__menu-item-description--FontSize: var(--pf-global--FontSize--xs);
20394
- --pf-c-select__menu-item-description--Color: var(--pf-global--Color--200);
20395
- --pf-c-select__menu-item-description--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20396
- --pf-c-select__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20397
- --pf-c-select__menu-item--m-selected__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--m-selected--PaddingRight);
20398
- --pf-c-select__menu-footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
20399
- --pf-c-select__menu-footer--PaddingTop: var(--pf-global--spacer--md);
20400
- --pf-c-select__menu-footer--PaddingRight: var(--pf-global--spacer--md);
20401
- --pf-c-select__menu-footer--PaddingBottom: var(--pf-global--spacer--md);
20402
- --pf-c-select__menu-footer--PaddingLeft: var(--pf-global--spacer--md);
20403
- --pf-c-select__menu-footer--MarginTop: var(--pf-global--spacer--sm);
20404
- --pf-c-select__menu-footer--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
20405
- --pf-c-select-menu--c-divider--MarginTop: var(--pf-global--spacer--sm);
20406
- --pf-c-select-menu--c-divider--MarginBottom: var(--pf-global--spacer--sm);
20407
- position: relative;
20408
- display: inline-block;
20409
- width: 100%;
20410
- }
20411
-
20412
- .pf-c-select .pf-c-divider {
20413
- margin-top: var(--pf-c-select-menu--c-divider--MarginTop);
20414
- margin-bottom: var(--pf-c-select-menu--c-divider--MarginBottom);
20415
- }
20416
-
20417
- .pf-c-select .pf-c-divider:last-child {
20418
- --pf-c-select-menu--c-divider--MarginBottom: 0;
20419
- }
20420
-
20421
- .pf-c-select.pf-m-invalid {
20422
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--before--BorderBottomColor);
20423
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-invalid__toggle--before--BorderBottomWidth);
20424
- --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--hover--before--BorderBottomColor);
20425
- --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--focus--before--BorderBottomColor);
20426
- --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--active--before--BorderBottomColor);
20427
- --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--m-expanded--before--BorderBottomColor);
20428
- --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-invalid__toggle-status-icon--Color);
20429
- }
20430
-
20431
- .pf-c-select.pf-m-success {
20432
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--before--BorderBottomColor);
20433
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-success__toggle--before--BorderBottomWidth);
20434
- --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--hover--before--BorderBottomColor);
20435
- --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--focus--before--BorderBottomColor);
20436
- --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--active--before--BorderBottomColor);
20437
- --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--m-expanded--before--BorderBottomColor);
20438
- --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-success__toggle-status-icon--Color);
20439
- }
20440
-
20441
- .pf-c-select.pf-m-warning {
20442
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--before--BorderBottomColor);
20443
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-warning__toggle--before--BorderBottomWidth);
20444
- --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--hover--before--BorderBottomColor);
20445
- --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--focus--before--BorderBottomColor);
20446
- --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--active--before--BorderBottomColor);
20447
- --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--m-expanded--before--BorderBottomColor);
20448
- --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-warning__toggle-status-icon--Color);
20449
- }
20450
-
20451
- .pf-c-select__menu-search + .pf-c-divider {
20452
- --pf-c-select-menu--c-divider--MarginTop: 0;
20453
- }
20454
-
20455
- .pf-c-select__toggle {
20456
- position: relative;
20457
- display: flex;
20458
- align-items: center;
20459
- justify-content: space-between;
20460
- width: 100%;
20461
- min-width: var(--pf-c-select__toggle--MinWidth);
20462
- padding: var(--pf-c-select__toggle--PaddingTop) var(--pf-c-select__toggle--PaddingRight) var(--pf-c-select__toggle--PaddingBottom) var(--pf-c-select__toggle--PaddingLeft);
20463
- font-size: var(--pf-c-select__toggle--FontSize);
20464
- font-weight: var(--pf-c-select__toggle--FontWeight);
20465
- line-height: var(--pf-c-select__toggle--LineHeight);
20466
- color: var(--pf-c-select__toggle--Color);
20467
- white-space: nowrap;
20468
- cursor: pointer;
20469
- background-color: var(--pf-c-select__toggle--BackgroundColor);
20470
- border: none;
20471
- }
20472
-
20473
- .pf-c-select__toggle.pf-m-disabled, .pf-c-select__toggle:disabled {
20474
- --pf-c-select__toggle--BackgroundColor: var(--pf-c-select__toggle--disabled--BackgroundColor);
20475
- pointer-events: none;
20476
- }
20477
-
20478
- .pf-c-select__toggle.pf-m-disabled::before, .pf-c-select__toggle:disabled::before {
20479
- border: 0;
20480
- }
20481
-
20482
- .pf-c-select__toggle::before {
20483
- position: absolute;
20484
- top: 0;
20485
- right: 0;
20486
- bottom: 0;
20487
- left: 0;
20488
- content: "";
20489
- border-color: var(--pf-c-select__toggle--before--BorderTopColor) var(--pf-c-select__toggle--before--BorderRightColor) var(--pf-c-select__toggle--before--BorderBottomColor) var(--pf-c-select__toggle--before--BorderLeftColor);
20490
- border-style: solid;
20491
- border-width: var(--pf-c-select__toggle--before--BorderWidth);
20492
- }
20493
-
20494
- .pf-c-select__toggle:hover {
20495
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--hover--before--BorderBottomColor);
20496
- }
20497
-
20498
- .pf-c-select__toggle:focus, .pf-c-select__toggle:focus-within {
20499
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--focus--before--BorderBottomColor);
20500
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--focus--before--BorderBottomWidth);
20501
- }
20502
-
20503
- .pf-c-select__toggle:active, .pf-c-select__toggle.pf-m-active {
20504
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--active--before--BorderBottomColor);
20505
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--active--before--BorderBottomWidth);
20506
- }
20507
-
20508
- .pf-m-expanded > .pf-c-select__toggle {
20509
- --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--m-expanded--before--BorderBottomColor);
20510
- --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--m-expanded--before--BorderBottomWidth);
20511
- }
20512
-
20513
- .pf-c-select__toggle.pf-m-plain::before {
20514
- border-color: var(--pf-c-select__toggle--m-plain--before--BorderColor);
20515
- }
20516
-
20517
- .pf-c-select__toggle.pf-m-typeahead {
20518
- --pf-c-select__toggle--PaddingTop: 0;
20519
- --pf-c-select__toggle--PaddingRight: 0;
20520
- --pf-c-select__toggle--PaddingBottom: 0;
20521
- }
20522
-
20523
- .pf-c-select__toggle.pf-m-typeahead .pf-c-form-control {
20524
- overflow: hidden;
20525
- text-overflow: ellipsis;
20526
- white-space: nowrap;
20527
- --pf-c-form-control--invalid--BackgroundUrl: none;
20528
- position: relative;
20529
- height: auto;
20530
- }
20531
-
20532
- .pf-c-select__toggle .pf-c-select__toggle-clear {
20533
- padding-right: var(--pf-c-select__toggle-clear--PaddingRight);
20534
- padding-left: var(--pf-c-select__toggle-clear--PaddingLeft);
20535
- margin-left: auto;
20536
- }
20537
-
20538
- .pf-c-select__toggle .pf-c-select__toggle-button {
20539
- color: var(--pf-c-select__toggle-button--Color);
20540
- }
20541
-
20542
- .pf-c-select__toggle .pf-c-select__toggle-clear + .pf-c-select__toggle-button {
20543
- padding-left: var(--pf-c-select__toggle-clear--toggle-button--PaddingLeft);
20544
- }
20545
-
20546
- .pf-c-select__toggle.pf-m-placeholder {
20547
- --pf-c-select__toggle-text--Color: var(--pf-c-select__toggle--m-placeholder__toggle-text--Color);
20548
- }
20549
-
20550
- * + .pf-c-select__toggle-arrow {
20551
- margin-right: var(--pf-c-select__toggle-arrow--MarginRight);
20552
- margin-left: var(--pf-c-select__toggle-arrow--MarginLeft);
20553
- }
20554
-
20555
- .pf-c-select.pf-m-top.pf-m-expanded .pf-c-select__toggle-arrow {
20556
- transform: rotate(var(--pf-c-select__toggle-arrow--m-top--m-expanded__toggle-arrow--Rotate));
20557
- }
20558
-
20559
- .pf-c-select__toggle-text {
20560
- overflow: hidden;
20561
- text-overflow: ellipsis;
20562
- white-space: nowrap;
20563
- color: var(--pf-c-select__toggle-text--Color, inherit);
20564
- }
20565
-
20566
- .pf-c-select__toggle-wrapper {
20567
- display: flex;
20568
- flex: 1;
20569
- flex-wrap: wrap;
20570
- align-items: center;
20571
- justify-content: flex-start;
20572
- min-width: 0;
20573
- max-width: var(--pf-c-select__toggle-wrapper--MaxWidth);
20574
- white-space: normal;
20575
- }
20576
-
20577
- .pf-c-select__toggle-wrapper > :not(:last-child) {
20578
- margin-right: var(--pf-c-select__toggle-wrapper--not-last-child--MarginRight);
20579
- }
20580
-
20581
- .pf-c-select__toggle-wrapper > .pf-c-form-control {
20582
- margin-top: calc(-1 * var(--pf-c-select__toggle-wrapper--m-typeahead--PaddingTop));
20583
- }
20584
-
20585
- .pf-c-select__toggle-wrapper .pf-c-chip-group {
20586
- margin-top: var(--pf-c-select__toggle-wrapper--c-chip-group--MarginTop);
20587
- margin-bottom: var(--pf-c-select__toggle-wrapper--c-chip-group--MarginBottom);
20588
- }
20589
-
20590
- .pf-c-select__toggle-wrapper > .pf-c-select__toggle-typeahead:first-child {
20591
- margin-left: calc(-1 * var(--pf-c-select__toggle--PaddingLeft));
20592
- }
20593
-
20594
- .pf-c-select__toggle-icon + .pf-c-select__toggle-text {
20595
- margin-left: var(--pf-c-select__toggle-icon--toggle-text--MarginLeft);
20596
- }
20597
-
20598
- .pf-c-select__toggle-status-icon {
20599
- margin-left: var(--pf-c-select__toggle-status-icon--MarginLeft);
20600
- color: var(--pf-c-select__toggle-status-icon--Color);
20601
- }
20602
-
20603
- .pf-c-select__toggle-badge {
20604
- display: flex;
20605
- padding-left: var(--pf-c-select__toggle-badge--PaddingLeft);
20606
- }
20607
-
20608
- .pf-c-select__toggle-typeahead {
20609
- flex-basis: var(--pf-c-select__toggle-typeahead--FlexBasis);
20610
- flex-grow: 1;
20611
- min-width: var(--pf-c-select__toggle-typeahead--MinWidth);
20612
- flex-shrink: 0;
20613
- }
20614
-
20615
- .pf-c-select__toggle-typeahead.pf-c-form-control {
20616
- background-color: var(--pf-c-select__toggle-typeahead--BackgroundColor);
20617
- border-top: var(--pf-c-select__toggle-typeahead--BorderTop);
20618
- border-right: var(--pf-c-select__toggle-typeahead--BorderRight);
20619
- border-bottom-color: transparent;
20620
- border-left: var(--pf-c-select__toggle-typeahead--BorderLeft);
20621
- }
20622
-
20623
- .pf-c-select__toggle-typeahead.pf-c-form-control:focus {
20624
- padding-bottom: var(--pf-c-select__toggle-typeahead--focus--PaddingBottom);
20383
+ --pf-c-select__menu-group-title--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20384
+ --pf-c-select__menu-group-title--PaddingBottom: var(--pf-c-select__menu-item--PaddingBottom);
20385
+ --pf-c-select__menu-group-title--PaddingLeft: var(--pf-c-select__menu-item--PaddingLeft);
20386
+ --pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--sm);
20387
+ --pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
20388
+ --pf-c-select__menu-group-title--Color: var(--pf-global--Color--dark-200);
20389
+ --pf-c-select__menu-item-count--MarginLeft: var(--pf-global--spacer--md);
20390
+ --pf-c-select__menu-item-count--FontSize: var(--pf-global--FontSize--sm);
20391
+ --pf-c-select__menu-item-count--Color: var(--pf-global--Color--200);
20392
+ --pf-c-select__menu-item--disabled__menu-item-count--Color: var(--pf-global--Color--dark-200);
20393
+ --pf-c-select__menu-item-description--FontSize: var(--pf-global--FontSize--xs);
20394
+ --pf-c-select__menu-item-description--Color: var(--pf-global--Color--200);
20395
+ --pf-c-select__menu-item-description--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20396
+ --pf-c-select__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
20397
+ --pf-c-select__menu-item--m-selected__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--m-selected--PaddingRight);
20398
+ --pf-c-select__menu-footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
20399
+ --pf-c-select__menu-footer--PaddingTop: var(--pf-global--spacer--md);
20400
+ --pf-c-select__menu-footer--PaddingRight: var(--pf-global--spacer--md);
20401
+ --pf-c-select__menu-footer--PaddingBottom: var(--pf-global--spacer--md);
20402
+ --pf-c-select__menu-footer--PaddingLeft: var(--pf-global--spacer--md);
20403
+ --pf-c-select__menu-footer--MarginTop: var(--pf-global--spacer--sm);
20404
+ --pf-c-select__menu-footer--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
20405
+ --pf-c-select-menu--c-divider--MarginTop: var(--pf-global--spacer--sm);
20406
+ --pf-c-select-menu--c-divider--MarginBottom: var(--pf-global--spacer--sm);
20407
+ position: relative;
20408
+ display: inline-block;
20409
+ width: 100%;
20625
20410
  }
20626
20411
 
20627
- .pf-c-select__menu {
20628
- position: absolute;
20629
- top: var(--pf-c-select__menu--Top);
20630
- z-index: var(--pf-c-select__menu--ZIndex);
20631
- width: var(--pf-c-select__menu--Width);
20632
- min-width: var(--pf-c-select__menu--MinWidth);
20633
- padding-top: var(--pf-c-select__menu--PaddingTop);
20634
- padding-bottom: var(--pf-c-select__menu--PaddingBottom);
20635
- background-color: var(--pf-c-select__menu--BackgroundColor);
20636
- background-clip: padding-box;
20637
- box-shadow: var(--pf-c-select__menu--BoxShadow);
20412
+ .pf-c-select .pf-c-divider {
20413
+ margin-top: var(--pf-c-select-menu--c-divider--MarginTop);
20414
+ margin-bottom: var(--pf-c-select-menu--c-divider--MarginBottom);
20638
20415
  }
20639
20416
 
20640
- .pf-c-select__menu.pf-m-align-right {
20641
- right: 0;
20417
+ .pf-c-select .pf-c-divider:last-child {
20418
+ --pf-c-select-menu--c-divider--MarginBottom: 0;
20642
20419
  }
20643
20420
 
20644
- .pf-c-select.pf-m-top .pf-c-select__menu {
20645
- top: 0;
20646
- transform: translateY(var(--pf-c-select__menu--m-top--TranslateY));
20421
+ .pf-c-select.pf-m-invalid {
20422
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--before--BorderBottomColor);
20423
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-invalid__toggle--before--BorderBottomWidth);
20424
+ --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--hover--before--BorderBottomColor);
20425
+ --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--focus--before--BorderBottomColor);
20426
+ --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--active--before--BorderBottomColor);
20427
+ --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-invalid__toggle--m-expanded--before--BorderBottomColor);
20428
+ --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-invalid__toggle-status-icon--Color);
20647
20429
  }
20648
20430
 
20649
- .pf-c-select__menu-fieldset {
20650
- border: 0;
20431
+ .pf-c-select.pf-m-success {
20432
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--before--BorderBottomColor);
20433
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-success__toggle--before--BorderBottomWidth);
20434
+ --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--hover--before--BorderBottomColor);
20435
+ --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--focus--before--BorderBottomColor);
20436
+ --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--active--before--BorderBottomColor);
20437
+ --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-success__toggle--m-expanded--before--BorderBottomColor);
20438
+ --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-success__toggle-status-icon--Color);
20651
20439
  }
20652
20440
 
20653
- .pf-c-select__menu-wrapper {
20654
- display: flex;
20441
+ .pf-c-select.pf-m-warning {
20442
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--before--BorderBottomColor);
20443
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select--m-warning__toggle--before--BorderBottomWidth);
20444
+ --pf-c-select__toggle--hover--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--hover--before--BorderBottomColor);
20445
+ --pf-c-select__toggle--focus--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--focus--before--BorderBottomColor);
20446
+ --pf-c-select__toggle--active--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--active--before--BorderBottomColor);
20447
+ --pf-c-select__toggle--m-expanded--before--BorderBottomColor: var(--pf-c-select--m-warning__toggle--m-expanded--before--BorderBottomColor);
20448
+ --pf-c-select__toggle-status-icon--Color: var(--pf-c-select--m-warning__toggle-status-icon--Color);
20655
20449
  }
20656
20450
 
20657
- .pf-c-select__menu-wrapper.pf-m-favorite .pf-c-select__menu-item.pf-m-favorite-action {
20658
- --pf-c-select__menu-item--m-favorite-action--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--Color);
20659
- --pf-c-select__menu-item--m-favorite-action--hover--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--hover--Color);
20660
- --pf-c-select__menu-item--m-favorite-action--focus--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--focus--Color);
20451
+ .pf-c-select__menu-search + .pf-c-divider {
20452
+ --pf-c-select-menu--c-divider--MarginTop: 0;
20661
20453
  }
20662
20454
 
20663
- .pf-c-select__menu-item {
20455
+ .pf-c-select__toggle {
20664
20456
  position: relative;
20665
- width: var(--pf-c-select__menu-item--Width);
20666
- padding: var(--pf-c-select__menu-item--PaddingTop) var(--pf-c-select__menu-item--PaddingRight) var(--pf-c-select__menu-item--PaddingBottom) var(--pf-c-select__menu-item--PaddingLeft);
20667
- font-size: var(--pf-c-select__menu-item--FontSize);
20668
- font-weight: var(--pf-c-select__menu-item--FontWeight);
20669
- line-height: var(--pf-c-select__menu-item--LineHeight);
20670
- color: var(--pf-c-select__menu-item--Color);
20671
- text-align: left;
20457
+ display: flex;
20458
+ align-items: center;
20459
+ justify-content: space-between;
20460
+ width: 100%;
20461
+ min-width: var(--pf-c-select__toggle--MinWidth);
20462
+ padding: var(--pf-c-select__toggle--PaddingTop) var(--pf-c-select__toggle--PaddingRight) var(--pf-c-select__toggle--PaddingBottom) var(--pf-c-select__toggle--PaddingLeft);
20463
+ font-size: var(--pf-c-select__toggle--FontSize);
20464
+ font-weight: var(--pf-c-select__toggle--FontWeight);
20465
+ line-height: var(--pf-c-select__toggle--LineHeight);
20466
+ color: var(--pf-c-select__toggle--Color);
20672
20467
  white-space: nowrap;
20673
- background-color: transparent;
20468
+ cursor: pointer;
20469
+ background-color: var(--pf-c-select__toggle--BackgroundColor);
20674
20470
  border: none;
20675
20471
  }
20676
20472
 
20677
- .pf-c-select__menu-item:hover, .pf-c-select__menu-item:focus, .pf-c-select__menu-item.pf-m-focus {
20678
- --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--hover__menu-item--m-action--Color);
20679
- text-decoration: none;
20680
- }
20681
-
20682
- .pf-c-select__menu-wrapper:hover, .pf-c-select__menu-item:hover {
20683
- background-color: var(--pf-c-select__menu-item--hover--BackgroundColor);
20684
- }
20685
-
20686
- .pf-c-select__menu-wrapper:focus-within,
20687
- .pf-c-select__menu-wrapper.pf-m-focus, .pf-c-select__menu-item:focus, .pf-c-select__menu-item.pf-m-focus {
20688
- position: relative;
20689
- background-color: var(--pf-c-select__menu-item--focus--BackgroundColor);
20690
- }
20691
-
20692
- .pf-c-select__menu-item.pf-m-link {
20693
- --pf-c-select__menu-item--PaddingRight: 0;
20694
- --pf-c-select__menu-item-main--PaddingRight: 0;
20695
- --pf-c-select__menu-item-description--PaddingRight: 0;
20696
- --pf-c-select__menu-item--Width: var(--pf-c-select__menu-item--m-link--Width);
20697
- --pf-c-select__menu-item--hover--BackgroundColor: var(--pf-c-select__menu-item--m-link--hover--BackgroundColor);
20698
- --pf-c-select__menu-item--focus--BackgroundColor: var(--pf-c-select__menu-item--m-link--focus--BackgroundColor);
20699
- flex-grow: 1;
20473
+ .pf-c-select__toggle.pf-m-disabled, .pf-c-select__toggle:disabled {
20474
+ --pf-c-select__toggle--BackgroundColor: var(--pf-c-select__toggle--disabled--BackgroundColor);
20475
+ pointer-events: none;
20700
20476
  }
20701
20477
 
20702
- .pf-c-select__menu-item.pf-m-action {
20703
- --pf-c-select__menu-item--Color: var(--pf-c-select__menu-item--m-action--Color);
20704
- --pf-c-select__menu-item--Width: var(--pf-c-select__menu-item--m-action--Width);
20705
- --pf-c-select__menu-item--hover--BackgroundColor: var(--pf-c-select__menu-item--m-action--hover--BackgroundColor);
20706
- --pf-c-select__menu-item--focus--BackgroundColor: var(--pf-c-select__menu-item--m-action--focus--BackgroundColor);
20707
- display: flex;
20708
- align-items: flex-start;
20709
- font-size: var(--pf-c-select__menu-item--m-action--FontSize);
20478
+ .pf-c-select__toggle.pf-m-disabled::before, .pf-c-select__toggle:disabled::before {
20479
+ border: 0;
20710
20480
  }
20711
20481
 
20712
- .pf-c-select__menu-item.pf-m-action:hover {
20713
- --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-action--hover--Color);
20482
+ .pf-c-select__toggle::before {
20483
+ position: absolute;
20484
+ top: 0;
20485
+ right: 0;
20486
+ bottom: 0;
20487
+ left: 0;
20488
+ content: "";
20489
+ border-color: var(--pf-c-select__toggle--before--BorderTopColor) var(--pf-c-select__toggle--before--BorderRightColor) var(--pf-c-select__toggle--before--BorderBottomColor) var(--pf-c-select__toggle--before--BorderLeftColor);
20490
+ border-style: solid;
20491
+ border-width: var(--pf-c-select__toggle--before--BorderWidth);
20714
20492
  }
20715
20493
 
20716
- .pf-c-select__menu-item.pf-m-action:focus {
20717
- --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-action--focus--Color);
20494
+ .pf-c-select__toggle:hover {
20495
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--hover--before--BorderBottomColor);
20718
20496
  }
20719
20497
 
20720
- .pf-c-select__menu-item.pf-m-action:disabled {
20721
- --pf-c-select__menu-item--disabled--Color: var(--pf-c-select__menu-item--m-action--disabled--Color);
20498
+ .pf-c-select__toggle:focus, .pf-c-select__toggle:focus-within {
20499
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--focus--before--BorderBottomColor);
20500
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--focus--before--BorderBottomWidth);
20722
20501
  }
20723
20502
 
20724
- .pf-c-select__menu-item.pf-m-favorite-action {
20725
- --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-favorite-action--Color);
20726
- --pf-c-select__menu-item--m-action--hover--Color: var(--pf-c-select__menu-item--m-favorite-action--hover--Color);
20727
- --pf-c-select__menu-item--m-action--focus--Color: var(--pf-c-select__menu-item--m-favorite-action--focus--Color);
20503
+ .pf-c-select__toggle:active, .pf-c-select__toggle.pf-m-active {
20504
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--active--before--BorderBottomColor);
20505
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--active--before--BorderBottomWidth);
20728
20506
  }
20729
20507
 
20730
- .pf-c-select__menu-item.pf-m-selected {
20731
- --pf-c-select__menu-item--PaddingRight: var(--pf-c-select__menu-item--m-selected--PaddingRight);
20732
- --pf-c-select__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--m-selected__menu-item-main--PaddingRight);
20508
+ .pf-m-expanded > .pf-c-select__toggle {
20509
+ --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--m-expanded--before--BorderBottomColor);
20510
+ --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--m-expanded--before--BorderBottomWidth);
20733
20511
  }
20734
20512
 
20735
- .pf-c-select__menu-item.pf-m-description {
20736
- white-space: normal;
20513
+ .pf-c-select__toggle.pf-m-plain::before {
20514
+ border-color: var(--pf-c-select__toggle--m-plain--before--BorderColor);
20737
20515
  }
20738
20516
 
20739
- .pf-c-select__menu-item.pf-m-description:not(.pf-c-check) {
20740
- --pf-c-select__menu-item--PaddingRight: 0;
20517
+ .pf-c-select__toggle.pf-m-typeahead {
20518
+ --pf-c-select__toggle--PaddingTop: 0;
20519
+ --pf-c-select__toggle--PaddingRight: 0;
20520
+ --pf-c-select__toggle--PaddingBottom: 0;
20741
20521
  }
20742
20522
 
20743
- .pf-c-select__menu-item.pf-m-description .pf-c-check__label {
20523
+ .pf-c-select__toggle.pf-m-typeahead .pf-c-form-control {
20524
+ overflow: hidden;
20525
+ text-overflow: ellipsis;
20744
20526
  white-space: nowrap;
20745
- }
20746
-
20747
- .pf-c-select__menu-wrapper.pf-m-disabled, .pf-c-select__menu-item:disabled, .pf-c-select__menu-item.pf-m-disabled {
20748
- --pf-c-select__menu-item-count--Color: var(--pf-c-select__menu-item--disabled__menu-item-count--Color);
20749
- color: var(--pf-c-select__menu-item--disabled--Color);
20750
- pointer-events: none;
20751
- background-color: var(--pf-c-select__menu-item--disabled--BackgroundColor);
20752
- }
20753
-
20754
- .pf-c-select__menu-item.pf-c-check .pf-c-check__label {
20755
- width: 100%;
20756
- }
20757
-
20758
- .pf-c-select__menu-item.pf-m-load {
20759
- --pf-c-select__menu-item--hover--BackgroundColor: transparent;
20760
- --pf-c-select__menu-item--focus--BackgroundColor: transparent;
20761
- --pf-c-select__menu-item--Color: var(--pf-c-select__menu-item--m-load--Color);
20762
- }
20763
-
20764
- .pf-c-select__list-item.pf-m-loading {
20765
- padding-top: var(--pf-c-select__list-item--m-loading--PaddingTop);
20766
- text-align: center;
20767
- }
20768
-
20769
- .pf-c-select__menu-item-main {
20527
+ --pf-c-form-control--invalid--BackgroundUrl: none;
20770
20528
  position: relative;
20771
- display: block;
20772
- padding-right: var(--pf-c-select__menu-item-main--PaddingRight);
20773
- white-space: nowrap;
20774
- }
20775
-
20776
- .pf-c-select__menu-item-row {
20777
- display: flex;
20778
- }
20779
-
20780
- .pf-c-select__menu-item-text {
20781
- flex-grow: 1;
20782
- }
20783
-
20784
- .pf-c-select__menu-item-count {
20785
- align-self: center;
20786
- margin-left: var(--pf-c-select__menu-item-count--MarginLeft);
20787
- font-size: var(--pf-c-select__menu-item-count--FontSize);
20788
- color: var(--pf-c-select__menu-item-count--Color);
20529
+ height: auto;
20789
20530
  }
20790
20531
 
20791
- .pf-c-select__menu-item-description {
20792
- display: block;
20793
- padding-right: var(--pf-c-select__menu-item-description--PaddingRight);
20794
- font-size: var(--pf-c-select__menu-item-description--FontSize);
20795
- color: var(--pf-c-select__menu-item-description--Color);
20532
+ .pf-c-select__toggle .pf-c-select__toggle-clear {
20533
+ padding-right: var(--pf-c-select__toggle-clear--PaddingRight);
20534
+ padding-left: var(--pf-c-select__toggle-clear--PaddingLeft);
20535
+ margin-left: auto;
20796
20536
  }
20797
20537
 
20798
- .pf-c-select__menu-item-icon {
20799
- position: absolute;
20800
- top: var(--pf-c-select__menu-item-icon--Top);
20801
- right: var(--pf-c-select__menu-item-icon--Right);
20802
- font-size: var(--pf-c-select__menu-item-icon--FontSize);
20803
- color: var(--pf-c-select__menu-item-icon--Color);
20804
- transform: translateY(var(--pf-c-select__menu-item-icon--TranslateY));
20538
+ .pf-c-select__toggle .pf-c-select__toggle-button {
20539
+ color: var(--pf-c-select__toggle-button--Color);
20805
20540
  }
20806
20541
 
20807
- .pf-c-select__menu-item-action-icon {
20808
- display: flex;
20809
- align-items: center;
20810
- min-height: var(--pf-c-select__menu-item-action-icon--MinHeight);
20542
+ .pf-c-select__toggle .pf-c-select__toggle-clear + .pf-c-select__toggle-button {
20543
+ padding-left: var(--pf-c-select__toggle-clear--toggle-button--PaddingLeft);
20811
20544
  }
20812
20545
 
20813
- .pf-c-select__menu-item--match {
20814
- font-weight: var(--pf-c-select__menu-item--match--FontWeight);
20815
- background-color: inherit;
20546
+ .pf-c-select__toggle.pf-m-placeholder {
20547
+ --pf-c-select__toggle-text--Color: var(--pf-c-select__toggle--m-placeholder__toggle-text--Color);
20816
20548
  }
20817
20549
 
20818
- .pf-c-select__menu-group + .pf-c-select__menu-group {
20819
- padding-top: var(--pf-c-select__menu-group--menu-group--PaddingTop);
20550
+ * + .pf-c-select__toggle-arrow {
20551
+ margin-right: var(--pf-c-select__toggle-arrow--MarginRight);
20552
+ margin-left: var(--pf-c-select__toggle-arrow--MarginLeft);
20820
20553
  }
20821
20554
 
20822
- .pf-c-select__menu-search {
20823
- padding: var(--pf-c-select__menu-search--PaddingTop) var(--pf-c-select__menu-search--PaddingRight) var(--pf-c-select__menu-search--PaddingBottom) var(--pf-c-select__menu-search--PaddingLeft);
20555
+ .pf-c-select.pf-m-top.pf-m-expanded .pf-c-select__toggle-arrow {
20556
+ transform: rotate(var(--pf-c-select__toggle-arrow--m-top--m-expanded__toggle-arrow--Rotate));
20824
20557
  }
20825
20558
 
20826
- .pf-c-select__menu-group-title {
20827
- padding-top: var(--pf-c-select__menu-group-title--PaddingTop);
20828
- padding-right: var(--pf-c-select__menu-group-title--PaddingRight);
20829
- padding-bottom: var(--pf-c-select__menu-group-title--PaddingBottom);
20830
- padding-left: var(--pf-c-select__menu-group-title--PaddingLeft);
20831
- font-size: var(--pf-c-select__menu-group-title--FontSize);
20832
- font-weight: var(--pf-c-select__menu-group-title--FontWeight);
20833
- color: var(--pf-c-select__menu-group-title--Color);
20559
+ .pf-c-select__toggle-text {
20560
+ overflow: hidden;
20561
+ text-overflow: ellipsis;
20562
+ white-space: nowrap;
20563
+ color: var(--pf-c-select__toggle-text--Color, inherit);
20834
20564
  }
20835
20565
 
20836
- .pf-c-select__menu-footer {
20837
- padding: var(--pf-c-select__menu-footer--PaddingTop) var(--pf-c-select__menu-footer--PaddingRight) var(--pf-c-select__menu-footer--PaddingBottom) var(--pf-c-select__menu-footer--PaddingLeft);
20838
- margin-top: var(--pf-c-select__menu-footer--MarginTop);
20839
- margin-bottom: var(--pf-c-select__menu-footer--MarginBottom);
20840
- box-shadow: var(--pf-c-select__menu-footer--BoxShadow);
20566
+ .pf-c-select__toggle-wrapper {
20567
+ display: flex;
20568
+ flex: 1;
20569
+ flex-wrap: wrap;
20570
+ align-items: center;
20571
+ justify-content: flex-start;
20572
+ min-width: 0;
20573
+ max-width: var(--pf-c-select__toggle-wrapper--MaxWidth);
20574
+ white-space: normal;
20841
20575
  }
20842
20576
 
20843
- .pf-c-simple-list {
20844
- --pf-c-simple-list__item-link--PaddingTop: var(--pf-global--spacer--xs);
20845
- --pf-c-simple-list__item-link--PaddingRight: var(--pf-global--spacer--md);
20846
- --pf-c-simple-list__item-link--PaddingBottom: var(--pf-global--spacer--xs);
20847
- --pf-c-simple-list__item-link--PaddingLeft: var(--pf-global--spacer--md);
20848
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-global--BackgroundColor--100);
20849
- --pf-c-simple-list__item-link--Color: var(--pf-global--Color--100);
20850
- --pf-c-simple-list__item-link--FontSize: var(--pf-global--FontSize--sm);
20851
- --pf-c-simple-list__item-link--FontWeight: var(--pf-global--FontWeight--normal);
20852
- --pf-c-simple-list__item-link--m-current--Color: var(--pf-global--link--Color);
20853
- --pf-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-global--BackgroundColor--200);
20854
- --pf-c-simple-list__item-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
20855
- --pf-c-simple-list__item-link--hover--Color: var(--pf-global--Color--100);
20856
- --pf-c-simple-list__item-link--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
20857
- --pf-c-simple-list__item-link--focus--Color: var(--pf-global--Color--100);
20858
- --pf-c-simple-list__item-link--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
20859
- --pf-c-simple-list__item-link--focus--FontWeight: var(--pf-global--FontWeight--normal);
20860
- --pf-c-simple-list__item-link--active--Color: var(--pf-global--Color--100);
20861
- --pf-c-simple-list__item-link--active--BackgroundColor: var(--pf-global--BackgroundColor--200);
20862
- --pf-c-simple-list__item-link--active--FontWeight: var(--pf-global--FontWeight--normal);
20863
- --pf-c-simple-list__title--PaddingTop: var(--pf-global--spacer--sm);
20864
- --pf-c-simple-list__title--PaddingRight: var(--pf-global--spacer--md);
20865
- --pf-c-simple-list__title--PaddingBottom: var(--pf-global--spacer--sm);
20866
- --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
20867
- --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
20868
- --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
20869
- --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
20870
- --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
20577
+ .pf-c-select__toggle-wrapper > :not(:last-child) {
20578
+ margin-right: var(--pf-c-select__toggle-wrapper--not-last-child--MarginRight);
20871
20579
  }
20872
20580
 
20873
- .pf-c-simple-list__item-link {
20874
- display: block;
20875
- width: 100%;
20876
- padding: var(--pf-c-simple-list__item-link--PaddingTop) var(--pf-c-simple-list__item-link--PaddingRight) var(--pf-c-simple-list__item-link--PaddingBottom) var(--pf-c-simple-list__item-link--PaddingLeft);
20877
- font-size: var(--pf-c-simple-list__item-link--FontSize);
20878
- font-weight: var(--pf-c-simple-list__item-link--FontWeight);
20879
- color: var(--pf-c-simple-list__item-link--Color);
20880
- text-align: left;
20881
- background-color: var(--pf-c-simple-list__item-link--BackgroundColor);
20882
- border: none;
20581
+ .pf-c-select__toggle-wrapper > .pf-c-form-control {
20582
+ margin-top: calc(-1 * var(--pf-c-select__toggle-wrapper--m-typeahead--PaddingTop));
20883
20583
  }
20884
20584
 
20885
- .pf-c-simple-list__item-link:hover {
20886
- text-decoration: none;
20887
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--hover--BackgroundColor);
20888
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--hover--Color);
20585
+ .pf-c-select__toggle-wrapper .pf-c-chip-group {
20586
+ margin-top: var(--pf-c-select__toggle-wrapper--c-chip-group--MarginTop);
20587
+ margin-bottom: var(--pf-c-select__toggle-wrapper--c-chip-group--MarginBottom);
20889
20588
  }
20890
20589
 
20891
- .pf-c-simple-list__item-link:focus {
20892
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--focus--FontWeight);
20893
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--focus--BackgroundColor);
20894
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--focus--Color);
20590
+ .pf-c-select__toggle-wrapper > .pf-c-select__toggle-typeahead:first-child {
20591
+ margin-left: calc(-1 * var(--pf-c-select__toggle--PaddingLeft));
20895
20592
  }
20896
20593
 
20897
- .pf-c-simple-list__item-link:active {
20898
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--active--FontWeight);
20899
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--active--BackgroundColor);
20900
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--active--Color);
20594
+ .pf-c-select__toggle-icon + .pf-c-select__toggle-text {
20595
+ margin-left: var(--pf-c-select__toggle-icon--toggle-text--MarginLeft);
20901
20596
  }
20902
20597
 
20903
- .pf-c-simple-list__item-link.pf-m-current {
20904
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--m-current--FontWeight);
20905
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--m-current--BackgroundColor);
20906
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--m-current--Color);
20598
+ .pf-c-select__toggle-status-icon {
20599
+ margin-left: var(--pf-c-select__toggle-status-icon--MarginLeft);
20600
+ color: var(--pf-c-select__toggle-status-icon--Color);
20907
20601
  }
20908
20602
 
20909
- .pf-c-simple-list__title {
20910
- padding: var(--pf-c-simple-list__title--PaddingTop) var(--pf-c-simple-list__title--PaddingRight) var(--pf-c-simple-list__title--PaddingBottom) var(--pf-c-simple-list__title--PaddingLeft);
20911
- font-size: var(--pf-c-simple-list__title--FontSize);
20912
- font-weight: var(--pf-c-simple-list__title--FontWeight);
20913
- color: var(--pf-c-simple-list__title--Color);
20603
+ .pf-c-select__toggle-badge {
20604
+ display: flex;
20605
+ padding-left: var(--pf-c-select__toggle-badge--PaddingLeft);
20914
20606
  }
20915
20607
 
20916
- .pf-c-simple-list__section + .pf-c-simple-list__section {
20917
- margin-top: var(--pf-c-simple-list__section--section--MarginTop);
20608
+ .pf-c-select__toggle-typeahead {
20609
+ flex-basis: var(--pf-c-select__toggle-typeahead--FlexBasis);
20610
+ flex-grow: 1;
20611
+ min-width: var(--pf-c-select__toggle-typeahead--MinWidth);
20612
+ flex-shrink: 0;
20918
20613
  }
20919
20614
 
20920
- .pf-c-skeleton {
20921
- --pf-c-skeleton--BackgroundColor: var(--pf-global--palette--black-150);
20922
- --pf-c-skeleton--Width: auto;
20923
- --pf-c-skeleton--Height: auto;
20924
- --pf-c-skeleton--BorderRadius: var(--pf-global--BorderRadius--sm);
20925
- --pf-c-skeleton--before--PaddingBottom: 0;
20926
- --pf-c-skeleton--before--Height: auto;
20927
- --pf-c-skeleton--before--Content: " ";
20928
- --pf-c-skeleton--after--LinearGradientAngle: 90deg;
20929
- --pf-c-skeleton--after--LinearGradientColorStop1: var(--pf-global--palette--black-150);
20930
- --pf-c-skeleton--after--LinearGradientColorStop2: #ededed;
20931
- --pf-c-skeleton--after--LinearGradientColorStop3: var(--pf-global--palette--black-150);
20932
- --pf-c-skeleton--after--TranslateX: -100%;
20933
- --pf-c-skeleton--after--AnimationName: pf-c-skeleton-loading;
20934
- --pf-c-skeleton--after--AnimationDuration: 2s;
20935
- --pf-c-skeleton--after--AnimationIterationCount: infinite;
20936
- --pf-c-skeleton--after--AnimationTimingFunction: linear;
20937
- --pf-c-skeleton--after--AnimationDelay: .5s;
20938
- --pf-c-skeleton--m-circle--BorderRadius: var(--pf-global--BorderRadius--lg);
20939
- --pf-c-skeleton--m-circle--before--PaddingBottom: 100%;
20940
- --pf-c-skeleton--m-text-4xl--Height: calc(var(--pf-global--FontSize--4xl) * var(--pf-global--LineHeight--sm));
20941
- --pf-c-skeleton--m-text-3xl--Height: calc(var(--pf-global--FontSize--3xl) * var(--pf-global--LineHeight--sm));
20942
- --pf-c-skeleton--m-text-2xl--Height: calc(var(--pf-global--FontSize--2xl) * var(--pf-global--LineHeight--sm));
20943
- --pf-c-skeleton--m-text-xl--Height: calc(var(--pf-global--FontSize--xl) * var(--pf-global--LineHeight--sm));
20944
- --pf-c-skeleton--m-text-lg--Height: calc(var(--pf-global--FontSize--lg) * var(--pf-global--LineHeight--md));
20945
- --pf-c-skeleton--m-text-md--Height: calc(var(--pf-global--FontSize--md) * var(--pf-global--LineHeight--md));
20946
- --pf-c-skeleton--m-text-sm--Height: calc(var(--pf-global--FontSize--sm) * var(--pf-global--LineHeight--md));
20947
- --pf-c-skeleton--m-width-sm--Width: 6.25rem;
20948
- --pf-c-skeleton--m-width-md--Width: 12.5rem;
20949
- --pf-c-skeleton--m-width-lg--Width: 18.75rem;
20950
- --pf-c-skeleton--m-width-25--Width: 25%;
20951
- --pf-c-skeleton--m-width-33--Width: calc(100% / 3);
20952
- --pf-c-skeleton--m-width-50--Width: 50%;
20953
- --pf-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
20954
- --pf-c-skeleton--m-width-75--Width: 75%;
20955
- --pf-c-skeleton--m-height-sm--Height: 6.25rem;
20956
- --pf-c-skeleton--m-height-md--Height: 12.5rem;
20957
- --pf-c-skeleton--m-height-lg--Height: 18.75rem;
20958
- --pf-c-skeleton--m-height-25--Height: 25%;
20959
- --pf-c-skeleton--m-height-33--Height: calc(100% / 3);
20960
- --pf-c-skeleton--m-height-50--Height: 50%;
20961
- --pf-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
20962
- --pf-c-skeleton--m-height-75--Height: 75%;
20963
- --pf-c-skeleton--m-height-100--Height: 100%;
20964
- position: relative;
20965
- width: var(--pf-c-skeleton--Width);
20966
- height: var(--pf-c-skeleton--Height);
20967
- overflow: hidden;
20968
- background-color: var(--pf-c-skeleton--BackgroundColor);
20969
- border-radius: var(--pf-c-skeleton--BorderRadius);
20970
- transform: translate(0);
20615
+ .pf-c-select__toggle-typeahead.pf-c-form-control {
20616
+ background-color: var(--pf-c-select__toggle-typeahead--BackgroundColor);
20617
+ border-top: var(--pf-c-select__toggle-typeahead--BorderTop);
20618
+ border-right: var(--pf-c-select__toggle-typeahead--BorderRight);
20619
+ border-bottom-color: transparent;
20620
+ border-left: var(--pf-c-select__toggle-typeahead--BorderLeft);
20971
20621
  }
20972
20622
 
20973
- .pf-c-skeleton::before {
20974
- display: block;
20975
- height: var(--pf-c-skeleton--before--Height);
20976
- padding-bottom: var(--pf-c-skeleton--before--PaddingBottom);
20977
- content: var(--pf-c-skeleton--before--Content);
20623
+ .pf-c-select__toggle-typeahead.pf-c-form-control:focus {
20624
+ padding-bottom: var(--pf-c-select__toggle-typeahead--focus--PaddingBottom);
20978
20625
  }
20979
20626
 
20980
- .pf-c-skeleton::after {
20627
+ .pf-c-select__menu {
20981
20628
  position: absolute;
20982
- top: 0;
20983
- right: 0;
20984
- bottom: 0;
20985
- left: 0;
20986
- display: block;
20987
- content: "";
20988
- background: linear-gradient(var(--pf-c-skeleton--after--LinearGradientAngle), var(--pf-c-skeleton--after--LinearGradientColorStop1), var(--pf-c-skeleton--after--LinearGradientColorStop2), var(--pf-c-skeleton--after--LinearGradientColorStop3));
20989
- transform: translate3d(var(--pf-c-skeleton--after--TranslateX), 0, 0);
20990
- animation: var(--pf-c-skeleton--after--AnimationName) var(--pf-c-skeleton--after--AnimationDuration) var(--pf-c-skeleton--after--AnimationTimingFunction) var(--pf-c-skeleton--after--AnimationDelay) var(--pf-c-skeleton--after--AnimationIterationCount);
20629
+ top: var(--pf-c-select__menu--Top);
20630
+ z-index: var(--pf-c-select__menu--ZIndex);
20631
+ width: var(--pf-c-select__menu--Width);
20632
+ min-width: var(--pf-c-select__menu--MinWidth);
20633
+ padding-top: var(--pf-c-select__menu--PaddingTop);
20634
+ padding-bottom: var(--pf-c-select__menu--PaddingBottom);
20635
+ background-color: var(--pf-c-select__menu--BackgroundColor);
20636
+ background-clip: padding-box;
20637
+ box-shadow: var(--pf-c-select__menu--BoxShadow);
20991
20638
  }
20992
20639
 
20993
- .pf-c-skeleton.pf-m-circle {
20994
- --pf-c-skeleton--BorderRadius: var(--pf-c-skeleton--m-circle--BorderRadius);
20640
+ .pf-c-select__menu.pf-m-align-right {
20641
+ right: 0;
20995
20642
  }
20996
20643
 
20997
- .pf-c-skeleton.pf-m-square, .pf-c-skeleton.pf-m-circle {
20998
- --pf-c-skeleton--before--Height: 0;
20999
- --pf-c-skeleton--before--PaddingBottom: var(--pf-c-skeleton--m-circle--before--PaddingBottom);
20644
+ .pf-c-select.pf-m-top .pf-c-select__menu {
20645
+ top: 0;
20646
+ transform: translateY(var(--pf-c-select__menu--m-top--TranslateY));
21000
20647
  }
21001
20648
 
21002
- .pf-c-skeleton.pf-m-width-sm {
21003
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-sm--Width);
20649
+ .pf-c-select__menu-fieldset {
20650
+ border: 0;
21004
20651
  }
21005
20652
 
21006
- .pf-c-skeleton.pf-m-width-md {
21007
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-md--Width);
20653
+ .pf-c-select__menu-wrapper {
20654
+ display: flex;
21008
20655
  }
21009
20656
 
21010
- .pf-c-skeleton.pf-m-width-lg {
21011
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-lg--Width);
20657
+ .pf-c-select__menu-wrapper.pf-m-favorite .pf-c-select__menu-item.pf-m-favorite-action {
20658
+ --pf-c-select__menu-item--m-favorite-action--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--Color);
20659
+ --pf-c-select__menu-item--m-favorite-action--hover--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--hover--Color);
20660
+ --pf-c-select__menu-item--m-favorite-action--focus--Color: var(--pf-c-select__menu-wrapper--m-favorite__menu-item--m-favorite-action--focus--Color);
21012
20661
  }
21013
20662
 
21014
- .pf-c-skeleton.pf-m-width-25 {
21015
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-25--Width);
20663
+ .pf-c-select__menu-item {
20664
+ position: relative;
20665
+ width: var(--pf-c-select__menu-item--Width);
20666
+ padding: var(--pf-c-select__menu-item--PaddingTop) var(--pf-c-select__menu-item--PaddingRight) var(--pf-c-select__menu-item--PaddingBottom) var(--pf-c-select__menu-item--PaddingLeft);
20667
+ font-size: var(--pf-c-select__menu-item--FontSize);
20668
+ font-weight: var(--pf-c-select__menu-item--FontWeight);
20669
+ line-height: var(--pf-c-select__menu-item--LineHeight);
20670
+ color: var(--pf-c-select__menu-item--Color);
20671
+ text-align: left;
20672
+ white-space: nowrap;
20673
+ background-color: transparent;
20674
+ border: none;
21016
20675
  }
21017
20676
 
21018
- .pf-c-skeleton.pf-m-width-33 {
21019
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-33--Width);
20677
+ .pf-c-select__menu-item:hover, .pf-c-select__menu-item:focus, .pf-c-select__menu-item.pf-m-focus {
20678
+ --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--hover__menu-item--m-action--Color);
20679
+ text-decoration: none;
21020
20680
  }
21021
20681
 
21022
- .pf-c-skeleton.pf-m-width-50 {
21023
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-50--Width);
20682
+ .pf-c-select__menu-wrapper:hover, .pf-c-select__menu-item:hover {
20683
+ background-color: var(--pf-c-select__menu-item--hover--BackgroundColor);
21024
20684
  }
21025
20685
 
21026
- .pf-c-skeleton.pf-m-width-66 {
21027
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-66--Width);
20686
+ .pf-c-select__menu-wrapper:focus-within,
20687
+ .pf-c-select__menu-wrapper.pf-m-focus, .pf-c-select__menu-item:focus, .pf-c-select__menu-item.pf-m-focus {
20688
+ position: relative;
20689
+ background-color: var(--pf-c-select__menu-item--focus--BackgroundColor);
21028
20690
  }
21029
20691
 
21030
- .pf-c-skeleton.pf-m-width-75 {
21031
- --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-75--Width);
20692
+ .pf-c-select__menu-item.pf-m-link {
20693
+ --pf-c-select__menu-item--PaddingRight: 0;
20694
+ --pf-c-select__menu-item-main--PaddingRight: 0;
20695
+ --pf-c-select__menu-item-description--PaddingRight: 0;
20696
+ --pf-c-select__menu-item--Width: var(--pf-c-select__menu-item--m-link--Width);
20697
+ --pf-c-select__menu-item--hover--BackgroundColor: var(--pf-c-select__menu-item--m-link--hover--BackgroundColor);
20698
+ --pf-c-select__menu-item--focus--BackgroundColor: var(--pf-c-select__menu-item--m-link--focus--BackgroundColor);
20699
+ flex-grow: 1;
21032
20700
  }
21033
20701
 
21034
- .pf-c-skeleton.pf-m-height-sm {
21035
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-sm--Height);
20702
+ .pf-c-select__menu-item.pf-m-action {
20703
+ --pf-c-select__menu-item--Color: var(--pf-c-select__menu-item--m-action--Color);
20704
+ --pf-c-select__menu-item--Width: var(--pf-c-select__menu-item--m-action--Width);
20705
+ --pf-c-select__menu-item--hover--BackgroundColor: var(--pf-c-select__menu-item--m-action--hover--BackgroundColor);
20706
+ --pf-c-select__menu-item--focus--BackgroundColor: var(--pf-c-select__menu-item--m-action--focus--BackgroundColor);
20707
+ display: flex;
20708
+ align-items: flex-start;
20709
+ font-size: var(--pf-c-select__menu-item--m-action--FontSize);
21036
20710
  }
21037
20711
 
21038
- .pf-c-skeleton.pf-m-height-md {
21039
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-md--Height);
20712
+ .pf-c-select__menu-item.pf-m-action:hover {
20713
+ --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-action--hover--Color);
21040
20714
  }
21041
20715
 
21042
- .pf-c-skeleton.pf-m-height-lg {
21043
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-lg--Height);
20716
+ .pf-c-select__menu-item.pf-m-action:focus {
20717
+ --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-action--focus--Color);
21044
20718
  }
21045
20719
 
21046
- .pf-c-skeleton.pf-m-height-25 {
21047
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-25--Height);
20720
+ .pf-c-select__menu-item.pf-m-action:disabled {
20721
+ --pf-c-select__menu-item--disabled--Color: var(--pf-c-select__menu-item--m-action--disabled--Color);
21048
20722
  }
21049
20723
 
21050
- .pf-c-skeleton.pf-m-height-33 {
21051
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-33--Height);
20724
+ .pf-c-select__menu-item.pf-m-favorite-action {
20725
+ --pf-c-select__menu-item--m-action--Color: var(--pf-c-select__menu-item--m-favorite-action--Color);
20726
+ --pf-c-select__menu-item--m-action--hover--Color: var(--pf-c-select__menu-item--m-favorite-action--hover--Color);
20727
+ --pf-c-select__menu-item--m-action--focus--Color: var(--pf-c-select__menu-item--m-favorite-action--focus--Color);
21052
20728
  }
21053
20729
 
21054
- .pf-c-skeleton.pf-m-height-50 {
21055
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-50--Height);
20730
+ .pf-c-select__menu-item.pf-m-selected {
20731
+ --pf-c-select__menu-item--PaddingRight: var(--pf-c-select__menu-item--m-selected--PaddingRight);
20732
+ --pf-c-select__menu-item-main--PaddingRight: var(--pf-c-select__menu-item--m-selected__menu-item-main--PaddingRight);
21056
20733
  }
21057
20734
 
21058
- .pf-c-skeleton.pf-m-height-66 {
21059
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-66--Height);
20735
+ .pf-c-select__menu-item.pf-m-description {
20736
+ white-space: normal;
21060
20737
  }
21061
20738
 
21062
- .pf-c-skeleton.pf-m-height-75 {
21063
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-75--Height);
20739
+ .pf-c-select__menu-item.pf-m-description:not(.pf-c-check) {
20740
+ --pf-c-select__menu-item--PaddingRight: 0;
21064
20741
  }
21065
20742
 
21066
- .pf-c-skeleton.pf-m-height-100 {
21067
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-100--Height);
20743
+ .pf-c-select__menu-item.pf-m-description .pf-c-check__label {
20744
+ white-space: nowrap;
21068
20745
  }
21069
20746
 
21070
- .pf-c-skeleton.pf-m-text-4xl {
21071
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-4xl--Height);
20747
+ .pf-c-select__menu-wrapper.pf-m-disabled, .pf-c-select__menu-item:disabled, .pf-c-select__menu-item.pf-m-disabled {
20748
+ --pf-c-select__menu-item-count--Color: var(--pf-c-select__menu-item--disabled__menu-item-count--Color);
20749
+ color: var(--pf-c-select__menu-item--disabled--Color);
20750
+ pointer-events: none;
20751
+ background-color: var(--pf-c-select__menu-item--disabled--BackgroundColor);
21072
20752
  }
21073
20753
 
21074
- .pf-c-skeleton.pf-m-text-3xl {
21075
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-3xl--Height);
20754
+ .pf-c-select__menu-item.pf-c-check .pf-c-check__label {
20755
+ width: 100%;
21076
20756
  }
21077
20757
 
21078
- .pf-c-skeleton.pf-m-text-2xl {
21079
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-2xl--Height);
20758
+ .pf-c-select__menu-item.pf-m-load {
20759
+ --pf-c-select__menu-item--hover--BackgroundColor: transparent;
20760
+ --pf-c-select__menu-item--focus--BackgroundColor: transparent;
20761
+ --pf-c-select__menu-item--Color: var(--pf-c-select__menu-item--m-load--Color);
21080
20762
  }
21081
20763
 
21082
- .pf-c-skeleton.pf-m-text-xl {
21083
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-xl--Height);
20764
+ .pf-c-select__list-item.pf-m-loading {
20765
+ padding-top: var(--pf-c-select__list-item--m-loading--PaddingTop);
20766
+ text-align: center;
21084
20767
  }
21085
20768
 
21086
- .pf-c-skeleton.pf-m-text-lg {
21087
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-lg--Height);
20769
+ .pf-c-select__menu-item-main {
20770
+ position: relative;
20771
+ display: block;
20772
+ padding-right: var(--pf-c-select__menu-item-main--PaddingRight);
20773
+ white-space: nowrap;
21088
20774
  }
21089
20775
 
21090
- .pf-c-skeleton.pf-m-text-md {
21091
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-md--Height);
20776
+ .pf-c-select__menu-item-row {
20777
+ display: flex;
21092
20778
  }
21093
20779
 
21094
- .pf-c-skeleton.pf-m-text-sm {
21095
- --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-sm--Height);
20780
+ .pf-c-select__menu-item-text {
20781
+ flex-grow: 1;
21096
20782
  }
21097
20783
 
21098
- @keyframes pf-c-skeleton-loading {
21099
- 0% {
21100
- transform: translateX(-100%);
21101
- }
21102
- 60% {
21103
- transform: translateX(100%);
21104
- }
21105
- 100% {
21106
- transform: translateX(100%);
21107
- }
20784
+ .pf-c-select__menu-item-count {
20785
+ align-self: center;
20786
+ margin-left: var(--pf-c-select__menu-item-count--MarginLeft);
20787
+ font-size: var(--pf-c-select__menu-item-count--FontSize);
20788
+ color: var(--pf-c-select__menu-item-count--Color);
21108
20789
  }
21109
- .pf-c-skip-to-content {
21110
- --pf-c-skip-to-content--Top: var(--pf-global--spacer--md);
21111
- --pf-c-skip-to-content--ZIndex: var(--pf-global--ZIndex--2xl);
21112
- --pf-c-skip-to-content--focus--Left: var(--pf-global--spacer--md);
21113
- position: absolute;
21114
- top: var(--pf-c-skip-to-content--Top);
21115
- left: -300%;
21116
- z-index: var(--pf-c-skip-to-content--ZIndex);
20790
+
20791
+ .pf-c-select__menu-item-description {
20792
+ display: block;
20793
+ padding-right: var(--pf-c-select__menu-item-description--PaddingRight);
20794
+ font-size: var(--pf-c-select__menu-item-description--FontSize);
20795
+ color: var(--pf-c-select__menu-item-description--Color);
21117
20796
  }
21118
20797
 
21119
- .pf-c-skip-to-content:focus {
21120
- left: var(--pf-c-skip-to-content--focus--Left);
20798
+ .pf-c-select__menu-item-icon {
20799
+ position: absolute;
20800
+ top: var(--pf-c-select__menu-item-icon--Top);
20801
+ right: var(--pf-c-select__menu-item-icon--Right);
20802
+ font-size: var(--pf-c-select__menu-item-icon--FontSize);
20803
+ color: var(--pf-c-select__menu-item-icon--Color);
20804
+ transform: translateY(var(--pf-c-select__menu-item-icon--TranslateY));
21121
20805
  }
21122
20806
 
21123
- .pf-c-slider {
21124
- --pf-c-slider--value: 0;
21125
- --pf-c-slider__rail--PaddingTop: var(--pf-global--spacer--md);
21126
- --pf-c-slider__rail--PaddingBottom: var(--pf-global--spacer--md);
21127
- --pf-c-slider__rail-track--Height: 0.25rem;
21128
- --pf-c-slider__rail-track--before--base--BackgroundColor: var(--pf-global--BorderColor--100);
21129
- --pf-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-global--active-color--300);
21130
- --pf-c-slider__rail-track--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21131
- --pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-c-slider--value);
21132
- --pf-c-slider__steps--FontSize: var(--pf-global--FontSize--sm);
21133
- --pf-c-slider__steps--Height: var(--pf-c-slider__steps--FontSize);
21134
- --pf-c-slider__step-tick--Top: var(--pf-global--spacer--md);
21135
- --pf-c-slider__step-tick--Width: 0.25rem;
21136
- --pf-c-slider__step-tick--Height: 0.25rem;
21137
- --pf-c-slider__step-tick--BackgroundColor: var(--pf-global--BorderColor--200);
21138
- --pf-c-slider__step-tick--TranslateX: -50%;
21139
- --pf-c-slider__step-tick--BorderRadius: var(--pf-global--BorderRadius--lg);
21140
- --pf-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-global--primary-color--100);
21141
- --pf-c-slider__step--first-child__step-tick--TranslateX: 0;
21142
- --pf-c-slider__step--last-child__step-tick--TranslateX: -100%;
21143
- --pf-c-slider__step-label--TranslateX: -50%;
21144
- --pf-c-slider__step-label--Top: calc(var(--pf-global--spacer--xl) + var(--pf-c-slider__rail-track--Height));
21145
- --pf-c-slider__step--first-child__step-label--TranslateX: 0;
21146
- --pf-c-slider__step--last-child__step-label--TranslateX: -100%;
21147
- --pf-c-slider__thumb--Top: calc(var(--pf-c-slider__rail-track--Height) / 2 + var(--pf-global--spacer--md));
21148
- --pf-c-slider__thumb--Width: 1rem;
21149
- --pf-c-slider__thumb--Height: 1rem;
21150
- --pf-c-slider__thumb--Left: var(--pf-c-slider--value);
21151
- --pf-c-slider__thumb--BackgroundColor: var(--pf-global--primary-color--100);
21152
- --pf-c-slider__thumb--TranslateX: -50%;
21153
- --pf-c-slider__thumb--TranslateY: -50%;
21154
- --pf-c-slider__thumb--BorderRadius: var(--pf-global--BorderRadius--lg);
21155
- --pf-c-slider__thumb--BoxShadow--base:
21156
- 0 0 0 2px var(--pf-global--BackgroundColor--100),
21157
- 0 0 0 3px var(--pf-global--primary-color--100);
21158
- --pf-c-slider__thumb--hover--BoxShadow: var(--pf-c-slider__thumb--BoxShadow--base);
21159
- --pf-c-slider__thumb--focus--BoxShadow: var(--pf-c-slider__thumb--BoxShadow--base);
21160
- --pf-c-slider__thumb--active--BoxShadow:
21161
- var(--pf-c-slider__thumb--BoxShadow--base),
21162
- 0 0 2px 5px var(--pf-global--active-color--200);
21163
- --pf-c-slider__thumb--before--Width: var(--pf-global--target-size--MinWidth);
21164
- --pf-c-slider__thumb--before--Height: var(--pf-global--target-size--MinHeight);
21165
- --pf-c-slider__thumb--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21166
- --pf-c-slider__thumb--before--TranslateX: -50%;
21167
- --pf-c-slider__thumb--before--TranslateY: -50%;
21168
- --pf-c-slider__value--MarginLeft: var(--pf-global--spacer--md);
21169
- --pf-c-slider__value--c-form-control--width-base: 3.5ch;
21170
- --pf-c-slider__value--c-form-control--width-chars: 3;
21171
- --pf-c-slider__value--c-form-control--Width: calc(var(--pf-c-slider__value--c-form-control--width-base) + (var(--pf-c-slider__value--c-form-control--width-chars) * 1ch));
21172
- --pf-c-slider__value--m-floating--TranslateX: -50%;
21173
- --pf-c-slider__value--m-floating--TranslateY: -100%;
21174
- --pf-c-slider__value--m-floating--Left: var(--pf-c-slider--value);
21175
- --pf-c-slider__value--m-floating--ZIndex: var(--pf-global--ZIndex--sm);
21176
- --pf-c-slider__actions--MarginRight: var(--pf-global--spacer--sm);
21177
- --pf-c-slider__main--actions--MarginLeft: var(--pf-global--spacer--sm);
21178
- --pf-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-global--palette--black-500);
21179
- --pf-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-global--palette--black-700);
21180
- --pf-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-global--palette--black-700);
20807
+ .pf-c-select__menu-item-action-icon {
21181
20808
  display: flex;
20809
+ align-items: center;
20810
+ min-height: var(--pf-c-select__menu-item-action-icon--MinHeight);
21182
20811
  }
21183
20812
 
21184
- .pf-c-slider.pf-m-disabled {
21185
- --pf-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-c-slider--m-disabled__rail-track--before--fill--BackgroundColor);
21186
- --pf-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor);
21187
- --pf-c-slider__thumb--BackgroundColor: var(--pf-c-slider--m-disabled__thumb--BackgroundColor);
20813
+ .pf-c-select__menu-item--match {
20814
+ font-weight: var(--pf-c-select__menu-item--match--FontWeight);
20815
+ background-color: inherit;
21188
20816
  }
21189
20817
 
21190
- .pf-c-slider.pf-m-disabled .pf-c-slider__rail,
21191
- .pf-c-slider.pf-m-disabled .pf-c-slider__thumb {
21192
- cursor: not-allowed;
20818
+ .pf-c-select__menu-group + .pf-c-select__menu-group {
20819
+ padding-top: var(--pf-c-select__menu-group--menu-group--PaddingTop);
21193
20820
  }
21194
20821
 
21195
- .pf-c-slider.pf-m-disabled .pf-c-slider__thumb {
21196
- --pf-c-slider__thumb--BoxShadow: none;
20822
+ .pf-c-select__menu-search {
20823
+ padding: var(--pf-c-select__menu-search--PaddingTop) var(--pf-c-select__menu-search--PaddingRight) var(--pf-c-select__menu-search--PaddingBottom) var(--pf-c-select__menu-search--PaddingLeft);
21197
20824
  }
21198
20825
 
21199
- .pf-c-slider__main {
21200
- position: relative;
21201
- flex-grow: 1;
20826
+ .pf-c-select__menu-group-title {
20827
+ padding-top: var(--pf-c-select__menu-group-title--PaddingTop);
20828
+ padding-right: var(--pf-c-select__menu-group-title--PaddingRight);
20829
+ padding-bottom: var(--pf-c-select__menu-group-title--PaddingBottom);
20830
+ padding-left: var(--pf-c-select__menu-group-title--PaddingLeft);
20831
+ font-size: var(--pf-c-select__menu-group-title--FontSize);
20832
+ font-weight: var(--pf-c-select__menu-group-title--FontWeight);
20833
+ color: var(--pf-c-select__menu-group-title--Color);
21202
20834
  }
21203
20835
 
21204
- .pf-c-slider__rail {
21205
- padding-top: var(--pf-c-slider__rail--PaddingTop);
21206
- padding-bottom: var(--pf-c-slider__rail--PaddingBottom);
20836
+ .pf-c-select__menu-footer {
20837
+ padding: var(--pf-c-select__menu-footer--PaddingTop) var(--pf-c-select__menu-footer--PaddingRight) var(--pf-c-select__menu-footer--PaddingBottom) var(--pf-c-select__menu-footer--PaddingLeft);
20838
+ margin-top: var(--pf-c-select__menu-footer--MarginTop);
20839
+ margin-bottom: var(--pf-c-select__menu-footer--MarginBottom);
20840
+ box-shadow: var(--pf-c-select__menu-footer--BoxShadow);
21207
20841
  }
21208
20842
 
21209
- .pf-c-slider__rail-track {
21210
- position: relative;
21211
- height: var(--pf-c-slider__rail-track--Height);
20843
+ .pf-c-simple-list {
20844
+ --pf-c-simple-list__item-link--PaddingTop: var(--pf-global--spacer--xs);
20845
+ --pf-c-simple-list__item-link--PaddingRight: var(--pf-global--spacer--md);
20846
+ --pf-c-simple-list__item-link--PaddingBottom: var(--pf-global--spacer--xs);
20847
+ --pf-c-simple-list__item-link--PaddingLeft: var(--pf-global--spacer--md);
20848
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-global--BackgroundColor--100);
20849
+ --pf-c-simple-list__item-link--Color: var(--pf-global--Color--100);
20850
+ --pf-c-simple-list__item-link--FontSize: var(--pf-global--FontSize--sm);
20851
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-global--FontWeight--normal);
20852
+ --pf-c-simple-list__item-link--m-current--Color: var(--pf-global--link--Color);
20853
+ --pf-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-global--BackgroundColor--200);
20854
+ --pf-c-simple-list__item-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
20855
+ --pf-c-simple-list__item-link--hover--Color: var(--pf-global--Color--100);
20856
+ --pf-c-simple-list__item-link--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
20857
+ --pf-c-simple-list__item-link--focus--Color: var(--pf-global--Color--100);
20858
+ --pf-c-simple-list__item-link--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
20859
+ --pf-c-simple-list__item-link--focus--FontWeight: var(--pf-global--FontWeight--normal);
20860
+ --pf-c-simple-list__item-link--active--Color: var(--pf-global--Color--100);
20861
+ --pf-c-simple-list__item-link--active--BackgroundColor: var(--pf-global--BackgroundColor--200);
20862
+ --pf-c-simple-list__item-link--active--FontWeight: var(--pf-global--FontWeight--normal);
20863
+ --pf-c-simple-list__title--PaddingTop: var(--pf-global--spacer--sm);
20864
+ --pf-c-simple-list__title--PaddingRight: var(--pf-global--spacer--md);
20865
+ --pf-c-simple-list__title--PaddingBottom: var(--pf-global--spacer--sm);
20866
+ --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
20867
+ --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
20868
+ --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
20869
+ --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
20870
+ --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
21212
20871
  }
21213
20872
 
21214
- .pf-c-slider__rail-track::before {
21215
- position: absolute;
21216
- top: 0;
21217
- right: 0;
21218
- bottom: 0;
21219
- left: 0;
21220
- content: "";
21221
- background: linear-gradient(to right, var(--pf-c-slider__rail-track--before--fill--BackgroundColor), var(--pf-c-slider__rail-track--before--fill--BackgroundColor) var(--pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop), var(--pf-c-slider__rail-track--before--base--BackgroundColor) var(--pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop));
21222
- border-radius: var(--pf-c-slider__rail-track--before--BorderRadius);
20873
+ .pf-c-simple-list__item-link {
20874
+ display: block;
20875
+ width: 100%;
20876
+ padding: var(--pf-c-simple-list__item-link--PaddingTop) var(--pf-c-simple-list__item-link--PaddingRight) var(--pf-c-simple-list__item-link--PaddingBottom) var(--pf-c-simple-list__item-link--PaddingLeft);
20877
+ font-size: var(--pf-c-simple-list__item-link--FontSize);
20878
+ font-weight: var(--pf-c-simple-list__item-link--FontWeight);
20879
+ color: var(--pf-c-simple-list__item-link--Color);
20880
+ text-align: left;
20881
+ background-color: var(--pf-c-simple-list__item-link--BackgroundColor);
20882
+ border: none;
21223
20883
  }
21224
20884
 
21225
- .pf-c-slider__steps {
21226
- height: var(--pf-c-slider__steps--Height);
21227
- font-size: var(--pf-c-slider__steps--FontSize);
21228
- line-height: 1;
20885
+ .pf-c-simple-list__item-link:hover {
20886
+ text-decoration: none;
20887
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--hover--BackgroundColor);
20888
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--hover--Color);
21229
20889
  }
21230
20890
 
21231
- .pf-c-slider__step {
21232
- position: absolute;
21233
- top: 0;
21234
- left: var(--pf-c-slider__step--Left);
21235
- content: "";
20891
+ .pf-c-simple-list__item-link:focus {
20892
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--focus--FontWeight);
20893
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--focus--BackgroundColor);
20894
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--focus--Color);
21236
20895
  }
21237
20896
 
21238
- .pf-c-slider__step.pf-m-active {
21239
- --pf-c-slider__step-tick--BackgroundColor: var(--pf-c-slider__step--m-active__slider-tick--BackgroundColor);
20897
+ .pf-c-simple-list__item-link:active {
20898
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--active--FontWeight);
20899
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--active--BackgroundColor);
20900
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--active--Color);
21240
20901
  }
21241
20902
 
21242
- .pf-c-slider__step:first-child {
21243
- --pf-c-slider__step-tick--TranslateX: var(--pf-c-slider__step--first-child__step-tick--TranslateX);
21244
- --pf-c-slider__step-label--TranslateX: var(--pf-c-slider__step--first-child__step-label--TranslateX);
20903
+ .pf-c-simple-list__item-link.pf-m-current {
20904
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--m-current--FontWeight);
20905
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--m-current--BackgroundColor);
20906
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--m-current--Color);
21245
20907
  }
21246
20908
 
21247
- .pf-c-slider__step:last-child {
21248
- --pf-c-slider__step-tick--TranslateX: var(--pf-c-slider__step--last-child__step-tick--TranslateX);
21249
- --pf-c-slider__step-label--TranslateX: var(--pf-c-slider__step--last-child__step-label--TranslateX);
20909
+ .pf-c-simple-list__title {
20910
+ padding: var(--pf-c-simple-list__title--PaddingTop) var(--pf-c-simple-list__title--PaddingRight) var(--pf-c-simple-list__title--PaddingBottom) var(--pf-c-simple-list__title--PaddingLeft);
20911
+ font-size: var(--pf-c-simple-list__title--FontSize);
20912
+ font-weight: var(--pf-c-simple-list__title--FontWeight);
20913
+ color: var(--pf-c-simple-list__title--Color);
21250
20914
  }
21251
20915
 
21252
- .pf-c-slider__step-tick {
21253
- position: absolute;
21254
- top: var(--pf-c-slider__step-tick--Top);
21255
- left: 0;
21256
- width: var(--pf-c-slider__step-tick--Width);
21257
- height: var(--pf-c-slider__step-tick--Height);
21258
- background-color: var(--pf-c-slider__step-tick--BackgroundColor);
21259
- border-radius: var(--pf-c-slider__step-tick--BorderRadius);
21260
- transform: translateX(var(--pf-c-slider__step-tick--TranslateX));
20916
+ .pf-c-simple-list__section + .pf-c-simple-list__section {
20917
+ margin-top: var(--pf-c-simple-list__section--section--MarginTop);
21261
20918
  }
21262
20919
 
21263
- .pf-c-slider__step-label {
21264
- position: absolute;
21265
- top: var(--pf-c-slider__step-label--Top);
21266
- transform: translateX(var(--pf-c-slider__step-label--TranslateX));
20920
+ .pf-c-skeleton {
20921
+ --pf-c-skeleton--BackgroundColor: var(--pf-global--palette--black-150);
20922
+ --pf-c-skeleton--Width: auto;
20923
+ --pf-c-skeleton--Height: auto;
20924
+ --pf-c-skeleton--BorderRadius: var(--pf-global--BorderRadius--sm);
20925
+ --pf-c-skeleton--before--PaddingBottom: 0;
20926
+ --pf-c-skeleton--before--Height: auto;
20927
+ --pf-c-skeleton--before--Content: " ";
20928
+ --pf-c-skeleton--after--LinearGradientAngle: 90deg;
20929
+ --pf-c-skeleton--after--LinearGradientColorStop1: var(--pf-global--palette--black-150);
20930
+ --pf-c-skeleton--after--LinearGradientColorStop2: #ededed;
20931
+ --pf-c-skeleton--after--LinearGradientColorStop3: var(--pf-global--palette--black-150);
20932
+ --pf-c-skeleton--after--TranslateX: -100%;
20933
+ --pf-c-skeleton--after--AnimationName: pf-c-skeleton-loading;
20934
+ --pf-c-skeleton--after--AnimationDuration: 2s;
20935
+ --pf-c-skeleton--after--AnimationIterationCount: infinite;
20936
+ --pf-c-skeleton--after--AnimationTimingFunction: linear;
20937
+ --pf-c-skeleton--after--AnimationDelay: .5s;
20938
+ --pf-c-skeleton--m-circle--BorderRadius: var(--pf-global--BorderRadius--lg);
20939
+ --pf-c-skeleton--m-circle--before--PaddingBottom: 100%;
20940
+ --pf-c-skeleton--m-text-4xl--Height: calc(var(--pf-global--FontSize--4xl) * var(--pf-global--LineHeight--sm));
20941
+ --pf-c-skeleton--m-text-3xl--Height: calc(var(--pf-global--FontSize--3xl) * var(--pf-global--LineHeight--sm));
20942
+ --pf-c-skeleton--m-text-2xl--Height: calc(var(--pf-global--FontSize--2xl) * var(--pf-global--LineHeight--sm));
20943
+ --pf-c-skeleton--m-text-xl--Height: calc(var(--pf-global--FontSize--xl) * var(--pf-global--LineHeight--sm));
20944
+ --pf-c-skeleton--m-text-lg--Height: calc(var(--pf-global--FontSize--lg) * var(--pf-global--LineHeight--md));
20945
+ --pf-c-skeleton--m-text-md--Height: calc(var(--pf-global--FontSize--md) * var(--pf-global--LineHeight--md));
20946
+ --pf-c-skeleton--m-text-sm--Height: calc(var(--pf-global--FontSize--sm) * var(--pf-global--LineHeight--md));
20947
+ --pf-c-skeleton--m-width-sm--Width: 6.25rem;
20948
+ --pf-c-skeleton--m-width-md--Width: 12.5rem;
20949
+ --pf-c-skeleton--m-width-lg--Width: 18.75rem;
20950
+ --pf-c-skeleton--m-width-25--Width: 25%;
20951
+ --pf-c-skeleton--m-width-33--Width: calc(100% / 3);
20952
+ --pf-c-skeleton--m-width-50--Width: 50%;
20953
+ --pf-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
20954
+ --pf-c-skeleton--m-width-75--Width: 75%;
20955
+ --pf-c-skeleton--m-height-sm--Height: 6.25rem;
20956
+ --pf-c-skeleton--m-height-md--Height: 12.5rem;
20957
+ --pf-c-skeleton--m-height-lg--Height: 18.75rem;
20958
+ --pf-c-skeleton--m-height-25--Height: 25%;
20959
+ --pf-c-skeleton--m-height-33--Height: calc(100% / 3);
20960
+ --pf-c-skeleton--m-height-50--Height: 50%;
20961
+ --pf-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
20962
+ --pf-c-skeleton--m-height-75--Height: 75%;
20963
+ --pf-c-skeleton--m-height-100--Height: 100%;
20964
+ position: relative;
20965
+ width: var(--pf-c-skeleton--Width);
20966
+ height: var(--pf-c-skeleton--Height);
20967
+ overflow: hidden;
20968
+ background-color: var(--pf-c-skeleton--BackgroundColor);
20969
+ border-radius: var(--pf-c-skeleton--BorderRadius);
20970
+ transform: translate(0);
21267
20971
  }
21268
20972
 
21269
- .pf-c-slider__thumb {
21270
- position: absolute;
21271
- top: var(--pf-c-slider__thumb--Top);
21272
- left: var(--pf-c-slider__thumb--Left);
21273
- width: var(--pf-c-slider__thumb--Width);
21274
- height: var(--pf-c-slider__thumb--Height);
21275
- cursor: pointer;
21276
- background-color: var(--pf-c-slider__thumb--BackgroundColor);
21277
- border-radius: var(--pf-c-slider__thumb--BorderRadius);
21278
- box-shadow: var(--pf-c-slider__thumb--BoxShadow);
21279
- transform: translate(var(--pf-c-slider__thumb--TranslateX), var(--pf-c-slider__thumb--TranslateY));
20973
+ .pf-c-skeleton::before {
20974
+ display: block;
20975
+ height: var(--pf-c-skeleton--before--Height);
20976
+ padding-bottom: var(--pf-c-skeleton--before--PaddingBottom);
20977
+ content: var(--pf-c-skeleton--before--Content);
21280
20978
  }
21281
20979
 
21282
- .pf-c-slider__thumb::before {
20980
+ .pf-c-skeleton::after {
21283
20981
  position: absolute;
21284
- top: 50%;
21285
- left: 50%;
21286
- width: var(--pf-c-slider__thumb--before--Width);
21287
- height: var(--pf-c-slider__thumb--before--Height);
20982
+ top: 0;
20983
+ right: 0;
20984
+ bottom: 0;
20985
+ left: 0;
20986
+ display: block;
21288
20987
  content: "";
21289
- border-radius: var(--pf-c-slider__thumb--before--BorderRadius);
21290
- transform: translate(var(--pf-c-slider__thumb--before--TranslateX), var(--pf-c-slider__thumb--before--TranslateY));
21291
- }
21292
-
21293
- .pf-c-slider__thumb:hover {
21294
- --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--hover--BoxShadow);
21295
- }
21296
-
21297
- .pf-c-slider__thumb:focus {
21298
- --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--focus--BoxShadow);
21299
- outline: 0;
21300
- }
21301
-
21302
- .pf-c-slider__thumb:active {
21303
- --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--active--BoxShadow);
20988
+ background: linear-gradient(var(--pf-c-skeleton--after--LinearGradientAngle), var(--pf-c-skeleton--after--LinearGradientColorStop1), var(--pf-c-skeleton--after--LinearGradientColorStop2), var(--pf-c-skeleton--after--LinearGradientColorStop3));
20989
+ transform: translate3d(var(--pf-c-skeleton--after--TranslateX), 0, 0);
20990
+ animation: var(--pf-c-skeleton--after--AnimationName) var(--pf-c-skeleton--after--AnimationDuration) var(--pf-c-skeleton--after--AnimationTimingFunction) var(--pf-c-skeleton--after--AnimationDelay) var(--pf-c-skeleton--after--AnimationIterationCount);
21304
20991
  }
21305
20992
 
21306
- .pf-c-slider__value {
21307
- margin-left: var(--pf-c-slider__value--MarginLeft);
20993
+ .pf-c-skeleton.pf-m-circle {
20994
+ --pf-c-skeleton--BorderRadius: var(--pf-c-skeleton--m-circle--BorderRadius);
21308
20995
  }
21309
20996
 
21310
- .pf-c-slider__value.pf-m-floating {
21311
- --pf-c-slider__value--MarginLeft: 0;
21312
- position: absolute;
21313
- top: 0;
21314
- left: var(--pf-c-slider__value--m-floating--Left);
21315
- z-index: var(--pf-c-slider__value--m-floating--ZIndex);
21316
- transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
20997
+ .pf-c-skeleton.pf-m-square, .pf-c-skeleton.pf-m-circle {
20998
+ --pf-c-skeleton--before--Height: 0;
20999
+ --pf-c-skeleton--before--PaddingBottom: var(--pf-c-skeleton--m-circle--before--PaddingBottom);
21317
21000
  }
21318
21001
 
21319
- .pf-c-slider__value.pf-m-floating .pf-c-input-group {
21320
- align-items: center;
21002
+ .pf-c-skeleton.pf-m-width-sm {
21003
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-sm--Width);
21321
21004
  }
21322
21005
 
21323
- .pf-c-slider__value.pf-m-floating .pf-c-input-group__text {
21324
- position: absolute;
21325
- left: 100%;
21006
+ .pf-c-skeleton.pf-m-width-md {
21007
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-md--Width);
21326
21008
  }
21327
21009
 
21328
- .pf-c-slider__value .pf-c-form-control {
21329
- width: var(--pf-c-slider__value--c-form-control--Width);
21010
+ .pf-c-skeleton.pf-m-width-lg {
21011
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-lg--Width);
21330
21012
  }
21331
21013
 
21332
- .pf-c-slider__actions {
21333
- display: flex;
21334
- margin-right: var(--pf-c-slider__actions--MarginRight);
21014
+ .pf-c-skeleton.pf-m-width-25 {
21015
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-25--Width);
21335
21016
  }
21336
21017
 
21337
- .pf-c-slider__main ~ .pf-c-slider__actions {
21338
- --pf-c-slider__actions--MarginRight: 0;
21339
- margin-left: var(--pf-c-slider__main--actions--MarginLeft);
21018
+ .pf-c-skeleton.pf-m-width-33 {
21019
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-33--Width);
21340
21020
  }
21341
-
21342
- .pf-c-switch {
21343
- --pf-c-switch--FontSize: var(--pf-global--FontSize--md);
21344
- --pf-c-switch__label--PaddingLeft: var(--pf-global--spacer--md);
21345
- --pf-c-switch--ColumnGap: var(--pf-c-switch__label--PaddingLeft);
21346
- --pf-c-switch__toggle-icon--FontSize: calc(var(--pf-c-switch--FontSize) * .625);
21347
- --pf-c-switch__toggle-icon--Color: var(--pf-global--Color--light-100);
21348
- --pf-c-switch__toggle-icon--Left: calc(var(--pf-c-switch--FontSize) * .4);
21349
- --pf-c-switch__toggle-icon--Offset: 0.125rem;
21350
- --pf-c-switch--LineHeight: var(--pf-global--LineHeight--md);
21351
- --pf-c-switch--Height: auto;
21352
- --pf-c-switch__input--checked__toggle--BackgroundColor: var(--pf-global--primary-color--100);
21353
- --pf-c-switch__input--checked__toggle--before--TranslateX: calc(100% + var(--pf-c-switch__toggle-icon--Offset));
21354
- --pf-c-switch__input--checked__label--Color: var(--pf-global--Color--dark-100);
21355
- --pf-c-switch__input--not-checked__label--Color: var(--pf-global--disabled-color--100);
21356
- --pf-c-switch__input--disabled__label--Color: var(--pf-global--disabled-color--100);
21357
- --pf-c-switch__input--disabled__toggle--BackgroundColor: var(--pf-global--Color--dark-200);
21358
- --pf-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-global--disabled-color--200);
21359
- --pf-c-switch__input--focus__toggle--OutlineWidth: var(--pf-global--BorderWidth--md);
21360
- --pf-c-switch__input--focus__toggle--OutlineOffset: var(--pf-global--spacer--sm);
21361
- --pf-c-switch__input--focus__toggle--OutlineColor: var(--pf-global--primary-color--100);
21362
- --pf-c-switch__toggle--Height: calc(var(--pf-c-switch--FontSize) * var(--pf-c-switch--LineHeight));
21363
- --pf-c-switch__toggle--BackgroundColor: var(--pf-global--disabled-color--200);
21364
- --pf-c-switch__toggle--BorderRadius: var(--pf-c-switch__toggle--Height);
21365
- --pf-c-switch__toggle--before--Width: calc(var(--pf-c-switch--FontSize) - var(--pf-c-switch__toggle-icon--Offset));
21366
- --pf-c-switch__toggle--before--Height: var(--pf-c-switch__toggle--before--Width);
21367
- --pf-c-switch__toggle--before--Top: calc((var(--pf-c-switch__toggle--Height) - var(--pf-c-switch__toggle--before--Height)) / 2);
21368
- --pf-c-switch__toggle--before--Left: var(--pf-c-switch__toggle--before--Top);
21369
- --pf-c-switch__toggle--before--BackgroundColor: var(--pf-global--BackgroundColor--100);
21370
- --pf-c-switch__toggle--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21371
- --pf-c-switch__toggle--before--BoxShadow: var(--pf-global--BoxShadow--md);
21372
- --pf-c-switch__toggle--before--Transition: transform .25s ease 0s;
21373
- --pf-c-switch__toggle--Width: calc(var(--pf-c-switch__toggle--Height) + var(--pf-c-switch__toggle-icon--Offset) + var(--pf-c-switch__toggle--before--Width));
21374
- --pf-c-switch__label--Color: var(--pf-global--Color--dark-100);
21375
- position: relative;
21376
- display: inline-grid;
21377
- grid-template-columns: auto;
21378
- grid-auto-columns: 1fr;
21379
- column-gap: var(--pf-c-switch--ColumnGap);
21380
- height: var(--pf-c-switch--Height);
21381
- font-size: var(--pf-c-switch--FontSize);
21382
- line-height: var(--pf-c-switch--LineHeight);
21383
- vertical-align: middle;
21384
- cursor: pointer;
21021
+
21022
+ .pf-c-skeleton.pf-m-width-50 {
21023
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-50--Width);
21385
21024
  }
21386
21025
 
21387
- .pf-c-switch.pf-m-reverse .pf-c-switch__label,
21388
- .pf-c-switch.pf-m-reverse .pf-c-switch__toggle {
21389
- grid-row: 1;
21026
+ .pf-c-skeleton.pf-m-width-66 {
21027
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-66--Width);
21390
21028
  }
21391
21029
 
21392
- .pf-c-switch.pf-m-reverse .pf-c-switch__label {
21393
- grid-column: 1;
21030
+ .pf-c-skeleton.pf-m-width-75 {
21031
+ --pf-c-skeleton--Width: var(--pf-c-skeleton--m-width-75--Width);
21394
21032
  }
21395
21033
 
21396
- .pf-c-switch__input {
21397
- position: absolute;
21398
- cursor: pointer;
21399
- opacity: 0;
21034
+ .pf-c-skeleton.pf-m-height-sm {
21035
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-sm--Height);
21400
21036
  }
21401
21037
 
21402
- .pf-c-switch__input:focus ~ .pf-c-switch__toggle {
21403
- outline: var(--pf-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-c-switch__input--focus__toggle--OutlineColor);
21404
- outline-offset: var(--pf-c-switch__input--focus__toggle--OutlineOffset);
21038
+ .pf-c-skeleton.pf-m-height-md {
21039
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-md--Height);
21405
21040
  }
21406
21041
 
21407
- .pf-c-switch__input:checked ~ .pf-c-switch__label {
21408
- color: var(--pf-c-switch__input--checked__label--Color);
21042
+ .pf-c-skeleton.pf-m-height-lg {
21043
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-lg--Height);
21409
21044
  }
21410
21045
 
21411
- .pf-c-switch__input:checked ~ .pf-c-switch__toggle {
21412
- background-color: var(--pf-c-switch__input--checked__toggle--BackgroundColor);
21046
+ .pf-c-skeleton.pf-m-height-25 {
21047
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-25--Height);
21413
21048
  }
21414
21049
 
21415
- .pf-c-switch__input:checked ~ .pf-c-switch__toggle::before {
21416
- transform: translateX(var(--pf-c-switch__input--checked__toggle--before--TranslateX));
21050
+ .pf-c-skeleton.pf-m-height-33 {
21051
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-33--Height);
21417
21052
  }
21418
21053
 
21419
- .pf-c-switch__input:checked ~ .pf-m-off {
21420
- display: none;
21054
+ .pf-c-skeleton.pf-m-height-50 {
21055
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-50--Height);
21421
21056
  }
21422
21057
 
21423
- .pf-c-switch__input:not(:checked) ~ .pf-c-switch__label {
21424
- color: var(--pf-c-switch__input--not-checked__label--Color);
21058
+ .pf-c-skeleton.pf-m-height-66 {
21059
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-66--Height);
21425
21060
  }
21426
21061
 
21427
- .pf-c-switch__input:not(:checked) ~ .pf-c-switch__toggle .pf-c-switch__toggle-icon {
21428
- display: none;
21429
- visibility: hidden;
21062
+ .pf-c-skeleton.pf-m-height-75 {
21063
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-75--Height);
21430
21064
  }
21431
21065
 
21432
- .pf-c-switch__input:not(:checked) ~ .pf-m-on {
21433
- display: none;
21066
+ .pf-c-skeleton.pf-m-height-100 {
21067
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-height-100--Height);
21434
21068
  }
21435
21069
 
21436
- .pf-c-switch__input:disabled {
21437
- cursor: not-allowed;
21070
+ .pf-c-skeleton.pf-m-text-4xl {
21071
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-4xl--Height);
21438
21072
  }
21439
21073
 
21440
- .pf-c-switch__input:disabled ~ .pf-c-switch__label {
21441
- color: var(--pf-c-switch__input--disabled__label--Color);
21442
- cursor: not-allowed;
21074
+ .pf-c-skeleton.pf-m-text-3xl {
21075
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-3xl--Height);
21443
21076
  }
21444
21077
 
21445
- .pf-c-switch__input:disabled ~ .pf-c-switch__toggle {
21446
- cursor: not-allowed;
21447
- background-color: var(--pf-c-switch__input--disabled__toggle--BackgroundColor);
21078
+ .pf-c-skeleton.pf-m-text-2xl {
21079
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-2xl--Height);
21448
21080
  }
21449
21081
 
21450
- .pf-c-switch__input:disabled ~ .pf-c-switch__toggle::before {
21451
- background-color: var(--pf-c-switch__input--disabled__toggle--before--BackgroundColor);
21082
+ .pf-c-skeleton.pf-m-text-xl {
21083
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-xl--Height);
21452
21084
  }
21453
21085
 
21454
- .pf-c-switch__toggle {
21455
- position: relative;
21456
- display: inline-block;
21457
- width: var(--pf-c-switch__toggle--Width);
21458
- height: var(--pf-c-switch__toggle--Height);
21459
- background-color: var(--pf-c-switch__toggle--BackgroundColor);
21460
- border-radius: var(--pf-c-switch__toggle--BorderRadius);
21086
+ .pf-c-skeleton.pf-m-text-lg {
21087
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-lg--Height);
21461
21088
  }
21462
21089
 
21463
- .pf-c-switch__toggle::before {
21464
- position: absolute;
21465
- top: var(--pf-c-switch__toggle--before--Top);
21466
- left: var(--pf-c-switch__toggle--before--Left);
21467
- display: block;
21468
- width: var(--pf-c-switch__toggle--before--Width);
21469
- height: var(--pf-c-switch__toggle--before--Height);
21470
- content: "";
21471
- background-color: var(--pf-c-switch__toggle--before--BackgroundColor);
21472
- border-radius: var(--pf-c-switch__toggle--before--BorderRadius);
21473
- box-shadow: var(--pf-c-switch__toggle--before--BoxShadow);
21474
- transition: var(--pf-c-switch__toggle--before--Transition);
21090
+ .pf-c-skeleton.pf-m-text-md {
21091
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-md--Height);
21475
21092
  }
21476
21093
 
21477
- .pf-c-switch__toggle-icon {
21094
+ .pf-c-skeleton.pf-m-text-sm {
21095
+ --pf-c-skeleton--Height: var(--pf-c-skeleton--m-text-sm--Height);
21096
+ }
21097
+
21098
+ @keyframes pf-c-skeleton-loading {
21099
+ 0% {
21100
+ transform: translateX(-100%);
21101
+ }
21102
+ 60% {
21103
+ transform: translateX(100%);
21104
+ }
21105
+ 100% {
21106
+ transform: translateX(100%);
21107
+ }
21108
+ }
21109
+ .pf-c-skip-to-content {
21110
+ --pf-c-skip-to-content--Top: var(--pf-global--spacer--md);
21111
+ --pf-c-skip-to-content--ZIndex: var(--pf-global--ZIndex--2xl);
21112
+ --pf-c-skip-to-content--focus--Left: var(--pf-global--spacer--md);
21478
21113
  position: absolute;
21479
- top: 0;
21480
- bottom: 0;
21481
- left: var(--pf-c-switch__toggle-icon--Left);
21482
- display: flex;
21483
- align-items: center;
21484
- font-size: var(--pf-c-switch__toggle-icon--FontSize);
21485
- color: var(--pf-c-switch__toggle-icon--Color);
21114
+ top: var(--pf-c-skip-to-content--Top);
21115
+ left: -300%;
21116
+ z-index: var(--pf-c-skip-to-content--ZIndex);
21486
21117
  }
21487
21118
 
21488
- .pf-c-switch__label {
21489
- display: inline-block;
21490
- grid-column: 2;
21491
- color: var(--pf-c-switch__label--Color);
21492
- vertical-align: top;
21119
+ .pf-c-skip-to-content:focus {
21120
+ left: var(--pf-c-skip-to-content--focus--Left);
21493
21121
  }
21494
21122
 
21495
- .pf-c-content {
21496
- --pf-c-content--MarginBottom: var(--pf-global--spacer--md);
21497
- --pf-c-content--LineHeight: var(--pf-global--LineHeight--md);
21498
- --pf-c-content--FontSize: var(--pf-global--FontSize--md);
21499
- --pf-c-content--FontWeight: var(--pf-global--FontWeight--normal);
21500
- --pf-c-content--Color: var(--pf-global--Color--100);
21501
- --pf-c-content--heading--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
21502
- --pf-c-content--h1--MarginTop: var(--pf-global--spacer--lg);
21503
- --pf-c-content--h1--MarginBottom: var(--pf-global--spacer--sm);
21504
- --pf-c-content--h1--LineHeight: var(--pf-global--LineHeight--sm);
21505
- --pf-c-content--h1--FontSize: var(--pf-global--FontSize--2xl);
21506
- --pf-c-content--h1--FontWeight: var(--pf-global--FontWeight--normal);
21507
- --pf-c-content--h2--MarginTop: var(--pf-global--spacer--lg);
21508
- --pf-c-content--h2--MarginBottom: var(--pf-global--spacer--sm);
21509
- --pf-c-content--h2--LineHeight: var(--pf-global--LineHeight--md);
21510
- --pf-c-content--h2--FontSize: var(--pf-global--FontSize--xl);
21511
- --pf-c-content--h2--FontWeight: var(--pf-global--FontWeight--normal);
21512
- --pf-c-content--h3--MarginTop: var(--pf-global--spacer--lg);
21513
- --pf-c-content--h3--MarginBottom: var(--pf-global--spacer--sm);
21514
- --pf-c-content--h3--LineHeight: var(--pf-global--LineHeight--md);
21515
- --pf-c-content--h3--FontSize: var(--pf-global--FontSize--lg);
21516
- --pf-c-content--h3--FontWeight: var(--pf-global--FontWeight--normal);
21517
- --pf-c-content--h4--MarginTop: var(--pf-global--spacer--lg);
21518
- --pf-c-content--h4--MarginBottom: var(--pf-global--spacer--sm);
21519
- --pf-c-content--h4--LineHeight: var(--pf-global--LineHeight--md);
21520
- --pf-c-content--h4--FontSize: var(--pf-global--FontSize--md);
21521
- --pf-c-content--h4--FontWeight: var(--pf-global--FontWeight--normal);
21522
- --pf-c-content--h5--MarginTop: var(--pf-global--spacer--lg);
21523
- --pf-c-content--h5--MarginBottom: var(--pf-global--spacer--sm);
21524
- --pf-c-content--h5--LineHeight: var(--pf-global--LineHeight--md);
21525
- --pf-c-content--h5--FontSize: var(--pf-global--FontSize--md);
21526
- --pf-c-content--h5--FontWeight: var(--pf-global--FontWeight--normal);
21527
- --pf-c-content--h6--MarginTop: var(--pf-global--spacer--lg);
21528
- --pf-c-content--h6--MarginBottom: var(--pf-global--spacer--sm);
21529
- --pf-c-content--h6--LineHeight: var(--pf-global--LineHeight--md);
21530
- --pf-c-content--h6--FontSize: var(--pf-global--FontSize--md);
21531
- --pf-c-content--h6--FontWeight: var(--pf-global--FontWeight--normal);
21532
- --pf-c-content--small--MarginBottom: var(--pf-global--spacer--md);
21533
- --pf-c-content--small--LineHeight: var(--pf-global--LineHeight--md);
21534
- --pf-c-content--small--FontSize: var(--pf-global--FontSize--sm);
21535
- --pf-c-content--small--Color: var(--pf-global--Color--200);
21536
- --pf-c-content--a--Color: var(--pf-global--link--Color);
21537
- --pf-c-content--a--TextDecoration: var(--pf-global--link--TextDecoration);
21538
- --pf-c-content--a--hover--Color: var(--pf-global--link--Color--hover);
21539
- --pf-c-content--a--hover--TextDecoration: var(--pf-global--link--TextDecoration--hover);
21540
- --pf-c-content--a--visited--Color: var(--pf-global--link--Color--visited);
21541
- --pf-c-content--blockquote--PaddingTop: var(--pf-global--spacer--md);
21542
- --pf-c-content--blockquote--PaddingRight: var(--pf-global--spacer--md);
21543
- --pf-c-content--blockquote--PaddingBottom: var(--pf-global--spacer--md);
21544
- --pf-c-content--blockquote--PaddingLeft: var(--pf-global--spacer--md);
21545
- --pf-c-content--blockquote--Color: var(--pf-global--Color--200);
21546
- --pf-c-content--blockquote--BorderLeftColor: var(--pf-global--BorderColor--100);
21547
- --pf-c-content--blockquote--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
21548
- --pf-c-content--ol--PaddingLeft: var(--pf-global--spacer--lg);
21549
- --pf-c-content--ol--MarginLeft: var(--pf-global--spacer--lg);
21550
- --pf-c-content--ol--nested--MarginTop: var(--pf-global--spacer--sm);
21551
- --pf-c-content--ol--nested--MarginLeft: var(--pf-global--spacer--sm);
21552
- --pf-c-content--ul--PaddingLeft: var(--pf-global--spacer--lg);
21553
- --pf-c-content--ul--MarginLeft: var(--pf-global--spacer--lg);
21554
- --pf-c-content--ul--nested--MarginTop: var(--pf-global--spacer--sm);
21555
- --pf-c-content--ul--nested--MarginLeft: var(--pf-global--spacer--sm);
21556
- --pf-c-content--ul--ListStyle: var(--pf-global--ListStyle);
21557
- --pf-c-content--li--MarginTop: var(--pf-global--spacer--sm);
21558
- --pf-c-content--dl--ColumnGap: var(--pf-global--spacer--2xl);
21559
- --pf-c-content--dl--RowGap: var(--pf-global--spacer--md);
21560
- --pf-c-content--dt--FontWeight: var(--pf-global--FontWeight--semi-bold);
21561
- --pf-c-content--dt--MarginTop: var(--pf-global--spacer--md);
21562
- --pf-c-content--dt--sm--MarginTop: 0;
21563
- --pf-c-content--hr--Height: var(--pf-global--BorderWidth--sm);
21564
- --pf-c-content--hr--BackgroundColor: var(--pf-global--BorderColor--100);
21565
- font-size: var(--pf-c-content--FontSize);
21566
- line-height: var(--pf-c-content--LineHeight);
21567
- color: var(--pf-c-content--Color);
21123
+ .pf-c-slider {
21124
+ --pf-c-slider--value: 0;
21125
+ --pf-c-slider__rail--PaddingTop: var(--pf-global--spacer--md);
21126
+ --pf-c-slider__rail--PaddingBottom: var(--pf-global--spacer--md);
21127
+ --pf-c-slider__rail-track--Height: 0.25rem;
21128
+ --pf-c-slider__rail-track--before--base--BackgroundColor: var(--pf-global--BorderColor--100);
21129
+ --pf-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-global--active-color--300);
21130
+ --pf-c-slider__rail-track--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21131
+ --pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-c-slider--value);
21132
+ --pf-c-slider__steps--FontSize: var(--pf-global--FontSize--sm);
21133
+ --pf-c-slider__steps--Height: var(--pf-c-slider__steps--FontSize);
21134
+ --pf-c-slider__step-tick--Top: var(--pf-global--spacer--md);
21135
+ --pf-c-slider__step-tick--Width: 0.25rem;
21136
+ --pf-c-slider__step-tick--Height: 0.25rem;
21137
+ --pf-c-slider__step-tick--BackgroundColor: var(--pf-global--BorderColor--200);
21138
+ --pf-c-slider__step-tick--TranslateX: -50%;
21139
+ --pf-c-slider__step-tick--BorderRadius: var(--pf-global--BorderRadius--lg);
21140
+ --pf-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-global--primary-color--100);
21141
+ --pf-c-slider__step--first-child__step-tick--TranslateX: 0;
21142
+ --pf-c-slider__step--last-child__step-tick--TranslateX: -100%;
21143
+ --pf-c-slider__step-label--TranslateX: -50%;
21144
+ --pf-c-slider__step-label--Top: calc(var(--pf-global--spacer--xl) + var(--pf-c-slider__rail-track--Height));
21145
+ --pf-c-slider__step--first-child__step-label--TranslateX: 0;
21146
+ --pf-c-slider__step--last-child__step-label--TranslateX: -100%;
21147
+ --pf-c-slider__thumb--Top: calc(var(--pf-c-slider__rail-track--Height) / 2 + var(--pf-global--spacer--md));
21148
+ --pf-c-slider__thumb--Width: 1rem;
21149
+ --pf-c-slider__thumb--Height: 1rem;
21150
+ --pf-c-slider__thumb--Left: var(--pf-c-slider--value);
21151
+ --pf-c-slider__thumb--BackgroundColor: var(--pf-global--primary-color--100);
21152
+ --pf-c-slider__thumb--TranslateX: -50%;
21153
+ --pf-c-slider__thumb--TranslateY: -50%;
21154
+ --pf-c-slider__thumb--BorderRadius: var(--pf-global--BorderRadius--lg);
21155
+ --pf-c-slider__thumb--BoxShadow--base:
21156
+ 0 0 0 2px var(--pf-global--BackgroundColor--100),
21157
+ 0 0 0 3px var(--pf-global--primary-color--100);
21158
+ --pf-c-slider__thumb--hover--BoxShadow: var(--pf-c-slider__thumb--BoxShadow--base);
21159
+ --pf-c-slider__thumb--focus--BoxShadow: var(--pf-c-slider__thumb--BoxShadow--base);
21160
+ --pf-c-slider__thumb--active--BoxShadow:
21161
+ var(--pf-c-slider__thumb--BoxShadow--base),
21162
+ 0 0 2px 5px var(--pf-global--active-color--200);
21163
+ --pf-c-slider__thumb--before--Width: var(--pf-global--target-size--MinWidth);
21164
+ --pf-c-slider__thumb--before--Height: var(--pf-global--target-size--MinHeight);
21165
+ --pf-c-slider__thumb--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21166
+ --pf-c-slider__thumb--before--TranslateX: -50%;
21167
+ --pf-c-slider__thumb--before--TranslateY: -50%;
21168
+ --pf-c-slider__value--MarginLeft: var(--pf-global--spacer--md);
21169
+ --pf-c-slider__value--c-form-control--width-base: 3.5ch;
21170
+ --pf-c-slider__value--c-form-control--width-chars: 3;
21171
+ --pf-c-slider__value--c-form-control--Width: calc(var(--pf-c-slider__value--c-form-control--width-base) + (var(--pf-c-slider__value--c-form-control--width-chars) * 1ch));
21172
+ --pf-c-slider__value--m-floating--TranslateX: -50%;
21173
+ --pf-c-slider__value--m-floating--TranslateY: -100%;
21174
+ --pf-c-slider__value--m-floating--Left: var(--pf-c-slider--value);
21175
+ --pf-c-slider__value--m-floating--ZIndex: var(--pf-global--ZIndex--sm);
21176
+ --pf-c-slider__actions--MarginRight: var(--pf-global--spacer--sm);
21177
+ --pf-c-slider__main--actions--MarginLeft: var(--pf-global--spacer--sm);
21178
+ --pf-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-global--palette--black-500);
21179
+ --pf-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-global--palette--black-700);
21180
+ --pf-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-global--palette--black-700);
21181
+ display: flex;
21568
21182
  }
21569
21183
 
21570
- .pf-c-content a {
21571
- color: var(--pf-c-content--a--Color);
21572
- text-decoration: var(--pf-c-content--a--TextDecoration);
21184
+ .pf-c-slider.pf-m-disabled {
21185
+ --pf-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-c-slider--m-disabled__rail-track--before--fill--BackgroundColor);
21186
+ --pf-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor);
21187
+ --pf-c-slider__thumb--BackgroundColor: var(--pf-c-slider--m-disabled__thumb--BackgroundColor);
21573
21188
  }
21574
21189
 
21575
- .pf-c-content a:hover {
21576
- --pf-c-content--a--Color: var(--pf-c-content--a--hover--Color);
21577
- --pf-c-content--a--TextDecoration: var(--pf-c-content--a--hover--TextDecoration);
21190
+ .pf-c-slider.pf-m-disabled .pf-c-slider__rail,
21191
+ .pf-c-slider.pf-m-disabled .pf-c-slider__thumb {
21192
+ cursor: not-allowed;
21578
21193
  }
21579
21194
 
21580
- .pf-c-content.pf-m-visited a:visited,
21581
- .pf-c-content a.pf-m-visited:visited {
21582
- color: var(--pf-c-content--a--visited--Color);
21195
+ .pf-c-slider.pf-m-disabled .pf-c-slider__thumb {
21196
+ --pf-c-slider__thumb--BoxShadow: none;
21583
21197
  }
21584
21198
 
21585
- .pf-c-content li + li {
21586
- margin-top: var(--pf-c-content--li--MarginTop);
21199
+ .pf-c-slider__main {
21200
+ position: relative;
21201
+ flex-grow: 1;
21587
21202
  }
21588
21203
 
21589
- .pf-c-content p:not(:last-child),
21590
- .pf-c-content dl:not(:last-child),
21591
- .pf-c-content ol:not(:last-child),
21592
- .pf-c-content ul:not(:last-child),
21593
- .pf-c-content blockquote:not(:last-child),
21594
- .pf-c-content small:not(:last-child),
21595
- .pf-c-content pre:not(:last-child),
21596
- .pf-c-content table:not(:last-child),
21597
- .pf-c-content hr:not(:last-child) {
21598
- margin-bottom: var(--pf-c-content--MarginBottom);
21204
+ .pf-c-slider__rail {
21205
+ padding-top: var(--pf-c-slider__rail--PaddingTop);
21206
+ padding-bottom: var(--pf-c-slider__rail--PaddingBottom);
21599
21207
  }
21600
21208
 
21601
- .pf-c-content h1,
21602
- .pf-c-content h2,
21603
- .pf-c-content h3,
21604
- .pf-c-content h4,
21605
- .pf-c-content h5,
21606
- .pf-c-content h6 {
21607
- margin: 0;
21608
- font-family: var(--pf-c-content--heading--FontFamily);
21209
+ .pf-c-slider__rail-track {
21210
+ position: relative;
21211
+ height: var(--pf-c-slider__rail-track--Height);
21609
21212
  }
21610
21213
 
21611
- .pf-c-content h1:first-child,
21612
- .pf-c-content h2:first-child,
21613
- .pf-c-content h3:first-child,
21614
- .pf-c-content h4:first-child,
21615
- .pf-c-content h5:first-child,
21616
- .pf-c-content h6:first-child {
21617
- margin-top: 0;
21214
+ .pf-c-slider__rail-track::before {
21215
+ position: absolute;
21216
+ top: 0;
21217
+ right: 0;
21218
+ bottom: 0;
21219
+ left: 0;
21220
+ content: "";
21221
+ background: linear-gradient(to right, var(--pf-c-slider__rail-track--before--fill--BackgroundColor), var(--pf-c-slider__rail-track--before--fill--BackgroundColor) var(--pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop), var(--pf-c-slider__rail-track--before--base--BackgroundColor) var(--pf-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop));
21222
+ border-radius: var(--pf-c-slider__rail-track--before--BorderRadius);
21618
21223
  }
21619
21224
 
21620
- .pf-c-content h1:last-child,
21621
- .pf-c-content h2:last-child,
21622
- .pf-c-content h3:last-child,
21623
- .pf-c-content h4:last-child,
21624
- .pf-c-content h5:last-child,
21625
- .pf-c-content h6:last-child {
21626
- margin-bottom: 0;
21225
+ .pf-c-slider__steps {
21226
+ height: var(--pf-c-slider__steps--Height);
21227
+ font-size: var(--pf-c-slider__steps--FontSize);
21228
+ line-height: 1;
21627
21229
  }
21628
21230
 
21629
- .pf-c-content ol,
21630
- .pf-c-content ul {
21631
- margin: 0;
21231
+ .pf-c-slider__step {
21232
+ position: absolute;
21233
+ top: 0;
21234
+ left: var(--pf-c-slider__step--Left);
21235
+ content: "";
21632
21236
  }
21633
21237
 
21634
- .pf-c-content h1 {
21635
- margin-top: var(--pf-c-content--h1--MarginTop);
21636
- margin-bottom: var(--pf-c-content--h1--MarginBottom);
21637
- font-size: var(--pf-c-content--h1--FontSize);
21638
- font-weight: var(--pf-c-content--h1--FontWeight);
21639
- line-height: var(--pf-c-content--h1--LineHeight);
21238
+ .pf-c-slider__step.pf-m-active {
21239
+ --pf-c-slider__step-tick--BackgroundColor: var(--pf-c-slider__step--m-active__slider-tick--BackgroundColor);
21640
21240
  }
21641
21241
 
21642
- .pf-c-content h2 {
21643
- margin-top: var(--pf-c-content--h2--MarginTop);
21644
- margin-bottom: var(--pf-c-content--h2--MarginBottom);
21645
- font-size: var(--pf-c-content--h2--FontSize);
21646
- font-weight: var(--pf-c-content--h2--FontWeight);
21647
- line-height: var(--pf-c-content--h2--LineHeight);
21242
+ .pf-c-slider__step:first-child {
21243
+ --pf-c-slider__step-tick--TranslateX: var(--pf-c-slider__step--first-child__step-tick--TranslateX);
21244
+ --pf-c-slider__step-label--TranslateX: var(--pf-c-slider__step--first-child__step-label--TranslateX);
21648
21245
  }
21649
21246
 
21650
- .pf-c-content h3 {
21651
- margin-top: var(--pf-c-content--h3--MarginTop);
21652
- margin-bottom: var(--pf-c-content--h3--MarginBottom);
21653
- font-size: var(--pf-c-content--h3--FontSize);
21654
- font-weight: var(--pf-c-content--h3--FontWeight);
21655
- line-height: var(--pf-c-content--h3--LineHeight);
21247
+ .pf-c-slider__step:last-child {
21248
+ --pf-c-slider__step-tick--TranslateX: var(--pf-c-slider__step--last-child__step-tick--TranslateX);
21249
+ --pf-c-slider__step-label--TranslateX: var(--pf-c-slider__step--last-child__step-label--TranslateX);
21656
21250
  }
21657
21251
 
21658
- .pf-c-content h4 {
21659
- margin-top: var(--pf-c-content--h4--MarginTop);
21660
- margin-bottom: var(--pf-c-content--h4--MarginBottom);
21661
- font-size: var(--pf-c-content--h4--FontSize);
21662
- font-weight: var(--pf-c-content--h4--FontWeight);
21663
- line-height: var(--pf-c-content--h4--LineHeight);
21252
+ .pf-c-slider__step-tick {
21253
+ position: absolute;
21254
+ top: var(--pf-c-slider__step-tick--Top);
21255
+ left: 0;
21256
+ width: var(--pf-c-slider__step-tick--Width);
21257
+ height: var(--pf-c-slider__step-tick--Height);
21258
+ background-color: var(--pf-c-slider__step-tick--BackgroundColor);
21259
+ border-radius: var(--pf-c-slider__step-tick--BorderRadius);
21260
+ transform: translateX(var(--pf-c-slider__step-tick--TranslateX));
21664
21261
  }
21665
21262
 
21666
- .pf-c-content h5 {
21667
- margin-top: var(--pf-c-content--h5--MarginTop);
21668
- margin-bottom: var(--pf-c-content--h5--MarginBottom);
21669
- font-size: var(--pf-c-content--h5--FontSize);
21670
- font-weight: var(--pf-c-content--h5--FontWeight);
21671
- line-height: var(--pf-c-content--h5--LineHeight);
21263
+ .pf-c-slider__step-label {
21264
+ position: absolute;
21265
+ top: var(--pf-c-slider__step-label--Top);
21266
+ transform: translateX(var(--pf-c-slider__step-label--TranslateX));
21672
21267
  }
21673
21268
 
21674
- .pf-c-content h6 {
21675
- margin-top: var(--pf-c-content--h6--MarginTop);
21676
- margin-bottom: var(--pf-c-content--h6--MarginBottom);
21677
- font-size: var(--pf-c-content--h6--FontSize);
21678
- font-weight: var(--pf-c-content--h6--FontWeight);
21679
- line-height: var(--pf-c-content--h6--LineHeight);
21269
+ .pf-c-slider__thumb {
21270
+ position: absolute;
21271
+ top: var(--pf-c-slider__thumb--Top);
21272
+ left: var(--pf-c-slider__thumb--Left);
21273
+ width: var(--pf-c-slider__thumb--Width);
21274
+ height: var(--pf-c-slider__thumb--Height);
21275
+ cursor: pointer;
21276
+ background-color: var(--pf-c-slider__thumb--BackgroundColor);
21277
+ border-radius: var(--pf-c-slider__thumb--BorderRadius);
21278
+ box-shadow: var(--pf-c-slider__thumb--BoxShadow);
21279
+ transform: translate(var(--pf-c-slider__thumb--TranslateX), var(--pf-c-slider__thumb--TranslateY));
21280
+ }
21281
+
21282
+ .pf-c-slider__thumb::before {
21283
+ position: absolute;
21284
+ top: 50%;
21285
+ left: 50%;
21286
+ width: var(--pf-c-slider__thumb--before--Width);
21287
+ height: var(--pf-c-slider__thumb--before--Height);
21288
+ content: "";
21289
+ border-radius: var(--pf-c-slider__thumb--before--BorderRadius);
21290
+ transform: translate(var(--pf-c-slider__thumb--before--TranslateX), var(--pf-c-slider__thumb--before--TranslateY));
21291
+ }
21292
+
21293
+ .pf-c-slider__thumb:hover {
21294
+ --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--hover--BoxShadow);
21295
+ }
21296
+
21297
+ .pf-c-slider__thumb:focus {
21298
+ --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--focus--BoxShadow);
21299
+ outline: 0;
21300
+ }
21301
+
21302
+ .pf-c-slider__thumb:active {
21303
+ --pf-c-slider__thumb--BoxShadow: var(--pf-c-slider__thumb--active--BoxShadow);
21304
+ }
21305
+
21306
+ .pf-c-slider__value {
21307
+ margin-left: var(--pf-c-slider__value--MarginLeft);
21308
+ }
21309
+
21310
+ .pf-c-slider__value.pf-m-floating {
21311
+ --pf-c-slider__value--MarginLeft: 0;
21312
+ position: absolute;
21313
+ top: 0;
21314
+ left: var(--pf-c-slider__value--m-floating--Left);
21315
+ z-index: var(--pf-c-slider__value--m-floating--ZIndex);
21316
+ transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
21317
+ }
21318
+
21319
+ .pf-c-slider__value.pf-m-floating .pf-c-input-group {
21320
+ align-items: center;
21321
+ }
21322
+
21323
+ .pf-c-slider__value.pf-m-floating .pf-c-input-group__text {
21324
+ position: absolute;
21325
+ left: 100%;
21326
+ }
21327
+
21328
+ .pf-c-slider__value .pf-c-form-control {
21329
+ width: var(--pf-c-slider__value--c-form-control--Width);
21330
+ }
21331
+
21332
+ .pf-c-slider__actions {
21333
+ display: flex;
21334
+ margin-right: var(--pf-c-slider__actions--MarginRight);
21335
+ }
21336
+
21337
+ .pf-c-slider__main ~ .pf-c-slider__actions {
21338
+ --pf-c-slider__actions--MarginRight: 0;
21339
+ margin-left: var(--pf-c-slider__main--actions--MarginLeft);
21340
+ }
21341
+
21342
+ .pf-c-switch {
21343
+ --pf-c-switch--FontSize: var(--pf-global--FontSize--md);
21344
+ --pf-c-switch__label--PaddingLeft: var(--pf-global--spacer--md);
21345
+ --pf-c-switch--ColumnGap: var(--pf-c-switch__label--PaddingLeft);
21346
+ --pf-c-switch__toggle-icon--FontSize: calc(var(--pf-c-switch--FontSize) * .625);
21347
+ --pf-c-switch__toggle-icon--Color: var(--pf-global--Color--light-100);
21348
+ --pf-c-switch__toggle-icon--Left: calc(var(--pf-c-switch--FontSize) * .4);
21349
+ --pf-c-switch__toggle-icon--Offset: 0.125rem;
21350
+ --pf-c-switch--LineHeight: var(--pf-global--LineHeight--md);
21351
+ --pf-c-switch--Height: auto;
21352
+ --pf-c-switch__input--checked__toggle--BackgroundColor: var(--pf-global--primary-color--100);
21353
+ --pf-c-switch__input--checked__toggle--before--TranslateX: calc(100% + var(--pf-c-switch__toggle-icon--Offset));
21354
+ --pf-c-switch__input--checked__label--Color: var(--pf-global--Color--dark-100);
21355
+ --pf-c-switch__input--not-checked__label--Color: var(--pf-global--disabled-color--100);
21356
+ --pf-c-switch__input--disabled__label--Color: var(--pf-global--disabled-color--100);
21357
+ --pf-c-switch__input--disabled__toggle--BackgroundColor: var(--pf-global--Color--dark-200);
21358
+ --pf-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-global--disabled-color--200);
21359
+ --pf-c-switch__input--focus__toggle--OutlineWidth: var(--pf-global--BorderWidth--md);
21360
+ --pf-c-switch__input--focus__toggle--OutlineOffset: var(--pf-global--spacer--sm);
21361
+ --pf-c-switch__input--focus__toggle--OutlineColor: var(--pf-global--primary-color--100);
21362
+ --pf-c-switch__toggle--Height: calc(var(--pf-c-switch--FontSize) * var(--pf-c-switch--LineHeight));
21363
+ --pf-c-switch__toggle--BackgroundColor: var(--pf-global--disabled-color--200);
21364
+ --pf-c-switch__toggle--BorderRadius: var(--pf-c-switch__toggle--Height);
21365
+ --pf-c-switch__toggle--before--Width: calc(var(--pf-c-switch--FontSize) - var(--pf-c-switch__toggle-icon--Offset));
21366
+ --pf-c-switch__toggle--before--Height: var(--pf-c-switch__toggle--before--Width);
21367
+ --pf-c-switch__toggle--before--Top: calc((var(--pf-c-switch__toggle--Height) - var(--pf-c-switch__toggle--before--Height)) / 2);
21368
+ --pf-c-switch__toggle--before--Left: var(--pf-c-switch__toggle--before--Top);
21369
+ --pf-c-switch__toggle--before--BackgroundColor: var(--pf-global--BackgroundColor--100);
21370
+ --pf-c-switch__toggle--before--BorderRadius: var(--pf-global--BorderRadius--lg);
21371
+ --pf-c-switch__toggle--before--BoxShadow: var(--pf-global--BoxShadow--md);
21372
+ --pf-c-switch__toggle--before--Transition: transform .25s ease 0s;
21373
+ --pf-c-switch__toggle--Width: calc(var(--pf-c-switch__toggle--Height) + var(--pf-c-switch__toggle-icon--Offset) + var(--pf-c-switch__toggle--before--Width));
21374
+ --pf-c-switch__label--Color: var(--pf-global--Color--dark-100);
21375
+ position: relative;
21376
+ display: inline-grid;
21377
+ grid-template-columns: auto;
21378
+ grid-auto-columns: 1fr;
21379
+ column-gap: var(--pf-c-switch--ColumnGap);
21380
+ height: var(--pf-c-switch--Height);
21381
+ font-size: var(--pf-c-switch--FontSize);
21382
+ line-height: var(--pf-c-switch--LineHeight);
21383
+ vertical-align: middle;
21384
+ cursor: pointer;
21680
21385
  }
21681
21386
 
21682
- .pf-c-content small {
21683
- display: block;
21684
- font-size: var(--pf-c-content--small--FontSize);
21685
- line-height: var(--pf-c-content--small--LineHeight);
21686
- color: var(--pf-c-content--small--Color);
21387
+ .pf-c-switch.pf-m-reverse .pf-c-switch__label,
21388
+ .pf-c-switch.pf-m-reverse .pf-c-switch__toggle {
21389
+ grid-row: 1;
21687
21390
  }
21688
21391
 
21689
- .pf-c-content small:not(:last-child) {
21690
- margin-bottom: var(--pf-c-content--small--MarginBottom);
21392
+ .pf-c-switch.pf-m-reverse .pf-c-switch__label {
21393
+ grid-column: 1;
21691
21394
  }
21692
21395
 
21693
- .pf-c-content blockquote {
21694
- padding: var(--pf-c-content--blockquote--PaddingTop) var(--pf-c-content--blockquote--PaddingRight) var(--pf-c-content--blockquote--PaddingBottom) var(--pf-c-content--blockquote--PaddingLeft);
21695
- color: var(--pf-c-content--blockquote--Color);
21696
- border-left: var(--pf-c-content--blockquote--BorderLeftWidth) solid var(--pf-c-content--blockquote--BorderLeftColor);
21396
+ .pf-c-switch__input {
21397
+ position: absolute;
21398
+ cursor: pointer;
21399
+ opacity: 0;
21697
21400
  }
21698
21401
 
21699
- .pf-c-content hr {
21700
- height: var(--pf-c-content--hr--Height);
21701
- background-color: var(--pf-c-content--hr--BackgroundColor);
21702
- border: none;
21402
+ .pf-c-switch__input:focus ~ .pf-c-switch__toggle {
21403
+ outline: var(--pf-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-c-switch__input--focus__toggle--OutlineColor);
21404
+ outline-offset: var(--pf-c-switch__input--focus__toggle--OutlineOffset);
21703
21405
  }
21704
21406
 
21705
- .pf-c-content ol {
21706
- padding-left: var(--pf-c-content--ol--PaddingLeft);
21707
- margin-left: var(--pf-c-content--ol--MarginLeft);
21407
+ .pf-c-switch__input:checked ~ .pf-c-switch__label {
21408
+ color: var(--pf-c-switch__input--checked__label--Color);
21708
21409
  }
21709
21410
 
21710
- .pf-c-content ol ul {
21711
- margin-top: var(--pf-c-content--ul--nested--MarginTop);
21712
- --pf-c-content--ul--MarginLeft: var(--pf-c-content--ul--nested--MarginLeft);
21411
+ .pf-c-switch__input:checked ~ .pf-c-switch__toggle {
21412
+ background-color: var(--pf-c-switch__input--checked__toggle--BackgroundColor);
21713
21413
  }
21714
21414
 
21715
- .pf-c-content ol ol {
21716
- margin-top: var(--pf-c-content--ol--nested--MarginTop);
21717
- --pf-c-content--ol--MarginLeft: var(--pf-c-content--ol--nested--MarginLeft);
21415
+ .pf-c-switch__input:checked ~ .pf-c-switch__toggle::before {
21416
+ transform: translateX(var(--pf-c-switch__input--checked__toggle--before--TranslateX));
21718
21417
  }
21719
21418
 
21720
- .pf-c-content ul {
21721
- padding-left: var(--pf-c-content--ul--PaddingLeft);
21722
- margin-left: var(--pf-c-content--ul--MarginLeft);
21723
- list-style: var(--pf-c-content--ul--ListStyle);
21419
+ .pf-c-switch__input:checked ~ .pf-m-off {
21420
+ display: none;
21724
21421
  }
21725
21422
 
21726
- .pf-c-content ul ul {
21727
- margin-top: var(--pf-c-content--ul--nested--MarginTop);
21728
- --pf-c-content--ul--MarginLeft: var(--pf-c-content--ul--nested--MarginLeft);
21423
+ .pf-c-switch__input:not(:checked) ~ .pf-c-switch__label {
21424
+ color: var(--pf-c-switch__input--not-checked__label--Color);
21729
21425
  }
21730
21426
 
21731
- .pf-c-content ul ol {
21732
- margin-top: var(--pf-c-content--ol--nested--MarginTop);
21733
- --pf-c-content--ol--MarginLeft: var(--pf-c-content--ol--nested--MarginLeft);
21427
+ .pf-c-switch__input:not(:checked) ~ .pf-c-switch__toggle .pf-c-switch__toggle-icon {
21428
+ display: none;
21429
+ visibility: hidden;
21734
21430
  }
21735
21431
 
21736
- .pf-c-content dl {
21737
- display: grid;
21738
- grid-template-columns: 1fr;
21432
+ .pf-c-switch__input:not(:checked) ~ .pf-m-on {
21433
+ display: none;
21739
21434
  }
21740
21435
 
21741
- @media screen and (min-width: 576px) {
21742
- .pf-c-content dl {
21743
- grid-template: auto/auto 1fr;
21744
- grid-column-gap: var(--pf-c-content--dl--ColumnGap);
21745
- grid-row-gap: var(--pf-c-content--dl--RowGap);
21746
- }
21436
+ .pf-c-switch__input:disabled {
21437
+ cursor: not-allowed;
21747
21438
  }
21748
- .pf-c-content dt {
21749
- font-weight: var(--pf-c-content--dt--FontWeight);
21439
+
21440
+ .pf-c-switch__input:disabled ~ .pf-c-switch__label {
21441
+ color: var(--pf-c-switch__input--disabled__label--Color);
21442
+ cursor: not-allowed;
21750
21443
  }
21751
21444
 
21752
- .pf-c-content dt:not(:first-child) {
21753
- margin-top: var(--pf-c-content--dt--MarginTop);
21445
+ .pf-c-switch__input:disabled ~ .pf-c-switch__toggle {
21446
+ cursor: not-allowed;
21447
+ background-color: var(--pf-c-switch__input--disabled__toggle--BackgroundColor);
21754
21448
  }
21755
21449
 
21756
- @media screen and (min-width: 576px) {
21757
- .pf-c-content dt:not(:first-child) {
21758
- --pf-c-content--dt--MarginTop: var(--pf-c-content--dt--sm--MarginTop);
21759
- }
21450
+ .pf-c-switch__input:disabled ~ .pf-c-switch__toggle::before {
21451
+ background-color: var(--pf-c-switch__input--disabled__toggle--before--BackgroundColor);
21760
21452
  }
21761
- @media screen and (min-width: 576px) {
21762
- .pf-c-content dt {
21763
- grid-column: 1;
21764
- }
21453
+
21454
+ .pf-c-switch__toggle {
21455
+ position: relative;
21456
+ display: inline-block;
21457
+ width: var(--pf-c-switch__toggle--Width);
21458
+ height: var(--pf-c-switch__toggle--Height);
21459
+ background-color: var(--pf-c-switch__toggle--BackgroundColor);
21460
+ border-radius: var(--pf-c-switch__toggle--BorderRadius);
21765
21461
  }
21766
- @media screen and (min-width: 576px) {
21767
- .pf-c-content dd {
21768
- grid-column: 2;
21769
- }
21462
+
21463
+ .pf-c-switch__toggle::before {
21464
+ position: absolute;
21465
+ top: var(--pf-c-switch__toggle--before--Top);
21466
+ left: var(--pf-c-switch__toggle--before--Left);
21467
+ display: block;
21468
+ width: var(--pf-c-switch__toggle--before--Width);
21469
+ height: var(--pf-c-switch__toggle--before--Height);
21470
+ content: "";
21471
+ background-color: var(--pf-c-switch__toggle--before--BackgroundColor);
21472
+ border-radius: var(--pf-c-switch__toggle--before--BorderRadius);
21473
+ box-shadow: var(--pf-c-switch__toggle--before--BoxShadow);
21474
+ transition: var(--pf-c-switch__toggle--before--Transition);
21770
21475
  }
21771
- .pf-m-overpass-font .pf-c-content {
21772
- --pf-c-content--h2--LineHeight: var(--pf-global--LineHeight--sm);
21773
- --pf-c-content--h4--FontWeight: var(--pf-global--FontWeight--semi-bold);
21774
- --pf-c-content--h5--FontWeight: var(--pf-global--FontWeight--semi-bold);
21775
- --pf-c-content--h6--FontWeight: var(--pf-global--FontWeight--semi-bold);
21476
+
21477
+ .pf-c-switch__toggle-icon {
21478
+ position: absolute;
21479
+ top: 0;
21480
+ bottom: 0;
21481
+ left: var(--pf-c-switch__toggle-icon--Left);
21482
+ display: flex;
21483
+ align-items: center;
21484
+ font-size: var(--pf-c-switch__toggle-icon--FontSize);
21485
+ color: var(--pf-c-switch__toggle-icon--Color);
21776
21486
  }
21777
21487
 
21778
- .pf-m-overpass-font .pf-c-content blockquote {
21779
- font-weight: var(--pf-global--FontWeight--light);
21488
+ .pf-c-switch__label {
21489
+ display: inline-block;
21490
+ grid-column: 2;
21491
+ color: var(--pf-c-switch__label--Color);
21492
+ vertical-align: top;
21780
21493
  }
21781
21494
 
21782
21495
  .pf-c-tabs {
@@ -22405,252 +22118,539 @@ label.pf-c-radio, .pf-c-radio__label,
22405
22118
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22406
22119
  }
22407
22120
 
22408
- .pf-c-tabs.pf-m-inset-md {
22409
- --pf-c-tabs--inset: var(--pf-global--spacer--md);
22410
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22411
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22412
- }
22121
+ .pf-c-tabs.pf-m-inset-md {
22122
+ --pf-c-tabs--inset: var(--pf-global--spacer--md);
22123
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22124
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22125
+ }
22126
+
22127
+ .pf-c-tabs.pf-m-inset-lg {
22128
+ --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22129
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22130
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22131
+ }
22132
+
22133
+ .pf-c-tabs.pf-m-inset-xl {
22134
+ --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22135
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22136
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22137
+ }
22138
+
22139
+ .pf-c-tabs.pf-m-inset-2xl {
22140
+ --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22141
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22142
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22143
+ }
22144
+
22145
+ @media (min-width: 576px) {
22146
+ .pf-c-tabs.pf-m-inset-none-on-sm {
22147
+ --pf-c-tabs--inset: 0;
22148
+ --pf-c-tabs--m-vertical--inset: 0;
22149
+ --pf-c-tabs--m-vertical--m-box--inset: 0;
22150
+ }
22151
+
22152
+ .pf-c-tabs.pf-m-inset-sm-on-sm {
22153
+ --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22154
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22155
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22156
+ }
22157
+
22158
+ .pf-c-tabs.pf-m-inset-md-on-sm {
22159
+ --pf-c-tabs--inset: var(--pf-global--spacer--md);
22160
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22161
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22162
+ }
22163
+
22164
+ .pf-c-tabs.pf-m-inset-lg-on-sm {
22165
+ --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22166
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22167
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22168
+ }
22169
+
22170
+ .pf-c-tabs.pf-m-inset-xl-on-sm {
22171
+ --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22172
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22173
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22174
+ }
22175
+
22176
+ .pf-c-tabs.pf-m-inset-2xl-on-sm {
22177
+ --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22178
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22179
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22180
+ }
22181
+ }
22182
+ @media (min-width: 768px) {
22183
+ .pf-c-tabs.pf-m-inset-none-on-md {
22184
+ --pf-c-tabs--inset: 0;
22185
+ --pf-c-tabs--m-vertical--inset: 0;
22186
+ --pf-c-tabs--m-vertical--m-box--inset: 0;
22187
+ }
22188
+
22189
+ .pf-c-tabs.pf-m-inset-sm-on-md {
22190
+ --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22191
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22192
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22193
+ }
22194
+
22195
+ .pf-c-tabs.pf-m-inset-md-on-md {
22196
+ --pf-c-tabs--inset: var(--pf-global--spacer--md);
22197
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22198
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22199
+ }
22200
+
22201
+ .pf-c-tabs.pf-m-inset-lg-on-md {
22202
+ --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22203
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22204
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22205
+ }
22206
+
22207
+ .pf-c-tabs.pf-m-inset-xl-on-md {
22208
+ --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22209
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22210
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22211
+ }
22212
+
22213
+ .pf-c-tabs.pf-m-inset-2xl-on-md {
22214
+ --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22215
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22216
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22217
+ }
22218
+ }
22219
+ @media (min-width: 992px) {
22220
+ .pf-c-tabs.pf-m-inset-none-on-lg {
22221
+ --pf-c-tabs--inset: 0;
22222
+ --pf-c-tabs--m-vertical--inset: 0;
22223
+ --pf-c-tabs--m-vertical--m-box--inset: 0;
22224
+ }
22225
+
22226
+ .pf-c-tabs.pf-m-inset-sm-on-lg {
22227
+ --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22228
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22229
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22230
+ }
22231
+
22232
+ .pf-c-tabs.pf-m-inset-md-on-lg {
22233
+ --pf-c-tabs--inset: var(--pf-global--spacer--md);
22234
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22235
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22236
+ }
22413
22237
 
22414
- .pf-c-tabs.pf-m-inset-lg {
22415
- --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22416
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22417
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22418
- }
22238
+ .pf-c-tabs.pf-m-inset-lg-on-lg {
22239
+ --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22240
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22241
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22242
+ }
22419
22243
 
22420
- .pf-c-tabs.pf-m-inset-xl {
22421
- --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22422
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22423
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22424
- }
22244
+ .pf-c-tabs.pf-m-inset-xl-on-lg {
22245
+ --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22246
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22247
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22248
+ }
22425
22249
 
22426
- .pf-c-tabs.pf-m-inset-2xl {
22427
- --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22428
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22429
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22250
+ .pf-c-tabs.pf-m-inset-2xl-on-lg {
22251
+ --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22252
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22253
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22254
+ }
22430
22255
  }
22431
-
22432
- @media (min-width: 576px) {
22433
- .pf-c-tabs.pf-m-inset-none-on-sm {
22256
+ @media (min-width: 1200px) {
22257
+ .pf-c-tabs.pf-m-inset-none-on-xl {
22434
22258
  --pf-c-tabs--inset: 0;
22435
22259
  --pf-c-tabs--m-vertical--inset: 0;
22436
22260
  --pf-c-tabs--m-vertical--m-box--inset: 0;
22437
22261
  }
22438
22262
 
22439
- .pf-c-tabs.pf-m-inset-sm-on-sm {
22263
+ .pf-c-tabs.pf-m-inset-sm-on-xl {
22440
22264
  --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22441
22265
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22442
22266
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22443
22267
  }
22444
22268
 
22445
- .pf-c-tabs.pf-m-inset-md-on-sm {
22269
+ .pf-c-tabs.pf-m-inset-md-on-xl {
22446
22270
  --pf-c-tabs--inset: var(--pf-global--spacer--md);
22447
22271
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22448
22272
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22449
22273
  }
22450
22274
 
22451
- .pf-c-tabs.pf-m-inset-lg-on-sm {
22275
+ .pf-c-tabs.pf-m-inset-lg-on-xl {
22452
22276
  --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22453
22277
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22454
22278
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22455
22279
  }
22456
22280
 
22457
- .pf-c-tabs.pf-m-inset-xl-on-sm {
22281
+ .pf-c-tabs.pf-m-inset-xl-on-xl {
22458
22282
  --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22459
22283
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22460
22284
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22461
22285
  }
22462
22286
 
22463
- .pf-c-tabs.pf-m-inset-2xl-on-sm {
22287
+ .pf-c-tabs.pf-m-inset-2xl-on-xl {
22464
22288
  --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22465
22289
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22466
22290
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22467
22291
  }
22468
22292
  }
22469
- @media (min-width: 768px) {
22470
- .pf-c-tabs.pf-m-inset-none-on-md {
22293
+ @media (min-width: 1450px) {
22294
+ .pf-c-tabs.pf-m-inset-none-on-2xl {
22471
22295
  --pf-c-tabs--inset: 0;
22472
22296
  --pf-c-tabs--m-vertical--inset: 0;
22473
22297
  --pf-c-tabs--m-vertical--m-box--inset: 0;
22474
22298
  }
22475
22299
 
22476
- .pf-c-tabs.pf-m-inset-sm-on-md {
22300
+ .pf-c-tabs.pf-m-inset-sm-on-2xl {
22477
22301
  --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22478
22302
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22479
22303
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22480
22304
  }
22481
22305
 
22482
- .pf-c-tabs.pf-m-inset-md-on-md {
22306
+ .pf-c-tabs.pf-m-inset-md-on-2xl {
22483
22307
  --pf-c-tabs--inset: var(--pf-global--spacer--md);
22484
22308
  --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22485
22309
  --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22486
22310
  }
22487
22311
 
22488
- .pf-c-tabs.pf-m-inset-lg-on-md {
22489
- --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22490
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22491
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22492
- }
22312
+ .pf-c-tabs.pf-m-inset-lg-on-2xl {
22313
+ --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22314
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22315
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22316
+ }
22317
+
22318
+ .pf-c-tabs.pf-m-inset-xl-on-2xl {
22319
+ --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22320
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22321
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22322
+ }
22323
+
22324
+ .pf-c-tabs.pf-m-inset-2xl-on-2xl {
22325
+ --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22326
+ --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22327
+ --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22328
+ }
22329
+ }
22330
+ .pf-c-tab-content {
22331
+ --pf-c-tab-content__body--PaddingTop: 0;
22332
+ --pf-c-tab-content__body--PaddingRight: 0;
22333
+ --pf-c-tab-content__body--PaddingBottom: 0;
22334
+ --pf-c-tab-content__body--PaddingLeft: 0;
22335
+ --pf-c-tab-content__body--m-padding--PaddingTop: var(--pf-global--spacer--md);
22336
+ --pf-c-tab-content__body--m-padding--PaddingRight: var(--pf-global--spacer--md);
22337
+ --pf-c-tab-content__body--m-padding--PaddingBottom: var(--pf-global--spacer--md);
22338
+ --pf-c-tab-content__body--m-padding--PaddingLeft: var(--pf-global--spacer--md);
22339
+ --pf-c-tab-content__body--m-padding--xl--PaddingTop: var(--pf-global--spacer--lg);
22340
+ --pf-c-tab-content__body--m-padding--xl--PaddingRight: var(--pf-global--spacer--lg);
22341
+ --pf-c-tab-content__body--m-padding--xl--PaddingBottom: var(--pf-global--spacer--lg);
22342
+ --pf-c-tab-content__body--m-padding--xl--PaddingLeft: var(--pf-global--spacer--lg);
22343
+ --pf-c-tab-content--m-light-300: var(--pf-global--BackgroundColor--light-300);
22344
+ }
22345
+
22346
+ @media screen and (min-width: 1200px) {
22347
+ .pf-c-tab-content {
22348
+ --pf-c-tab-content__body--m-padding--PaddingTop: var(--pf-c-tab-content__body--m-padding--xl--PaddingTop);
22349
+ --pf-c-tab-content__body--m-padding--PaddingRight: var(--pf-c-tab-content__body--m-padding--xl--PaddingRight);
22350
+ --pf-c-tab-content__body--m-padding--PaddingBottom: var(--pf-c-tab-content__body--m-padding--xl--PaddingBottom);
22351
+ --pf-c-tab-content__body--m-padding--PaddingLeft: var(--pf-c-tab-content__body--m-padding--xl--PaddingLeft);
22352
+ }
22353
+ }
22354
+ .pf-c-tab-content.pf-m-light-300 {
22355
+ background-color: var(--pf-c-tab-content--m-light-300);
22356
+ }
22357
+
22358
+ .pf-c-tab-content__body {
22359
+ padding: var(--pf-c-tab-content__body--PaddingTop) var(--pf-c-tab-content__body--PaddingRight) var(--pf-c-tab-content__body--PaddingBottom) var(--pf-c-tab-content__body--PaddingLeft);
22360
+ }
22361
+
22362
+ .pf-c-tab-content__body.pf-m-padding {
22363
+ --pf-c-tab-content__body--PaddingTop: var(--pf-c-tab-content__body--m-padding--PaddingTop);
22364
+ --pf-c-tab-content__body--PaddingRight: var(--pf-c-tab-content__body--m-padding--PaddingRight);
22365
+ --pf-c-tab-content__body--PaddingBottom: var(--pf-c-tab-content__body--m-padding--PaddingBottom);
22366
+ --pf-c-tab-content__body--PaddingLeft: var(--pf-c-tab-content__body--m-padding--PaddingLeft);
22367
+ }
22368
+
22369
+ .pf-c-content {
22370
+ --pf-c-content--MarginBottom: var(--pf-global--spacer--md);
22371
+ --pf-c-content--LineHeight: var(--pf-global--LineHeight--md);
22372
+ --pf-c-content--FontSize: var(--pf-global--FontSize--md);
22373
+ --pf-c-content--FontWeight: var(--pf-global--FontWeight--normal);
22374
+ --pf-c-content--Color: var(--pf-global--Color--100);
22375
+ --pf-c-content--heading--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
22376
+ --pf-c-content--h1--MarginTop: var(--pf-global--spacer--lg);
22377
+ --pf-c-content--h1--MarginBottom: var(--pf-global--spacer--sm);
22378
+ --pf-c-content--h1--LineHeight: var(--pf-global--LineHeight--sm);
22379
+ --pf-c-content--h1--FontSize: var(--pf-global--FontSize--2xl);
22380
+ --pf-c-content--h1--FontWeight: var(--pf-global--FontWeight--normal);
22381
+ --pf-c-content--h2--MarginTop: var(--pf-global--spacer--lg);
22382
+ --pf-c-content--h2--MarginBottom: var(--pf-global--spacer--sm);
22383
+ --pf-c-content--h2--LineHeight: var(--pf-global--LineHeight--md);
22384
+ --pf-c-content--h2--FontSize: var(--pf-global--FontSize--xl);
22385
+ --pf-c-content--h2--FontWeight: var(--pf-global--FontWeight--normal);
22386
+ --pf-c-content--h3--MarginTop: var(--pf-global--spacer--lg);
22387
+ --pf-c-content--h3--MarginBottom: var(--pf-global--spacer--sm);
22388
+ --pf-c-content--h3--LineHeight: var(--pf-global--LineHeight--md);
22389
+ --pf-c-content--h3--FontSize: var(--pf-global--FontSize--lg);
22390
+ --pf-c-content--h3--FontWeight: var(--pf-global--FontWeight--normal);
22391
+ --pf-c-content--h4--MarginTop: var(--pf-global--spacer--lg);
22392
+ --pf-c-content--h4--MarginBottom: var(--pf-global--spacer--sm);
22393
+ --pf-c-content--h4--LineHeight: var(--pf-global--LineHeight--md);
22394
+ --pf-c-content--h4--FontSize: var(--pf-global--FontSize--md);
22395
+ --pf-c-content--h4--FontWeight: var(--pf-global--FontWeight--normal);
22396
+ --pf-c-content--h5--MarginTop: var(--pf-global--spacer--lg);
22397
+ --pf-c-content--h5--MarginBottom: var(--pf-global--spacer--sm);
22398
+ --pf-c-content--h5--LineHeight: var(--pf-global--LineHeight--md);
22399
+ --pf-c-content--h5--FontSize: var(--pf-global--FontSize--md);
22400
+ --pf-c-content--h5--FontWeight: var(--pf-global--FontWeight--normal);
22401
+ --pf-c-content--h6--MarginTop: var(--pf-global--spacer--lg);
22402
+ --pf-c-content--h6--MarginBottom: var(--pf-global--spacer--sm);
22403
+ --pf-c-content--h6--LineHeight: var(--pf-global--LineHeight--md);
22404
+ --pf-c-content--h6--FontSize: var(--pf-global--FontSize--md);
22405
+ --pf-c-content--h6--FontWeight: var(--pf-global--FontWeight--normal);
22406
+ --pf-c-content--small--MarginBottom: var(--pf-global--spacer--md);
22407
+ --pf-c-content--small--LineHeight: var(--pf-global--LineHeight--md);
22408
+ --pf-c-content--small--FontSize: var(--pf-global--FontSize--sm);
22409
+ --pf-c-content--small--Color: var(--pf-global--Color--200);
22410
+ --pf-c-content--a--Color: var(--pf-global--link--Color);
22411
+ --pf-c-content--a--TextDecoration: var(--pf-global--link--TextDecoration);
22412
+ --pf-c-content--a--hover--Color: var(--pf-global--link--Color--hover);
22413
+ --pf-c-content--a--hover--TextDecoration: var(--pf-global--link--TextDecoration--hover);
22414
+ --pf-c-content--a--visited--Color: var(--pf-global--link--Color--visited);
22415
+ --pf-c-content--blockquote--PaddingTop: var(--pf-global--spacer--md);
22416
+ --pf-c-content--blockquote--PaddingRight: var(--pf-global--spacer--md);
22417
+ --pf-c-content--blockquote--PaddingBottom: var(--pf-global--spacer--md);
22418
+ --pf-c-content--blockquote--PaddingLeft: var(--pf-global--spacer--md);
22419
+ --pf-c-content--blockquote--Color: var(--pf-global--Color--200);
22420
+ --pf-c-content--blockquote--BorderLeftColor: var(--pf-global--BorderColor--100);
22421
+ --pf-c-content--blockquote--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
22422
+ --pf-c-content--ol--PaddingLeft: var(--pf-global--spacer--lg);
22423
+ --pf-c-content--ol--MarginLeft: var(--pf-global--spacer--lg);
22424
+ --pf-c-content--ol--nested--MarginTop: var(--pf-global--spacer--sm);
22425
+ --pf-c-content--ol--nested--MarginLeft: var(--pf-global--spacer--sm);
22426
+ --pf-c-content--ul--PaddingLeft: var(--pf-global--spacer--lg);
22427
+ --pf-c-content--ul--MarginLeft: var(--pf-global--spacer--lg);
22428
+ --pf-c-content--ul--nested--MarginTop: var(--pf-global--spacer--sm);
22429
+ --pf-c-content--ul--nested--MarginLeft: var(--pf-global--spacer--sm);
22430
+ --pf-c-content--ul--ListStyle: var(--pf-global--ListStyle);
22431
+ --pf-c-content--li--MarginTop: var(--pf-global--spacer--sm);
22432
+ --pf-c-content--dl--ColumnGap: var(--pf-global--spacer--2xl);
22433
+ --pf-c-content--dl--RowGap: var(--pf-global--spacer--md);
22434
+ --pf-c-content--dt--FontWeight: var(--pf-global--FontWeight--semi-bold);
22435
+ --pf-c-content--dt--MarginTop: var(--pf-global--spacer--md);
22436
+ --pf-c-content--dt--sm--MarginTop: 0;
22437
+ --pf-c-content--hr--Height: var(--pf-global--BorderWidth--sm);
22438
+ --pf-c-content--hr--BackgroundColor: var(--pf-global--BorderColor--100);
22439
+ font-size: var(--pf-c-content--FontSize);
22440
+ line-height: var(--pf-c-content--LineHeight);
22441
+ color: var(--pf-c-content--Color);
22442
+ }
22443
+
22444
+ .pf-c-content a {
22445
+ color: var(--pf-c-content--a--Color);
22446
+ text-decoration: var(--pf-c-content--a--TextDecoration);
22447
+ }
22448
+
22449
+ .pf-c-content a:hover {
22450
+ --pf-c-content--a--Color: var(--pf-c-content--a--hover--Color);
22451
+ --pf-c-content--a--TextDecoration: var(--pf-c-content--a--hover--TextDecoration);
22452
+ }
22453
+
22454
+ .pf-c-content.pf-m-visited a:visited,
22455
+ .pf-c-content a.pf-m-visited:visited {
22456
+ color: var(--pf-c-content--a--visited--Color);
22457
+ }
22458
+
22459
+ .pf-c-content li + li {
22460
+ margin-top: var(--pf-c-content--li--MarginTop);
22461
+ }
22462
+
22463
+ .pf-c-content p:not(:last-child),
22464
+ .pf-c-content dl:not(:last-child),
22465
+ .pf-c-content ol:not(:last-child),
22466
+ .pf-c-content ul:not(:last-child),
22467
+ .pf-c-content blockquote:not(:last-child),
22468
+ .pf-c-content small:not(:last-child),
22469
+ .pf-c-content pre:not(:last-child),
22470
+ .pf-c-content table:not(:last-child),
22471
+ .pf-c-content hr:not(:last-child) {
22472
+ margin-bottom: var(--pf-c-content--MarginBottom);
22473
+ }
22474
+
22475
+ .pf-c-content h1,
22476
+ .pf-c-content h2,
22477
+ .pf-c-content h3,
22478
+ .pf-c-content h4,
22479
+ .pf-c-content h5,
22480
+ .pf-c-content h6 {
22481
+ margin: 0;
22482
+ font-family: var(--pf-c-content--heading--FontFamily);
22483
+ }
22484
+
22485
+ .pf-c-content h1:first-child,
22486
+ .pf-c-content h2:first-child,
22487
+ .pf-c-content h3:first-child,
22488
+ .pf-c-content h4:first-child,
22489
+ .pf-c-content h5:first-child,
22490
+ .pf-c-content h6:first-child {
22491
+ margin-top: 0;
22492
+ }
22493
+
22494
+ .pf-c-content h1:last-child,
22495
+ .pf-c-content h2:last-child,
22496
+ .pf-c-content h3:last-child,
22497
+ .pf-c-content h4:last-child,
22498
+ .pf-c-content h5:last-child,
22499
+ .pf-c-content h6:last-child {
22500
+ margin-bottom: 0;
22501
+ }
22502
+
22503
+ .pf-c-content ol,
22504
+ .pf-c-content ul {
22505
+ margin: 0;
22506
+ }
22507
+
22508
+ .pf-c-content h1 {
22509
+ margin-top: var(--pf-c-content--h1--MarginTop);
22510
+ margin-bottom: var(--pf-c-content--h1--MarginBottom);
22511
+ font-size: var(--pf-c-content--h1--FontSize);
22512
+ font-weight: var(--pf-c-content--h1--FontWeight);
22513
+ line-height: var(--pf-c-content--h1--LineHeight);
22514
+ }
22493
22515
 
22494
- .pf-c-tabs.pf-m-inset-xl-on-md {
22495
- --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22496
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22497
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22498
- }
22516
+ .pf-c-content h2 {
22517
+ margin-top: var(--pf-c-content--h2--MarginTop);
22518
+ margin-bottom: var(--pf-c-content--h2--MarginBottom);
22519
+ font-size: var(--pf-c-content--h2--FontSize);
22520
+ font-weight: var(--pf-c-content--h2--FontWeight);
22521
+ line-height: var(--pf-c-content--h2--LineHeight);
22522
+ }
22499
22523
 
22500
- .pf-c-tabs.pf-m-inset-2xl-on-md {
22501
- --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22502
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22503
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22504
- }
22524
+ .pf-c-content h3 {
22525
+ margin-top: var(--pf-c-content--h3--MarginTop);
22526
+ margin-bottom: var(--pf-c-content--h3--MarginBottom);
22527
+ font-size: var(--pf-c-content--h3--FontSize);
22528
+ font-weight: var(--pf-c-content--h3--FontWeight);
22529
+ line-height: var(--pf-c-content--h3--LineHeight);
22505
22530
  }
22506
- @media (min-width: 992px) {
22507
- .pf-c-tabs.pf-m-inset-none-on-lg {
22508
- --pf-c-tabs--inset: 0;
22509
- --pf-c-tabs--m-vertical--inset: 0;
22510
- --pf-c-tabs--m-vertical--m-box--inset: 0;
22511
- }
22512
22531
 
22513
- .pf-c-tabs.pf-m-inset-sm-on-lg {
22514
- --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22515
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22516
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22517
- }
22532
+ .pf-c-content h4 {
22533
+ margin-top: var(--pf-c-content--h4--MarginTop);
22534
+ margin-bottom: var(--pf-c-content--h4--MarginBottom);
22535
+ font-size: var(--pf-c-content--h4--FontSize);
22536
+ font-weight: var(--pf-c-content--h4--FontWeight);
22537
+ line-height: var(--pf-c-content--h4--LineHeight);
22538
+ }
22518
22539
 
22519
- .pf-c-tabs.pf-m-inset-md-on-lg {
22520
- --pf-c-tabs--inset: var(--pf-global--spacer--md);
22521
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22522
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22523
- }
22540
+ .pf-c-content h5 {
22541
+ margin-top: var(--pf-c-content--h5--MarginTop);
22542
+ margin-bottom: var(--pf-c-content--h5--MarginBottom);
22543
+ font-size: var(--pf-c-content--h5--FontSize);
22544
+ font-weight: var(--pf-c-content--h5--FontWeight);
22545
+ line-height: var(--pf-c-content--h5--LineHeight);
22546
+ }
22524
22547
 
22525
- .pf-c-tabs.pf-m-inset-lg-on-lg {
22526
- --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22527
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22528
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22529
- }
22548
+ .pf-c-content h6 {
22549
+ margin-top: var(--pf-c-content--h6--MarginTop);
22550
+ margin-bottom: var(--pf-c-content--h6--MarginBottom);
22551
+ font-size: var(--pf-c-content--h6--FontSize);
22552
+ font-weight: var(--pf-c-content--h6--FontWeight);
22553
+ line-height: var(--pf-c-content--h6--LineHeight);
22554
+ }
22530
22555
 
22531
- .pf-c-tabs.pf-m-inset-xl-on-lg {
22532
- --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22533
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22534
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22535
- }
22556
+ .pf-c-content small {
22557
+ display: block;
22558
+ font-size: var(--pf-c-content--small--FontSize);
22559
+ line-height: var(--pf-c-content--small--LineHeight);
22560
+ color: var(--pf-c-content--small--Color);
22561
+ }
22536
22562
 
22537
- .pf-c-tabs.pf-m-inset-2xl-on-lg {
22538
- --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22539
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22540
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22541
- }
22563
+ .pf-c-content small:not(:last-child) {
22564
+ margin-bottom: var(--pf-c-content--small--MarginBottom);
22542
22565
  }
22543
- @media (min-width: 1200px) {
22544
- .pf-c-tabs.pf-m-inset-none-on-xl {
22545
- --pf-c-tabs--inset: 0;
22546
- --pf-c-tabs--m-vertical--inset: 0;
22547
- --pf-c-tabs--m-vertical--m-box--inset: 0;
22548
- }
22549
22566
 
22550
- .pf-c-tabs.pf-m-inset-sm-on-xl {
22551
- --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22552
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22553
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22554
- }
22567
+ .pf-c-content blockquote {
22568
+ padding: var(--pf-c-content--blockquote--PaddingTop) var(--pf-c-content--blockquote--PaddingRight) var(--pf-c-content--blockquote--PaddingBottom) var(--pf-c-content--blockquote--PaddingLeft);
22569
+ color: var(--pf-c-content--blockquote--Color);
22570
+ border-left: var(--pf-c-content--blockquote--BorderLeftWidth) solid var(--pf-c-content--blockquote--BorderLeftColor);
22571
+ }
22555
22572
 
22556
- .pf-c-tabs.pf-m-inset-md-on-xl {
22557
- --pf-c-tabs--inset: var(--pf-global--spacer--md);
22558
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22559
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22560
- }
22573
+ .pf-c-content hr {
22574
+ height: var(--pf-c-content--hr--Height);
22575
+ background-color: var(--pf-c-content--hr--BackgroundColor);
22576
+ border: none;
22577
+ }
22561
22578
 
22562
- .pf-c-tabs.pf-m-inset-lg-on-xl {
22563
- --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22564
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22565
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22566
- }
22579
+ .pf-c-content ol {
22580
+ padding-left: var(--pf-c-content--ol--PaddingLeft);
22581
+ margin-left: var(--pf-c-content--ol--MarginLeft);
22582
+ }
22567
22583
 
22568
- .pf-c-tabs.pf-m-inset-xl-on-xl {
22569
- --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22570
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22571
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22572
- }
22584
+ .pf-c-content ol ul {
22585
+ margin-top: var(--pf-c-content--ul--nested--MarginTop);
22586
+ --pf-c-content--ul--MarginLeft: var(--pf-c-content--ul--nested--MarginLeft);
22587
+ }
22573
22588
 
22574
- .pf-c-tabs.pf-m-inset-2xl-on-xl {
22575
- --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22576
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22577
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22578
- }
22589
+ .pf-c-content ol ol {
22590
+ margin-top: var(--pf-c-content--ol--nested--MarginTop);
22591
+ --pf-c-content--ol--MarginLeft: var(--pf-c-content--ol--nested--MarginLeft);
22579
22592
  }
22580
- @media (min-width: 1450px) {
22581
- .pf-c-tabs.pf-m-inset-none-on-2xl {
22582
- --pf-c-tabs--inset: 0;
22583
- --pf-c-tabs--m-vertical--inset: 0;
22584
- --pf-c-tabs--m-vertical--m-box--inset: 0;
22585
- }
22586
22593
 
22587
- .pf-c-tabs.pf-m-inset-sm-on-2xl {
22588
- --pf-c-tabs--inset: var(--pf-global--spacer--sm);
22589
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--sm);
22590
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--sm);
22591
- }
22594
+ .pf-c-content ul {
22595
+ padding-left: var(--pf-c-content--ul--PaddingLeft);
22596
+ margin-left: var(--pf-c-content--ul--MarginLeft);
22597
+ list-style: var(--pf-c-content--ul--ListStyle);
22598
+ }
22592
22599
 
22593
- .pf-c-tabs.pf-m-inset-md-on-2xl {
22594
- --pf-c-tabs--inset: var(--pf-global--spacer--md);
22595
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--md);
22596
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--md);
22597
- }
22600
+ .pf-c-content ul ul {
22601
+ margin-top: var(--pf-c-content--ul--nested--MarginTop);
22602
+ --pf-c-content--ul--MarginLeft: var(--pf-c-content--ul--nested--MarginLeft);
22603
+ }
22598
22604
 
22599
- .pf-c-tabs.pf-m-inset-lg-on-2xl {
22600
- --pf-c-tabs--inset: var(--pf-global--spacer--lg);
22601
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--lg);
22602
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);
22603
- }
22605
+ .pf-c-content ul ol {
22606
+ margin-top: var(--pf-c-content--ol--nested--MarginTop);
22607
+ --pf-c-content--ol--MarginLeft: var(--pf-c-content--ol--nested--MarginLeft);
22608
+ }
22604
22609
 
22605
- .pf-c-tabs.pf-m-inset-xl-on-2xl {
22606
- --pf-c-tabs--inset: var(--pf-global--spacer--xl);
22607
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--xl);
22608
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--xl);
22609
- }
22610
+ .pf-c-content dl {
22611
+ display: grid;
22612
+ grid-template-columns: 1fr;
22613
+ }
22610
22614
 
22611
- .pf-c-tabs.pf-m-inset-2xl-on-2xl {
22612
- --pf-c-tabs--inset: var(--pf-global--spacer--2xl);
22613
- --pf-c-tabs--m-vertical--inset: var(--pf-global--spacer--2xl);
22614
- --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--2xl);
22615
+ @media screen and (min-width: 576px) {
22616
+ .pf-c-content dl {
22617
+ grid-template: auto/auto 1fr;
22618
+ grid-column-gap: var(--pf-c-content--dl--ColumnGap);
22619
+ grid-row-gap: var(--pf-c-content--dl--RowGap);
22615
22620
  }
22616
22621
  }
22617
- .pf-c-tab-content {
22618
- --pf-c-tab-content__body--PaddingTop: 0;
22619
- --pf-c-tab-content__body--PaddingRight: 0;
22620
- --pf-c-tab-content__body--PaddingBottom: 0;
22621
- --pf-c-tab-content__body--PaddingLeft: 0;
22622
- --pf-c-tab-content__body--m-padding--PaddingTop: var(--pf-global--spacer--md);
22623
- --pf-c-tab-content__body--m-padding--PaddingRight: var(--pf-global--spacer--md);
22624
- --pf-c-tab-content__body--m-padding--PaddingBottom: var(--pf-global--spacer--md);
22625
- --pf-c-tab-content__body--m-padding--PaddingLeft: var(--pf-global--spacer--md);
22626
- --pf-c-tab-content__body--m-padding--xl--PaddingTop: var(--pf-global--spacer--lg);
22627
- --pf-c-tab-content__body--m-padding--xl--PaddingRight: var(--pf-global--spacer--lg);
22628
- --pf-c-tab-content__body--m-padding--xl--PaddingBottom: var(--pf-global--spacer--lg);
22629
- --pf-c-tab-content__body--m-padding--xl--PaddingLeft: var(--pf-global--spacer--lg);
22630
- --pf-c-tab-content--m-light-300: var(--pf-global--BackgroundColor--light-300);
22622
+ .pf-c-content dt {
22623
+ font-weight: var(--pf-c-content--dt--FontWeight);
22631
22624
  }
22632
22625
 
22633
- @media screen and (min-width: 1200px) {
22634
- .pf-c-tab-content {
22635
- --pf-c-tab-content__body--m-padding--PaddingTop: var(--pf-c-tab-content__body--m-padding--xl--PaddingTop);
22636
- --pf-c-tab-content__body--m-padding--PaddingRight: var(--pf-c-tab-content__body--m-padding--xl--PaddingRight);
22637
- --pf-c-tab-content__body--m-padding--PaddingBottom: var(--pf-c-tab-content__body--m-padding--xl--PaddingBottom);
22638
- --pf-c-tab-content__body--m-padding--PaddingLeft: var(--pf-c-tab-content__body--m-padding--xl--PaddingLeft);
22626
+ .pf-c-content dt:not(:first-child) {
22627
+ margin-top: var(--pf-c-content--dt--MarginTop);
22628
+ }
22629
+
22630
+ @media screen and (min-width: 576px) {
22631
+ .pf-c-content dt:not(:first-child) {
22632
+ --pf-c-content--dt--MarginTop: var(--pf-c-content--dt--sm--MarginTop);
22639
22633
  }
22640
22634
  }
22641
- .pf-c-tab-content.pf-m-light-300 {
22642
- background-color: var(--pf-c-tab-content--m-light-300);
22635
+ @media screen and (min-width: 576px) {
22636
+ .pf-c-content dt {
22637
+ grid-column: 1;
22638
+ }
22643
22639
  }
22644
-
22645
- .pf-c-tab-content__body {
22646
- padding: var(--pf-c-tab-content__body--PaddingTop) var(--pf-c-tab-content__body--PaddingRight) var(--pf-c-tab-content__body--PaddingBottom) var(--pf-c-tab-content__body--PaddingLeft);
22640
+ @media screen and (min-width: 576px) {
22641
+ .pf-c-content dd {
22642
+ grid-column: 2;
22643
+ }
22644
+ }
22645
+ .pf-m-overpass-font .pf-c-content {
22646
+ --pf-c-content--h2--LineHeight: var(--pf-global--LineHeight--sm);
22647
+ --pf-c-content--h4--FontWeight: var(--pf-global--FontWeight--semi-bold);
22648
+ --pf-c-content--h5--FontWeight: var(--pf-global--FontWeight--semi-bold);
22649
+ --pf-c-content--h6--FontWeight: var(--pf-global--FontWeight--semi-bold);
22647
22650
  }
22648
22651
 
22649
- .pf-c-tab-content__body.pf-m-padding {
22650
- --pf-c-tab-content__body--PaddingTop: var(--pf-c-tab-content__body--m-padding--PaddingTop);
22651
- --pf-c-tab-content__body--PaddingRight: var(--pf-c-tab-content__body--m-padding--PaddingRight);
22652
- --pf-c-tab-content__body--PaddingBottom: var(--pf-c-tab-content__body--m-padding--PaddingBottom);
22653
- --pf-c-tab-content__body--PaddingLeft: var(--pf-c-tab-content__body--m-padding--PaddingLeft);
22652
+ .pf-m-overpass-font .pf-c-content blockquote {
22653
+ font-weight: var(--pf-global--FontWeight--light);
22654
22654
  }
22655
22655
 
22656
22656
  .pf-c-tile {