@patternfly/patternfly 5.0.0-alpha.49 → 5.0.0-alpha.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/base/patternfly-variables.css +1 -1
  2. package/components/Breadcrumb/breadcrumb.css +1 -5
  3. package/components/Breadcrumb/breadcrumb.scss +1 -8
  4. package/components/Divider/divider.css +12 -12
  5. package/components/List/list.css +1 -1
  6. package/components/List/list.scss +1 -1
  7. package/components/LogViewer/log-viewer.css +0 -3
  8. package/components/LogViewer/log-viewer.scss +0 -4
  9. package/components/Masthead/masthead.css +12 -12
  10. package/components/MultipleFileUpload/multiple-file-upload.css +3 -3
  11. package/components/MultipleFileUpload/multiple-file-upload.scss +3 -3
  12. package/components/Pagination/pagination.css +12 -12
  13. package/components/Tabs/tabs.css +24 -24
  14. package/components/TextInputGroup/text-input-group.css +1 -5
  15. package/components/TextInputGroup/text-input-group.scss +1 -7
  16. package/components/Toolbar/toolbar.css +54 -54
  17. package/components/_all.scss +1 -2
  18. package/docs/components/AppLauncher/examples/application-launcher.md +8 -7
  19. package/docs/components/Chip/examples/Chip.md +713 -4
  20. package/docs/components/ContextSelector/examples/context-selector.md +12 -12
  21. package/docs/components/DualListSelector/examples/DualListSelector.md +32 -32
  22. package/docs/components/LogViewer/examples/LogViewer.md +40 -40
  23. package/docs/components/Menu/examples/Menu.md +20 -18
  24. package/docs/components/Select/examples/Select.md +16 -14
  25. package/docs/components/TextInputGroup/examples/TextInputGroup.css +0 -13
  26. package/docs/components/TextInputGroup/examples/TextInputGroup.md +21 -21
  27. package/docs/components/Toolbar/examples/Toolbar.md +10 -10
  28. package/docs/components/TreeView/examples/TreeView.md +8 -7
  29. package/docs/demos/AboutModal/examples/AboutModal.md +21 -21
  30. package/docs/demos/Alert/examples/Alert.md +63 -63
  31. package/docs/demos/BackToTop/examples/BackToTop.md +21 -21
  32. package/docs/demos/Banner/examples/Banner.md +42 -42
  33. package/docs/demos/CardView/examples/CardView.md +21 -21
  34. package/docs/demos/ContextSelector/examples/ContextSelector.md +95 -91
  35. package/docs/demos/Dashboard/examples/Dashboard.md +21 -21
  36. package/docs/demos/DataList/examples/DataList.md +104 -105
  37. package/docs/demos/DescriptionList/examples/DescriptionList.md +63 -63
  38. package/docs/demos/Drawer/examples/Drawer.md +105 -105
  39. package/docs/demos/JumpLinks/examples/JumpLinks.md +126 -126
  40. package/docs/demos/Masthead/examples/Masthead.md +56 -55
  41. package/docs/demos/Modal/examples/Modal.md +126 -126
  42. package/docs/demos/Nav/examples/Nav.md +168 -168
  43. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +105 -105
  44. package/docs/demos/Page/examples/Page.md +189 -189
  45. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +153 -153
  46. package/docs/demos/Skeleton/examples/Skeleton.md +21 -21
  47. package/docs/demos/Table/examples/Table.md +339 -339
  48. package/docs/demos/Tabs/examples/Tabs.md +126 -126
  49. package/docs/demos/Toolbar/examples/Toolbar.md +50 -50
  50. package/docs/demos/Wizard/examples/Wizard.md +189 -189
  51. package/docs/layouts/Flex/examples/Flex.md +319 -215
  52. package/layouts/Flex/flex.css +738 -31
  53. package/layouts/Flex/flex.scss +101 -17
  54. package/package.json +1 -1
  55. package/patternfly-base-no-globals.css +1 -1
  56. package/patternfly-base.css +1 -1
  57. package/patternfly-no-globals.css +859 -389
  58. package/patternfly.css +859 -389
  59. package/patternfly.min.css +1 -1
  60. package/patternfly.min.css.map +1 -1
  61. package/sass-utilities/component-namespaces.scss +0 -3
  62. package/sass-utilities/functions.scss +9 -5
  63. package/sass-utilities/themes/dark/scss-variables.scss +1 -4
  64. package/components/Breadcrumb/themes/dark/breadcrumb.scss +0 -7
  65. package/components/SearchInput/search-input.css +0 -199
  66. package/components/SearchInput/search-input.scss +0 -231
  67. package/components/SearchInput/themes/dark/search-input.scss +0 -16
  68. package/docs/components/ChipGroup/examples/ChipGroup.md +0 -716
  69. package/docs/components/SearchInput/examples/SearchInput.css +0 -12
  70. package/docs/components/SearchInput/examples/SearchInput.md +0 -681
  71. /package/components/{ChipGroup → Chip}/chip-group.css +0 -0
  72. /package/components/{ChipGroup → Chip}/chip-group.scss +0 -0
@@ -289,7 +289,7 @@
289
289
  --pf-v5-global--disabled-color--200: #444548;
290
290
  --pf-v5-global--disabled-color--300: #aaabac;
291
291
  --pf-v5-global--icon--Color--light: #aaabac;
292
- --pf-v5-global--icon--Color--dark: #aaabac;
292
+ --pf-v5-global--icon--Color--dark: #e0e0e0;
293
293
  --pf-v5-global--Color--dark-100: #e0e0e0;
294
294
  --pf-v5-global--Color--dark-200: #aaabac;
295
295
  --pf-v5-global--Color--light-100: #e0e0e0;
@@ -2,7 +2,7 @@
2
2
  --pf-v5-c-breadcrumb__item--FontSize: var(--pf-v5-global--FontSize--sm);
3
3
  --pf-v5-c-breadcrumb__item--LineHeight: var(--pf-v5-global--LineHeight--sm);
4
4
  --pf-v5-c-breadcrumb__item--MarginRight: var(--pf-v5-global--spacer--sm);
5
- --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-v5-global--BorderColor--200);
5
+ --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-v5-global--icon--Color--dark);
6
6
  --pf-v5-c-breadcrumb__item-divider--MarginRight: var(--pf-v5-global--spacer--sm);
7
7
  --pf-v5-c-breadcrumb__item-divider--FontSize: var(--pf-v5-global--FontSize--sm);
8
8
  --pf-v5-c-breadcrumb__link--Color: var(--pf-v5-global--link--Color);
@@ -89,8 +89,4 @@ button.pf-v5-c-breadcrumb__link {
89
89
 
90
90
  .pf-v5-c-breadcrumb__list > :first-child .pf-v5-c-breadcrumb__item-divider {
91
91
  display: none;
92
- }
93
-
94
- :where(.pf-v5-theme-dark) .pf-v5-c-breadcrumb {
95
- --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-v5-global--BorderColor--100);
96
92
  }
@@ -7,7 +7,7 @@
7
7
  --#{$breadcrumb}__item--MarginRight: var(--#{$pf-global}--spacer--sm);
8
8
 
9
9
  // Breadcrumb divider
10
- --#{$breadcrumb}__item-divider--Color: var(--#{$pf-global}--BorderColor--200);
10
+ --#{$breadcrumb}__item-divider--Color: var(--#{$pf-global}--icon--Color--dark);
11
11
  --#{$breadcrumb}__item-divider--MarginRight: var(--#{$pf-global}--spacer--sm);
12
12
  --#{$breadcrumb}__item-divider--FontSize: var(--#{$pf-global}--FontSize--sm);
13
13
 
@@ -120,10 +120,3 @@
120
120
  .#{$breadcrumb}__list > :first-child .#{$breadcrumb}__item-divider {
121
121
  display: none;
122
122
  }
123
-
124
- // stylelint-disable no-invalid-position-at-import-rule
125
- @import "themes/dark/breadcrumb";
126
-
127
- @include pf-v5-theme-dark {
128
- @include pf-v5-theme-dark-breadcrumb;
129
- }
@@ -100,8 +100,8 @@
100
100
  .pf-v5-c-divider.pf-m-vertical::after {
101
101
  flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
102
102
  }
103
- .pf-v5-c-divider.pf-m-inset-none {
104
- --pf-v5-c-divider--after--Inset: 0%;
103
+ .pf-v5-c-divider.pf-m-inset-base {
104
+ --pf-v5-c-divider--after--Inset: ;
105
105
  }
106
106
  .pf-v5-c-divider.pf-m-inset-xs {
107
107
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -151,8 +151,8 @@
151
151
  }
152
152
  }
153
153
  @media (min-width: 576px) {
154
- .pf-v5-c-divider.pf-m-inset-none-on-sm {
155
- --pf-v5-c-divider--after--Inset: 0%;
154
+ .pf-v5-c-divider.pf-m-inset-base-on-sm {
155
+ --pf-v5-c-divider--after--Inset: ;
156
156
  }
157
157
  .pf-v5-c-divider.pf-m-inset-xs-on-sm {
158
158
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -203,8 +203,8 @@
203
203
  }
204
204
  }
205
205
  @media (min-width: 768px) {
206
- .pf-v5-c-divider.pf-m-inset-none-on-md {
207
- --pf-v5-c-divider--after--Inset: 0%;
206
+ .pf-v5-c-divider.pf-m-inset-base-on-md {
207
+ --pf-v5-c-divider--after--Inset: ;
208
208
  }
209
209
  .pf-v5-c-divider.pf-m-inset-xs-on-md {
210
210
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -255,8 +255,8 @@
255
255
  }
256
256
  }
257
257
  @media (min-width: 992px) {
258
- .pf-v5-c-divider.pf-m-inset-none-on-lg {
259
- --pf-v5-c-divider--after--Inset: 0%;
258
+ .pf-v5-c-divider.pf-m-inset-base-on-lg {
259
+ --pf-v5-c-divider--after--Inset: ;
260
260
  }
261
261
  .pf-v5-c-divider.pf-m-inset-xs-on-lg {
262
262
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -307,8 +307,8 @@
307
307
  }
308
308
  }
309
309
  @media (min-width: 1200px) {
310
- .pf-v5-c-divider.pf-m-inset-none-on-xl {
311
- --pf-v5-c-divider--after--Inset: 0%;
310
+ .pf-v5-c-divider.pf-m-inset-base-on-xl {
311
+ --pf-v5-c-divider--after--Inset: ;
312
312
  }
313
313
  .pf-v5-c-divider.pf-m-inset-xs-on-xl {
314
314
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -359,8 +359,8 @@
359
359
  }
360
360
  }
361
361
  @media (min-width: 1450px) {
362
- .pf-v5-c-divider.pf-m-inset-none-on-2xl {
363
- --pf-v5-c-divider--after--Inset: 0%;
362
+ .pf-v5-c-divider.pf-m-inset-base-on-2xl {
363
+ --pf-v5-c-divider--after--Inset: ;
364
364
  }
365
365
  .pf-v5-c-divider.pf-m-inset-xs-on-2xl {
366
366
  --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
@@ -11,7 +11,7 @@
11
11
  --pf-v5-c-list__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--sm);
12
12
  --pf-v5-c-list__item-icon--MarginTop: 0.375rem;
13
13
  --pf-v5-c-list__item-icon--MarginRight: var(--pf-v5-global--spacer--sm);
14
- --pf-v5-c-list__item-icon--Color: var(--pf-v5-global--icon--Color--light);
14
+ --pf-v5-c-list__item-icon--Color: var(--pf-v5-global--icon--Color--dark);
15
15
  --pf-v5-c-list__item-icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
16
16
  --pf-v5-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-v5-global--icon--FontSize--lg);
17
17
  --pf-v5-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-v5-global--spacer--md);
@@ -20,7 +20,7 @@
20
20
  --#{$list}__item-icon--MinWidth: var(--#{$pf-global}--icon--FontSize--sm);
21
21
  --#{$list}__item-icon--MarginTop: #{pf-size-prem(6px)};
22
22
  --#{$list}__item-icon--MarginRight: var(--#{$pf-global}--spacer--sm);
23
- --#{$list}__item-icon--Color: var(--#{$pf-global}--icon--Color--light);
23
+ --#{$list}__item-icon--Color: var(--#{$pf-global}--icon--Color--dark);
24
24
  --#{$list}__item-icon--FontSize: var(--#{$pf-global}--icon--FontSize--sm);
25
25
  --#{$list}--m-icon-lg__item-icon--MinWidth: var(--#{$pf-global}--icon--FontSize--lg);
26
26
  --#{$list}--m-icon-lg__item-icon--MarginRight: var(--#{$pf-global}--spacer--md);
@@ -109,9 +109,6 @@
109
109
  .pf-v5-c-log-viewer .pf-v5-c-toolbar__content-section {
110
110
  flex-wrap: nowrap;
111
111
  }
112
- .pf-v5-c-log-viewer .pf-v5-c-search-input {
113
- width: 100%;
114
- }
115
112
 
116
113
  .pf-v5-c-log-viewer__header {
117
114
  margin-bottom: var(--pf-v5-c-log-viewer__header--MarginBottom);
@@ -134,10 +134,6 @@
134
134
  .#{$toolbar}__content-section {
135
135
  flex-wrap: nowrap;
136
136
  }
137
-
138
- .#{$search-input} {
139
- width: 100%;
140
- }
141
137
  }
142
138
 
143
139
  // Header
@@ -319,8 +319,8 @@
319
319
  --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
320
320
  --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
321
321
  }
322
- .pf-v5-c-masthead.pf-m-inset-none {
323
- --pf-v5-c-masthead--inset: 0;
322
+ .pf-v5-c-masthead.pf-m-inset-base {
323
+ --pf-v5-c-masthead--inset: ;
324
324
  }
325
325
  .pf-v5-c-masthead.pf-m-inset-sm {
326
326
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -378,8 +378,8 @@
378
378
  }
379
379
  }
380
380
  @media (min-width: 576px) {
381
- .pf-v5-c-masthead.pf-m-inset-none-on-sm {
382
- --pf-v5-c-masthead--inset: 0;
381
+ .pf-v5-c-masthead.pf-m-inset-base-on-sm {
382
+ --pf-v5-c-masthead--inset: ;
383
383
  }
384
384
  .pf-v5-c-masthead.pf-m-inset-sm-on-sm {
385
385
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -438,8 +438,8 @@
438
438
  }
439
439
  }
440
440
  @media (min-width: 768px) {
441
- .pf-v5-c-masthead.pf-m-inset-none-on-md {
442
- --pf-v5-c-masthead--inset: 0;
441
+ .pf-v5-c-masthead.pf-m-inset-base-on-md {
442
+ --pf-v5-c-masthead--inset: ;
443
443
  }
444
444
  .pf-v5-c-masthead.pf-m-inset-sm-on-md {
445
445
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -498,8 +498,8 @@
498
498
  }
499
499
  }
500
500
  @media (min-width: 992px) {
501
- .pf-v5-c-masthead.pf-m-inset-none-on-lg {
502
- --pf-v5-c-masthead--inset: 0;
501
+ .pf-v5-c-masthead.pf-m-inset-base-on-lg {
502
+ --pf-v5-c-masthead--inset: ;
503
503
  }
504
504
  .pf-v5-c-masthead.pf-m-inset-sm-on-lg {
505
505
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -558,8 +558,8 @@
558
558
  }
559
559
  }
560
560
  @media (min-width: 1200px) {
561
- .pf-v5-c-masthead.pf-m-inset-none-on-xl {
562
- --pf-v5-c-masthead--inset: 0;
561
+ .pf-v5-c-masthead.pf-m-inset-base-on-xl {
562
+ --pf-v5-c-masthead--inset: ;
563
563
  }
564
564
  .pf-v5-c-masthead.pf-m-inset-sm-on-xl {
565
565
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -618,8 +618,8 @@
618
618
  }
619
619
  }
620
620
  @media (min-width: 1450px) {
621
- .pf-v5-c-masthead.pf-m-inset-none-on-2xl {
622
- --pf-v5-c-masthead--inset: 0;
621
+ .pf-v5-c-masthead.pf-m-inset-base-on-2xl {
622
+ --pf-v5-c-masthead--inset: ;
623
623
  }
624
624
  .pf-v5-c-masthead.pf-m-inset-sm-on-2xl {
625
625
  --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
@@ -20,7 +20,7 @@
20
20
  --pf-v5-c-multiple-file-upload__title--Display: grid;
21
21
  --pf-v5-c-multiple-file-upload__title--GridTemplateColumns: auto;
22
22
  --pf-v5-c-multiple-file-upload__title--Gap: var(--pf-v5-global--spacer--sm);
23
- --pf-v5-c-multiple-file-upload__title-icon--Color: var(--pf-v5-global--Color--200);
23
+ --pf-v5-c-multiple-file-upload__title-icon--Color: var(--pf-v5-global--icon--Color--dark);
24
24
  --pf-v5-c-multiple-file-upload__title-text-separator--Display: block;
25
25
  --pf-v5-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-v5-global--spacer--sm);
26
26
  --pf-v5-c-multiple-file-upload__info--FontSize: var(--pf-v5-global--FontSize--sm);
@@ -47,7 +47,7 @@
47
47
  --pf-v5-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
48
48
  --pf-v5-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
49
49
  --pf-v5-c-multiple-file-upload__status-progress--Gap: var(--pf-v5-global--spacer--sm);
50
- --pf-v5-c-multiple-file-upload__status-progress-icon--Color: var(--pf-v5-global--Color--200);
50
+ --pf-v5-c-multiple-file-upload__status-progress-icon--Color: var(--pf-v5-global--icon--Color--dark);
51
51
  --pf-v5-c-multiple-file-upload__status-item--PaddingTop: var(--pf-v5-global--spacer--md);
52
52
  --pf-v5-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-v5-global--spacer--md);
53
53
  --pf-v5-c-multiple-file-upload__status-item--first-child--PaddingTop: 0;
@@ -55,7 +55,7 @@
55
55
  --pf-v5-c-multiple-file-upload__status-item--Gap: var(--pf-v5-global--spacer--sm);
56
56
  --pf-v5-c-multiple-file-upload__status-item--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
57
57
  --pf-v5-c-multiple-file-upload__status-item--BorderColor: var(--pf-v5-global--BorderColor--100);
58
- --pf-v5-c-multiple-file-upload__status-item-icon--Color: var(--pf-v5-global--Color--200);
58
+ --pf-v5-c-multiple-file-upload__status-item-icon--Color: var(--pf-v5-global--icon--Color--dark);
59
59
  --pf-v5-c-multiple-file-upload__status-item-close--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
60
60
  --pf-v5-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
61
61
  --pf-v5-c-multiple-file-upload__status-item-progress--Gap: var(--pf-v5-global--spacer--sm);
@@ -28,7 +28,7 @@
28
28
  --#{$multiple-file-upload}__title--Gap: var(--#{$pf-global}--spacer--sm);
29
29
 
30
30
  // title icon
31
- --#{$multiple-file-upload}__title-icon--Color: var(--#{$pf-global}--Color--200);
31
+ --#{$multiple-file-upload}__title-icon--Color: var(--#{$pf-global}--icon--Color--dark);
32
32
 
33
33
  // title text separator
34
34
  --#{$multiple-file-upload}__title-text-separator--Display: block;
@@ -67,7 +67,7 @@
67
67
  --#{$multiple-file-upload}__status-progress--Gap: var(--#{$pf-global}--spacer--sm);
68
68
 
69
69
  // status progress icon
70
- --#{$multiple-file-upload}__status-progress-icon--Color: var(--#{$pf-global}--Color--200);
70
+ --#{$multiple-file-upload}__status-progress-icon--Color: var(--#{$pf-global}--icon--Color--dark);
71
71
 
72
72
  // status item
73
73
  --#{$multiple-file-upload}__status-item--PaddingTop: var(--#{$pf-global}--spacer--md);
@@ -79,7 +79,7 @@
79
79
  --#{$multiple-file-upload}__status-item--BorderColor: var(--#{$pf-global}--BorderColor--100);
80
80
 
81
81
  // status item icon
82
- --#{$multiple-file-upload}__status-item-icon--Color: var(--#{$pf-global}--Color--200);
82
+ --#{$multiple-file-upload}__status-item-icon--Color: var(--#{$pf-global}--icon--Color--dark);
83
83
 
84
84
  // status item close
85
85
  --#{$multiple-file-upload}__status-item-close--MarginTop: calc(var(--#{$pf-global}--spacer--form-element) * -1);
@@ -229,8 +229,8 @@
229
229
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
230
230
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
231
231
  }
232
- .pf-v5-c-pagination.pf-m-inset-none {
233
- --pf-v5-c-pagination--inset: 0;
232
+ .pf-v5-c-pagination.pf-m-inset-base {
233
+ --pf-v5-c-pagination--inset: ;
234
234
  }
235
235
  .pf-v5-c-pagination.pf-m-inset-sm {
236
236
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -258,8 +258,8 @@
258
258
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
259
259
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
260
260
  }
261
- .pf-v5-c-pagination.pf-m-inset-none-on-sm {
262
- --pf-v5-c-pagination--inset: 0;
261
+ .pf-v5-c-pagination.pf-m-inset-base-on-sm {
262
+ --pf-v5-c-pagination--inset: ;
263
263
  }
264
264
  .pf-v5-c-pagination.pf-m-inset-sm-on-sm {
265
265
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -288,8 +288,8 @@
288
288
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
289
289
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
290
290
  }
291
- .pf-v5-c-pagination.pf-m-inset-none-on-md {
292
- --pf-v5-c-pagination--inset: 0;
291
+ .pf-v5-c-pagination.pf-m-inset-base-on-md {
292
+ --pf-v5-c-pagination--inset: ;
293
293
  }
294
294
  .pf-v5-c-pagination.pf-m-inset-sm-on-md {
295
295
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -318,8 +318,8 @@
318
318
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
319
319
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
320
320
  }
321
- .pf-v5-c-pagination.pf-m-inset-none-on-lg {
322
- --pf-v5-c-pagination--inset: 0;
321
+ .pf-v5-c-pagination.pf-m-inset-base-on-lg {
322
+ --pf-v5-c-pagination--inset: ;
323
323
  }
324
324
  .pf-v5-c-pagination.pf-m-inset-sm-on-lg {
325
325
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -348,8 +348,8 @@
348
348
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
349
349
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
350
350
  }
351
- .pf-v5-c-pagination.pf-m-inset-none-on-xl {
352
- --pf-v5-c-pagination--inset: 0;
351
+ .pf-v5-c-pagination.pf-m-inset-base-on-xl {
352
+ --pf-v5-c-pagination--inset: ;
353
353
  }
354
354
  .pf-v5-c-pagination.pf-m-inset-sm-on-xl {
355
355
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -378,8 +378,8 @@
378
378
  --pf-v5-c-pagination--c-options-menu--Display: var(--pf-v5-c-pagination--m-display-full--c-options-menu--Display);
379
379
  --pf-v5-c-pagination__total-items--Display: var(--pf-v5-c-pagination--m-display-full__total-items--Display);
380
380
  }
381
- .pf-v5-c-pagination.pf-m-inset-none-on-2xl {
382
- --pf-v5-c-pagination--inset: 0;
381
+ .pf-v5-c-pagination.pf-m-inset-base-on-2xl {
382
+ --pf-v5-c-pagination--inset: ;
383
383
  }
384
384
  .pf-v5-c-pagination.pf-m-inset-sm-on-2xl {
385
385
  --pf-v5-c-pagination--inset: var(--pf-v5-global--spacer--sm);
@@ -643,10 +643,10 @@
643
643
  outline-offset: var(--pf-v5-c-tabs__add--c-button--OutlineOffset);
644
644
  }
645
645
 
646
- .pf-v5-c-tabs.pf-m-inset-none {
647
- --pf-v5-c-tabs--inset: 0;
648
- --pf-v5-c-tabs--m-vertical--inset: 0;
649
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
646
+ .pf-v5-c-tabs.pf-m-inset-base {
647
+ --pf-v5-c-tabs--inset: ;
648
+ --pf-v5-c-tabs--m-vertical--inset: ;
649
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
650
650
  }
651
651
  .pf-v5-c-tabs.pf-m-inset-sm {
652
652
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -674,10 +674,10 @@
674
674
  --pf-v5-c-tabs--m-vertical--m-box--inset: var(--pf-v5-global--spacer--2xl);
675
675
  }
676
676
  @media (min-width: 576px) {
677
- .pf-v5-c-tabs.pf-m-inset-none-on-sm {
678
- --pf-v5-c-tabs--inset: 0;
679
- --pf-v5-c-tabs--m-vertical--inset: 0;
680
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
677
+ .pf-v5-c-tabs.pf-m-inset-base-on-sm {
678
+ --pf-v5-c-tabs--inset: ;
679
+ --pf-v5-c-tabs--m-vertical--inset: ;
680
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
681
681
  }
682
682
  .pf-v5-c-tabs.pf-m-inset-sm-on-sm {
683
683
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -706,10 +706,10 @@
706
706
  }
707
707
  }
708
708
  @media (min-width: 768px) {
709
- .pf-v5-c-tabs.pf-m-inset-none-on-md {
710
- --pf-v5-c-tabs--inset: 0;
711
- --pf-v5-c-tabs--m-vertical--inset: 0;
712
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
709
+ .pf-v5-c-tabs.pf-m-inset-base-on-md {
710
+ --pf-v5-c-tabs--inset: ;
711
+ --pf-v5-c-tabs--m-vertical--inset: ;
712
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
713
713
  }
714
714
  .pf-v5-c-tabs.pf-m-inset-sm-on-md {
715
715
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -738,10 +738,10 @@
738
738
  }
739
739
  }
740
740
  @media (min-width: 992px) {
741
- .pf-v5-c-tabs.pf-m-inset-none-on-lg {
742
- --pf-v5-c-tabs--inset: 0;
743
- --pf-v5-c-tabs--m-vertical--inset: 0;
744
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
741
+ .pf-v5-c-tabs.pf-m-inset-base-on-lg {
742
+ --pf-v5-c-tabs--inset: ;
743
+ --pf-v5-c-tabs--m-vertical--inset: ;
744
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
745
745
  }
746
746
  .pf-v5-c-tabs.pf-m-inset-sm-on-lg {
747
747
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -770,10 +770,10 @@
770
770
  }
771
771
  }
772
772
  @media (min-width: 1200px) {
773
- .pf-v5-c-tabs.pf-m-inset-none-on-xl {
774
- --pf-v5-c-tabs--inset: 0;
775
- --pf-v5-c-tabs--m-vertical--inset: 0;
776
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
773
+ .pf-v5-c-tabs.pf-m-inset-base-on-xl {
774
+ --pf-v5-c-tabs--inset: ;
775
+ --pf-v5-c-tabs--m-vertical--inset: ;
776
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
777
777
  }
778
778
  .pf-v5-c-tabs.pf-m-inset-sm-on-xl {
779
779
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -802,10 +802,10 @@
802
802
  }
803
803
  }
804
804
  @media (min-width: 1450px) {
805
- .pf-v5-c-tabs.pf-m-inset-none-on-2xl {
806
- --pf-v5-c-tabs--inset: 0;
807
- --pf-v5-c-tabs--m-vertical--inset: 0;
808
- --pf-v5-c-tabs--m-vertical--m-box--inset: 0;
805
+ .pf-v5-c-tabs.pf-m-inset-base-on-2xl {
806
+ --pf-v5-c-tabs--inset: ;
807
+ --pf-v5-c-tabs--m-vertical--inset: ;
808
+ --pf-v5-c-tabs--m-vertical--m-box--inset: ;
809
809
  }
810
810
  .pf-v5-c-tabs.pf-m-inset-sm-on-2xl {
811
811
  --pf-v5-c-tabs--inset: var(--pf-v5-global--spacer--sm);
@@ -23,8 +23,7 @@
23
23
  --pf-v5-c-text-input-group__text-input--placeholder--Color: var(--pf-v5-global--Color--dark-200);
24
24
  --pf-v5-c-text-input-group__text-input--BackgroundColor: transparent;
25
25
  --pf-v5-c-text-input-group__icon--Left: var(--pf-v5-global--spacer--sm);
26
- --pf-v5-c-text-input-group__icon--Color: var(--pf-v5-global--Color--200);
27
- --pf-v5-c-text-input-group__text--hover__icon--Color: var(--pf-v5-global--Color--100);
26
+ --pf-v5-c-text-input-group__icon--Color: var(--pf-v5-global--icon--Color--dark);
28
27
  --pf-v5-c-text-input-group__icon--TranslateY: -50%;
29
28
  --pf-v5-c-text-input-group__utilities--MarginRight: var(--pf-v5-global--spacer--sm);
30
29
  --pf-v5-c-text-input-group__utilities--MarginLeft: var(--pf-v5-global--spacer--xs);
@@ -97,9 +96,6 @@
97
96
  .pf-v5-c-text-input-group__text::after {
98
97
  border-bottom: var(--pf-v5-c-text-input-group__text--after--BorderBottomWidth) solid var(--pf-v5-c-text-input-group__text--after--BorderBottomColor);
99
98
  }
100
- .pf-v5-c-text-input-group__text:hover, .pf-v5-c-text-input-group__text:focus-within {
101
- --pf-v5-c-text-input-group__icon--Color: var(--pf-v5-c-text-input-group__text--hover__icon--Color);
102
- }
103
99
  .pf-v5-c-text-input-group__text:focus-within {
104
100
  --pf-v5-c-text-input-group__text--after--BorderBottomWidth: var(--pf-v5-c-text-input-group__text--focus-within--after--BorderBottomWidth);
105
101
  --pf-v5-c-text-input-group__text--after--BorderBottomColor: var(--pf-v5-c-text-input-group__text--focus-within--after--BorderBottomColor);
@@ -37,8 +37,7 @@
37
37
 
38
38
  // Icon
39
39
  --#{$text-input-group}__icon--Left: var(--#{$pf-global}--spacer--sm);
40
- --#{$text-input-group}__icon--Color: var(--#{$pf-global}--Color--200);
41
- --#{$text-input-group}__text--hover__icon--Color: var(--#{$pf-global}--Color--100);
40
+ --#{$text-input-group}__icon--Color: var(--#{$pf-global}--icon--Color--dark);
42
41
  --#{$text-input-group}__icon--TranslateY: -50%;
43
42
 
44
43
  // Utilities
@@ -131,11 +130,6 @@
131
130
  border-bottom: var(--#{$text-input-group}__text--after--BorderBottomWidth) solid var(--#{$text-input-group}__text--after--BorderBottomColor);
132
131
  }
133
132
 
134
- &:hover,
135
- &:focus-within {
136
- --#{$text-input-group}__icon--Color: var(--#{$text-input-group}__text--hover__icon--Color);
137
- }
138
-
139
133
  &:focus-within {
140
134
  --#{$text-input-group}__text--after--BorderBottomWidth: var(--#{$text-input-group}__text--focus-within--after--BorderBottomWidth);
141
135
  --#{$text-input-group}__text--after--BorderBottomColor: var(--#{$text-input-group}__text--focus-within--after--BorderBottomColor);