@patternfly/patternfly 6.3.0-prerelease.68 → 6.3.0-prerelease.70

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 (19) hide show
  1. package/components/DualListSelector/dual-list-selector.css +2 -3
  2. package/components/DualListSelector/dual-list-selector.scss +3 -3
  3. package/components/Page/page.css +5 -0
  4. package/components/Page/page.scss +13 -4
  5. package/components/_index.css +7 -3
  6. package/docs/components/DatePicker/examples/DatePicker.md +4 -1
  7. package/docs/components/FileUpload/examples/FileUpload.md +4 -3
  8. package/docs/components/Form/examples/Form.md +16 -15
  9. package/docs/components/HelperText/examples/HelperText.md +65 -75
  10. package/docs/components/Login/examples/Login.md +20 -15
  11. package/docs/demos/Alert/examples/Alert.md +28 -19
  12. package/docs/demos/Form/examples/BasicForms.md +0 -21
  13. package/docs/demos/HelperText/examples/HelperText.md +31 -23
  14. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +56 -38
  15. package/package.json +1 -1
  16. package/patternfly-no-globals.css +7 -3
  17. package/patternfly.css +7 -3
  18. package/patternfly.min.css +1 -1
  19. package/patternfly.min.css.map +1 -1
package/docs/demos/Form/examples/BasicForms.md CHANGED
@@ -26,9 +26,6 @@ subsection: forms
26
26
  <div class="pf-v6-c-form__helper-text" aria-live="polite">
27
27
  <div class="pf-v6-c-helper-text">
28
28
  <div class="pf-v6-c-helper-text__item" id="-name-helper">
29
- <span class="pf-v6-c-helper-text__item-icon">
30
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
31
- </span>
32
29
  <span
33
30
  class="pf-v6-c-helper-text__item-text"
34
31
  >Include your middle name if you have one.</span>
@@ -212,9 +209,6 @@ subsection: forms
212
209
  class="pf-v6-c-helper-text__item"
213
210
  id="form-demo-horizontal-name-helper"
214
211
  >
215
- <span class="pf-v6-c-helper-text__item-icon">
216
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
217
- </span>
218
212
  <span
219
213
  class="pf-v6-c-helper-text__item-text"
220
214
  >Include your middle name if you have one.</span>
@@ -368,9 +362,6 @@ subsection: forms
368
362
  <div class="pf-v6-c-form__helper-text" aria-live="polite">
369
363
  <div class="pf-v6-c-helper-text">
370
364
  <div class="pf-v6-c-helper-text__item" id="-helper">
371
- <span class="pf-v6-c-helper-text__item-icon">
372
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
373
- </span>
374
365
  <span
375
366
  class="pf-v6-c-helper-text__item-text"
376
367
  >Include your middle name if you have one.</span>
@@ -1424,9 +1415,6 @@ subsection: forms
1424
1415
  class="pf-v6-c-helper-text__item"
1425
1416
  id="form-demo-sections-complex-form-routing-create-route-helper"
1426
1417
  >
1427
- <span class="pf-v6-c-helper-text__item-icon">
1428
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1429
- </span>
1430
1418
  <span
1431
1419
  class="pf-v6-c-helper-text__item-text"
1432
1420
  >Exposes your appplication at a public URL.</span>
@@ -1457,9 +1445,6 @@ subsection: forms
1457
1445
  class="pf-v6-c-helper-text__item"
1458
1446
  id="form-demo-sections-complex-form-routing-hostname-helper"
1459
1447
  >
1460
- <span class="pf-v6-c-helper-text__item-icon">
1461
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1462
- </span>
1463
1448
  <span
1464
1449
  class="pf-v6-c-helper-text__item-text"
1465
1450
  >Public hostname for the route. If not specified, a hostname is generated.</span>
@@ -1492,9 +1477,6 @@ subsection: forms
1492
1477
  class="pf-v6-c-helper-text__item"
1493
1478
  id="form-demo-sections-complex-form-routing-path-helper"
1494
1479
  >
1495
- <span class="pf-v6-c-helper-text__item-icon">
1496
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1497
- </span>
1498
1480
  <span
1499
1481
  class="pf-v6-c-helper-text__item-text"
1500
1482
  >Path that the router watches to route traffic to the service.</span>
@@ -1537,9 +1519,6 @@ subsection: forms
1537
1519
  class="pf-v6-c-helper-text__item"
1538
1520
  id="form-demo-sections-complex-form-routing-security-helper"
1539
1521
  >
1540
- <span class="pf-v6-c-helper-text__item-icon">
1541
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1542
- </span>
1543
1522
  <span
1544
1523
  class="pf-v6-c-helper-text__item-text"
1545
1524
  >Routes can be secured using several TLS termination types for serving certificates.</span>
package/docs/demos/HelperText/examples/HelperText.md CHANGED
@@ -63,9 +63,13 @@ section: components
63
63
  >
64
64
  <div class="pf-v6-c-helper-text">
65
65
  <div class="pf-v6-c-helper-text__item pf-m-warning">
66
- <span
67
- class="pf-v6-c-helper-text__item-text"
68
- >This is helper text for a warning.</span>
66
+ <span class="pf-v6-c-helper-text__item-icon">
67
+ <i class="fas fa-fw fa-exclamation-triangle" aria-hidden="true"></i>
68
+ </span>
69
+ <span class="pf-v6-c-helper-text__item-text">
70
+ <span class="pf-v6-screen-reader">Warning:</span>
71
+ This is helper text for a warning.
72
+ </span>
69
73
  </div>
70
74
  </div>
71
75
  </div>
@@ -97,32 +101,35 @@ section: components
97
101
  aria-live="polite"
98
102
  id="helper-text-form-address-helper"
99
103
  >
100
- <div class="pf-v6-c-helper-text">
101
- <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
104
+ <ul class="pf-v6-c-helper-text" role="list">
105
+ <li class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
102
106
  <span class="pf-v6-c-helper-text__item-icon">
103
107
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
104
108
  </span>
105
- <span
106
- class="pf-v6-c-helper-text__item-text"
107
- >This criteria has been met.</span>
108
- </div>
109
- <div class="pf-v6-c-helper-text__item pf-m-error pf-m-dynamic">
109
+ <span class="pf-v6-c-helper-text__item-text">
110
+ <span class="pf-v6-screen-reader">Success:</span>
111
+ This criteria has been met.
112
+ </span>
113
+ </li>
114
+ <li class="pf-v6-c-helper-text__item pf-m-error pf-m-dynamic">
110
115
  <span class="pf-v6-c-helper-text__item-icon">
111
116
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
112
117
  </span>
113
- <span
114
- class="pf-v6-c-helper-text__item-text"
115
- >This criteria has not been met.</span>
116
- </div>
117
- <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
118
+ <span class="pf-v6-c-helper-text__item-text">
119
+ <span class="pf-v6-screen-reader">Error:</span>
120
+ This criteria has not been met.
121
+ </span>
122
+ </li>
123
+ <li class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
118
124
  <span class="pf-v6-c-helper-text__item-icon">
119
125
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
120
126
  </span>
121
- <span
122
- class="pf-v6-c-helper-text__item-text"
123
- >This criteria has been met.</span>
124
- </div>
125
- </div>
127
+ <span class="pf-v6-c-helper-text__item-text">
128
+ <span class="pf-v6-screen-reader">Success:</span>
129
+ This criteria has been met.
130
+ </span>
131
+ </li>
132
+ </ul>
126
133
  </div>
127
134
  </div>
128
135
  </div>
@@ -156,9 +163,10 @@ section: components
156
163
  <span class="pf-v6-c-helper-text__item-icon">
157
164
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
158
165
  </span>
159
- <span
160
- class="pf-v6-c-helper-text__item-text"
161
- >This is dynamic helper text with an icon showing success.</span>
166
+ <span class="pf-v6-c-helper-text__item-text">
167
+ <span class="pf-v6-screen-reader">Success:</span>
168
+ This is dynamic helper text with an icon showing success.
169
+ </span>
162
170
  </div>
163
171
  </div>
164
172
  </div>
package/docs/demos/PasswordStrength/examples/PasswordStrength.md CHANGED
@@ -52,9 +52,10 @@ section: components
52
52
  <span class="pf-v6-c-helper-text__item-icon">
53
53
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
54
54
  </span>
55
- <span
56
- class="pf-v6-c-helper-text__item-text"
57
- >Must be at least 14 characters</span>
55
+ <span class="pf-v6-c-helper-text__item-text">
56
+ <span class="pf-v6-screen-reader">Indeterminate:</span>
57
+ Must be at least 14 characters
58
+ </span>
58
59
  </div>
59
60
  <div
60
61
  class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
@@ -62,9 +63,10 @@ section: components
62
63
  <span class="pf-v6-c-helper-text__item-icon">
63
64
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
64
65
  </span>
65
- <span
66
- class="pf-v6-c-helper-text__item-text"
67
- >Cannot contain the word "redhat"</span>
66
+ <span class="pf-v6-c-helper-text__item-text">
67
+ <span class="pf-v6-screen-reader">Indeterminate:</span>
68
+ Cannot contain the word "redhat"
69
+ </span>
68
70
  </div>
69
71
  <div
70
72
  class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
@@ -72,9 +74,10 @@ section: components
72
74
  <span class="pf-v6-c-helper-text__item-icon">
73
75
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
74
76
  </span>
75
- <span
76
- class="pf-v6-c-helper-text__item-text"
77
- >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
77
+ <span class="pf-v6-c-helper-text__item-text">
78
+ <span class="pf-v6-screen-reader">Indeterminate:</span>
79
+ Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols
80
+ </span>
78
81
  </div>
79
82
  </div>
80
83
  </div>
@@ -131,25 +134,28 @@ section: components
131
134
  <span class="pf-v6-c-helper-text__item-icon">
132
135
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
133
136
  </span>
134
- <span
135
- class="pf-v6-c-helper-text__item-text"
136
- >Must be at least 14 characters</span>
137
+ <span class="pf-v6-c-helper-text__item-text">
138
+ <span class="pf-v6-screen-reader">Success:</span>
139
+ Must be at least 14 characters
140
+ </span>
137
141
  </div>
138
142
  <div class="pf-v6-c-helper-text__item pf-m-error pf-m-dynamic">
139
143
  <span class="pf-v6-c-helper-text__item-icon">
140
144
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
141
145
  </span>
142
- <span
143
- class="pf-v6-c-helper-text__item-text"
144
- >Cannot contain the word "redhat"</span>
146
+ <span class="pf-v6-c-helper-text__item-text">
147
+ <span class="pf-v6-screen-reader">Error:</span>
148
+ Cannot contain the word "redhat"
149
+ </span>
145
150
  </div>
146
151
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
147
152
  <span class="pf-v6-c-helper-text__item-icon">
148
153
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
149
154
  </span>
150
- <span
151
- class="pf-v6-c-helper-text__item-text"
152
- >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
155
+ <span class="pf-v6-c-helper-text__item-text">
156
+ <span class="pf-v6-screen-reader">Success:</span>
157
+ Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols
158
+ </span>
153
159
  </div>
154
160
  </div>
155
161
  </div>
@@ -177,7 +183,10 @@ section: components
177
183
  <span class="pf-v6-c-helper-text__item-icon">
178
184
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
179
185
  </span>
180
- <span class="pf-v6-c-helper-text__item-text">Weak</span>
186
+ <span class="pf-v6-c-helper-text__item-text">
187
+ <span class="pf-v6-screen-reader">Error:</span>
188
+ Weak
189
+ </span>
181
190
  </div>
182
191
  </div>
183
192
  </div>
@@ -215,25 +224,28 @@ section: components
215
224
  <span class="pf-v6-c-helper-text__item-icon">
216
225
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
217
226
  </span>
218
- <span
219
- class="pf-v6-c-helper-text__item-text"
220
- >Must be at least 14 characters</span>
227
+ <span class="pf-v6-c-helper-text__item-text">
228
+ <span class="pf-v6-screen-reader">Success:</span>
229
+ Must be at least 14 characters
230
+ </span>
221
231
  </div>
222
232
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
223
233
  <span class="pf-v6-c-helper-text__item-icon">
224
234
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
225
235
  </span>
226
- <span
227
- class="pf-v6-c-helper-text__item-text"
228
- >Cannot contain the word "redhat"</span>
236
+ <span class="pf-v6-c-helper-text__item-text">
237
+ <span class="pf-v6-screen-reader">Success:</span>
238
+ Cannot contain the word "redhat"
239
+ </span>
229
240
  </div>
230
241
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
231
242
  <span class="pf-v6-c-helper-text__item-icon">
232
243
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
233
244
  </span>
234
- <span
235
- class="pf-v6-c-helper-text__item-text"
236
- >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
245
+ <span class="pf-v6-c-helper-text__item-text">
246
+ <span class="pf-v6-screen-reader">Success:</span>
247
+ Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols
248
+ </span>
237
249
  </div>
238
250
  </div>
239
251
  </div>
@@ -261,7 +273,10 @@ section: components
261
273
  <span class="pf-v6-c-helper-text__item-icon">
262
274
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
263
275
  </span>
264
- <span class="pf-v6-c-helper-text__item-text">Strong</span>
276
+ <span class="pf-v6-c-helper-text__item-text">
277
+ <span class="pf-v6-screen-reader">Success:</span>
278
+ Strong
279
+ </span>
265
280
  </div>
266
281
  </div>
267
282
  </div>
@@ -299,25 +314,28 @@ section: components
299
314
  <span class="pf-v6-c-helper-text__item-icon">
300
315
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
301
316
  </span>
302
- <span
303
- class="pf-v6-c-helper-text__item-text"
304
- >Must be at least 14 characters</span>
317
+ <span class="pf-v6-c-helper-text__item-text">
318
+ <span class="pf-v6-screen-reader">Success:</span>
319
+ Must be at least 14 characters
320
+ </span>
305
321
  </div>
306
322
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
307
323
  <span class="pf-v6-c-helper-text__item-icon">
308
324
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
309
325
  </span>
310
- <span
311
- class="pf-v6-c-helper-text__item-text"
312
- >Cannot contain the word "redhat"</span>
326
+ <span class="pf-v6-c-helper-text__item-text">
327
+ <span class="pf-v6-screen-reader">Success:</span>
328
+ Cannot contain the word "redhat"
329
+ </span>
313
330
  </div>
314
331
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
315
332
  <span class="pf-v6-c-helper-text__item-icon">
316
333
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
317
334
  </span>
318
- <span
319
- class="pf-v6-c-helper-text__item-text"
320
- >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
335
+ <span class="pf-v6-c-helper-text__item-text">
336
+ <span class="pf-v6-screen-reader">Success:</span>
337
+ Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols
338
+ </span>
321
339
  </div>
322
340
  </div>
323
341
  </div>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.3.0-prerelease.68",
4
+ "version": "6.3.0-prerelease.70",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "engines": {
package/patternfly-no-globals.css CHANGED
@@ -13826,14 +13826,13 @@ ul) {
13826
13826
  --pf-v6-c-dual-list-selector__item-text--Color: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected__text--Color);
13827
13827
  font-weight: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
13828
13828
  }
13829
- .pf-v6-c-dual-list-selector__list-item-row:hover {
13829
+ .pf-v6-c-dual-list-selector__list-item-row:hover, .pf-v6-c-dual-list-selector__list-item-row:focus-within {
13830
13830
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor);
13831
13831
  --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BorderWidth);
13832
13832
  }
13833
13833
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-check {
13834
13834
  --pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
13835
- --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderColor: transparent;
13836
- --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: revert;
13835
+ --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderWidth: 0;
13837
13836
  }
13838
13837
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-ghost-row {
13839
13838
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
@@ -21251,6 +21250,8 @@ ul.pf-v6-c-list {
21251
21250
  --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
21252
21251
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
21253
21252
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
21253
+ --pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
21254
+ --pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
21254
21255
  }
21255
21256
  @media screen and (prefers-reduced-motion: no-preference) {
21256
21257
  .pf-v6-c-page {
@@ -21873,6 +21874,9 @@ ul.pf-v6-c-list {
21873
21874
  flex-shrink: 0;
21874
21875
  }
21875
21876
 
21877
+ .pf-v6-c-page__drawer > .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
21878
+ border-block-start: var(--pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth) solid var(--pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor);
21879
+ }
21876
21880
  .pf-v6-c-page__drawer .pf-v6-c-page__main-container {
21877
21881
  align-self: revert;
21878
21882
  }
package/patternfly.css CHANGED
@@ -13966,14 +13966,13 @@ ul) {
13966
13966
  --pf-v6-c-dual-list-selector__item-text--Color: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected__text--Color);
13967
13967
  font-weight: var(--pf-v6-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
13968
13968
  }
13969
- .pf-v6-c-dual-list-selector__list-item-row:hover {
13969
+ .pf-v6-c-dual-list-selector__list-item-row:hover, .pf-v6-c-dual-list-selector__list-item-row:focus-within {
13970
13970
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BackgroundColor);
13971
13971
  --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: var(--pf-v6-c-dual-list-selector__list-item-row--hover--BorderWidth);
13972
13972
  }
13973
13973
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-check {
13974
13974
  --pf-v6-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
13975
- --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderColor: transparent;
13976
- --pf-v6-c-dual-list-selector__list-item-row--BorderWidth: revert;
13975
+ --pf-v6-c-dual-list-selector__list-item-row--m-selected--BorderWidth: 0;
13977
13976
  }
13978
13977
  .pf-v6-c-dual-list-selector__list-item-row.pf-m-ghost-row {
13979
13978
  --pf-v6-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-v6-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
@@ -21391,6 +21390,8 @@ ul.pf-v6-c-list {
21391
21390
  --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
21392
21391
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
21393
21392
  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--action--default);
21393
+ --pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth: var(--pf-t--global--border--width--high-contrast--regular);
21394
+ --pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor: var(--pf-t--global--border--color--high-contrast);
21394
21395
  }
21395
21396
  @media screen and (prefers-reduced-motion: no-preference) {
21396
21397
  .pf-v6-c-page {
@@ -22013,6 +22014,9 @@ ul.pf-v6-c-list {
22013
22014
  flex-shrink: 0;
22014
22015
  }
22015
22016
 
22017
+ .pf-v6-c-page__drawer > .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
22018
+ border-block-start: var(--pf-v6-c-page__drawer--c-drawer--BorderBlockStartWidth) solid var(--pf-v6-c-page__drawer--c-drawer--BorderBlockStartColor);
22019
+ }
22016
22020
  .pf-v6-c-page__drawer .pf-v6-c-page__main-container {
22017
22021
  align-self: revert;
22018
22022
  }