@patternfly/patternfly 6.0.0-alpha.38 → 6.0.0-alpha.39

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 (36) hide show
  1. package/components/Divider/divider.css +97 -177
  2. package/components/Divider/divider.scss +60 -79
  3. package/components/Masthead/masthead.css +267 -435
  4. package/components/Masthead/masthead.scss +118 -233
  5. package/docs/components/Divider/examples/Divider.css +3 -1
  6. package/docs/components/Divider/examples/Divider.md +4 -5
  7. package/docs/components/Masthead/examples/masthead.md +441 -16
  8. package/docs/demos/AboutModal/examples/AboutModal.md +40 -42
  9. package/docs/demos/Alert/examples/Alert.md +120 -126
  10. package/docs/demos/BackToTop/examples/BackToTop.md +40 -42
  11. package/docs/demos/Banner/examples/Banner.md +79 -80
  12. package/docs/demos/CardView/examples/CardView.md +40 -42
  13. package/docs/demos/ContextSelector/examples/ContextSelector.md +129 -146
  14. package/docs/demos/Dashboard/examples/Dashboard.md +40 -42
  15. package/docs/demos/DataList/examples/DataList.md +160 -279
  16. package/docs/demos/DescriptionList/examples/DescriptionList.md +120 -126
  17. package/docs/demos/Drawer/examples/Drawer.md +200 -210
  18. package/docs/demos/JumpLinks/examples/JumpLinks.md +240 -252
  19. package/docs/demos/Masthead/examples/Masthead.md +143 -224
  20. package/docs/demos/Modal/examples/Modal.md +240 -252
  21. package/docs/demos/Nav/examples/Nav.md +320 -336
  22. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +200 -210
  23. package/docs/demos/Page/examples/Page.md +360 -378
  24. package/docs/demos/Page/examples/Penta.md +8 -15
  25. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +280 -294
  26. package/docs/demos/Skeleton/examples/Skeleton.md +40 -42
  27. package/docs/demos/Table/examples/Table.md +617 -647
  28. package/docs/demos/Tabs/examples/Tabs.md +240 -252
  29. package/docs/demos/Toolbar/examples/Toolbar.md +80 -84
  30. package/docs/demos/Wizard/examples/Wizard.md +360 -378
  31. package/package.json +1 -1
  32. package/patternfly-no-globals.css +363 -611
  33. package/patternfly-theme-dark-unversioned.css +363 -611
  34. package/patternfly.css +363 -611
  35. package/patternfly.min.css +1 -1
  36. package/patternfly.min.css.map +1 -1
package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md CHANGED
@@ -28,20 +28,16 @@ wrapperTag: div
28
28
  </button>
29
29
  </span>
30
30
  <div class="pf-v5-c-masthead__main">
31
- <a
32
- class="pf-v5-c-masthead__brand"
33
- href="#"
34
- style="--pf-v5-c-brand--Height: 36px;"
35
- >
36
- <svg height="36px" viewBox="0 0 679 158" role="img">
37
- <title>Patternfly logo</title>
31
+ <a class="pf-v5-c-masthead__brand" href="#">
32
+ <svg height="40px" viewBox="0 0 679 158">
33
+ <title>PF-HorizontalLogo-Color</title>
38
34
  <defs>
39
35
  <linearGradient
40
36
  x1="68%"
41
37
  y1="2.25860997e-13%"
42
38
  x2="32%"
43
39
  y2="100%"
44
- id="linearGradient-1"
40
+ id="linearGradient-primary-detail-expanded-example-masthead"
45
41
  >
46
42
  <stop stop-color="#2B9AF3" offset="0%" />
47
43
  <stop
@@ -51,13 +47,7 @@ wrapperTag: div
51
47
  />
52
48
  </linearGradient>
53
49
  </defs>
54
- <g
55
- id="PF-HorizontalLogo-Color"
56
- stroke="none"
57
- stroke-width="1"
58
- fill="none"
59
- fill-rule="evenodd"
60
- >
50
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
61
51
  <g
62
52
  transform="translate(206.000000, 45.750000)"
63
53
  fill="var(--pf-t--global--text--color--regular)"
@@ -92,19 +82,18 @@ wrapperTag: div
92
82
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
93
83
  />
94
84
  </g>
95
- <g id="Logo" transform="translate(0.000000, 0.000000)">
85
+ <g transform="translate(0.000000, 0.000000)">
96
86
  <path
97
87
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
98
- id="Rectangle-Copy-17"
99
- fill="var(--pf-t--global--color--brand--200)"
88
+ fill="#0066CC"
100
89
  />
101
90
  <path
102
91
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
103
- fill="url(#linearGradient-1)"
92
+ fill="url(#linearGradient-primary-detail-expanded-example-masthead)"
104
93
  />
105
94
  <path
106
95
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
107
- fill="url(#linearGradient-1)"
96
+ fill="url(#linearGradient-primary-detail-expanded-example-masthead)"
108
97
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
109
98
  />
110
99
  </g>
@@ -119,8 +108,38 @@ wrapperTag: div
119
108
  >
120
109
  <div class="pf-v5-c-toolbar__content">
121
110
  <div class="pf-v5-c-toolbar__content-section">
111
+ <div class="pf-v5-c-toolbar__item">
112
+ <button
113
+ class="pf-v5-c-menu-toggle"
114
+ type="button"
115
+ aria-expanded="false"
116
+ >
117
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
118
+ <span class="pf-v5-c-menu-toggle__controls">
119
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
120
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
121
+ </span>
122
+ </span>
123
+ </button>
124
+ </div>
125
+
126
+ <div class="pf-v5-c-toolbar__item">
127
+ <button
128
+ class="pf-v5-c-menu-toggle"
129
+ type="button"
130
+ aria-expanded="false"
131
+ >
132
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
133
+ <span class="pf-v5-c-menu-toggle__controls">
134
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
135
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
136
+ </span>
137
+ </span>
138
+ </button>
139
+ </div>
140
+
122
141
  <div
123
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
142
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
124
143
  >
125
144
  <div
126
145
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -167,27 +186,6 @@ wrapperTag: div
167
186
  </button>
168
187
  </div>
169
188
  </div>
170
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
171
- <button
172
- class="pf-v5-c-menu-toggle pf-m-full-height"
173
- type="button"
174
- aria-expanded="false"
175
- >
176
- <span class="pf-v5-c-menu-toggle__icon">
177
- <img
178
- class="pf-v5-c-avatar"
179
- alt="Avatar image"
180
- src="/assets/images/img_avatar-light.svg"
181
- />
182
- </span>
183
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
184
- <span class="pf-v5-c-menu-toggle__controls">
185
- <span class="pf-v5-c-menu-toggle__toggle-icon">
186
- <i class="fas fa-angle-down" aria-hidden="true"></i>
187
- </span>
188
- </span>
189
- </button>
190
- </div>
191
189
  </div>
192
190
  </div>
193
191
  </div>
@@ -1316,20 +1314,16 @@ wrapperTag: div
1316
1314
  </button>
1317
1315
  </span>
1318
1316
  <div class="pf-v5-c-masthead__main">
1319
- <a
1320
- class="pf-v5-c-masthead__brand"
1321
- href="#"
1322
- style="--pf-v5-c-brand--Height: 36px;"
1323
- >
1324
- <svg height="36px" viewBox="0 0 679 158" role="img">
1325
- <title>Patternfly logo</title>
1317
+ <a class="pf-v5-c-masthead__brand" href="#">
1318
+ <svg height="40px" viewBox="0 0 679 158">
1319
+ <title>PF-HorizontalLogo-Color</title>
1326
1320
  <defs>
1327
1321
  <linearGradient
1328
1322
  x1="68%"
1329
1323
  y1="2.25860997e-13%"
1330
1324
  x2="32%"
1331
1325
  y2="100%"
1332
- id="linearGradient-1"
1326
+ id="linearGradient-primary-detail-collapsed-example-masthead"
1333
1327
  >
1334
1328
  <stop stop-color="#2B9AF3" offset="0%" />
1335
1329
  <stop
@@ -1339,13 +1333,7 @@ wrapperTag: div
1339
1333
  />
1340
1334
  </linearGradient>
1341
1335
  </defs>
1342
- <g
1343
- id="PF-HorizontalLogo-Color"
1344
- stroke="none"
1345
- stroke-width="1"
1346
- fill="none"
1347
- fill-rule="evenodd"
1348
- >
1336
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1349
1337
  <g
1350
1338
  transform="translate(206.000000, 45.750000)"
1351
1339
  fill="var(--pf-t--global--text--color--regular)"
@@ -1380,19 +1368,18 @@ wrapperTag: div
1380
1368
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
1381
1369
  />
1382
1370
  </g>
1383
- <g id="Logo" transform="translate(0.000000, 0.000000)">
1371
+ <g transform="translate(0.000000, 0.000000)">
1384
1372
  <path
1385
1373
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
1386
- id="Rectangle-Copy-17"
1387
- fill="var(--pf-t--global--color--brand--200)"
1374
+ fill="#0066CC"
1388
1375
  />
1389
1376
  <path
1390
1377
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1391
- fill="url(#linearGradient-1)"
1378
+ fill="url(#linearGradient-primary-detail-collapsed-example-masthead)"
1392
1379
  />
1393
1380
  <path
1394
1381
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
1395
- fill="url(#linearGradient-1)"
1382
+ fill="url(#linearGradient-primary-detail-collapsed-example-masthead)"
1396
1383
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1397
1384
  />
1398
1385
  </g>
@@ -1407,8 +1394,38 @@ wrapperTag: div
1407
1394
  >
1408
1395
  <div class="pf-v5-c-toolbar__content">
1409
1396
  <div class="pf-v5-c-toolbar__content-section">
1397
+ <div class="pf-v5-c-toolbar__item">
1398
+ <button
1399
+ class="pf-v5-c-menu-toggle"
1400
+ type="button"
1401
+ aria-expanded="false"
1402
+ >
1403
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
1404
+ <span class="pf-v5-c-menu-toggle__controls">
1405
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1406
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1407
+ </span>
1408
+ </span>
1409
+ </button>
1410
+ </div>
1411
+
1412
+ <div class="pf-v5-c-toolbar__item">
1413
+ <button
1414
+ class="pf-v5-c-menu-toggle"
1415
+ type="button"
1416
+ aria-expanded="false"
1417
+ >
1418
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
1419
+ <span class="pf-v5-c-menu-toggle__controls">
1420
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1421
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1422
+ </span>
1423
+ </span>
1424
+ </button>
1425
+ </div>
1426
+
1410
1427
  <div
1411
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
1428
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
1412
1429
  >
1413
1430
  <div
1414
1431
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1455,27 +1472,6 @@ wrapperTag: div
1455
1472
  </button>
1456
1473
  </div>
1457
1474
  </div>
1458
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
1459
- <button
1460
- class="pf-v5-c-menu-toggle pf-m-full-height"
1461
- type="button"
1462
- aria-expanded="false"
1463
- >
1464
- <span class="pf-v5-c-menu-toggle__icon">
1465
- <img
1466
- class="pf-v5-c-avatar"
1467
- alt="Avatar image"
1468
- src="/assets/images/img_avatar-light.svg"
1469
- />
1470
- </span>
1471
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
1472
- <span class="pf-v5-c-menu-toggle__controls">
1473
- <span class="pf-v5-c-menu-toggle__toggle-icon">
1474
- <i class="fas fa-angle-down" aria-hidden="true"></i>
1475
- </span>
1476
- </span>
1477
- </button>
1478
- </div>
1479
1475
  </div>
1480
1476
  </div>
1481
1477
  </div>
@@ -2525,20 +2521,16 @@ wrapperTag: div
2525
2521
  </button>
2526
2522
  </span>
2527
2523
  <div class="pf-v5-c-masthead__main">
2528
- <a
2529
- class="pf-v5-c-masthead__brand"
2530
- href="#"
2531
- style="--pf-v5-c-brand--Height: 36px;"
2532
- >
2533
- <svg height="36px" viewBox="0 0 679 158" role="img">
2534
- <title>Patternfly logo</title>
2524
+ <a class="pf-v5-c-masthead__brand" href="#">
2525
+ <svg height="40px" viewBox="0 0 679 158">
2526
+ <title>PF-HorizontalLogo-Color</title>
2535
2527
  <defs>
2536
2528
  <linearGradient
2537
2529
  x1="68%"
2538
2530
  y1="2.25860997e-13%"
2539
2531
  x2="32%"
2540
2532
  y2="100%"
2541
- id="linearGradient-1"
2533
+ id="linearGradient-primary-detail-content-body-padding-example-masthead"
2542
2534
  >
2543
2535
  <stop stop-color="#2B9AF3" offset="0%" />
2544
2536
  <stop
@@ -2548,13 +2540,7 @@ wrapperTag: div
2548
2540
  />
2549
2541
  </linearGradient>
2550
2542
  </defs>
2551
- <g
2552
- id="PF-HorizontalLogo-Color"
2553
- stroke="none"
2554
- stroke-width="1"
2555
- fill="none"
2556
- fill-rule="evenodd"
2557
- >
2543
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
2558
2544
  <g
2559
2545
  transform="translate(206.000000, 45.750000)"
2560
2546
  fill="var(--pf-t--global--text--color--regular)"
@@ -2589,19 +2575,18 @@ wrapperTag: div
2589
2575
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
2590
2576
  />
2591
2577
  </g>
2592
- <g id="Logo" transform="translate(0.000000, 0.000000)">
2578
+ <g transform="translate(0.000000, 0.000000)">
2593
2579
  <path
2594
2580
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
2595
- id="Rectangle-Copy-17"
2596
- fill="var(--pf-t--global--color--brand--200)"
2581
+ fill="#0066CC"
2597
2582
  />
2598
2583
  <path
2599
2584
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
2600
- fill="url(#linearGradient-1)"
2585
+ fill="url(#linearGradient-primary-detail-content-body-padding-example-masthead)"
2601
2586
  />
2602
2587
  <path
2603
2588
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
2604
- fill="url(#linearGradient-1)"
2589
+ fill="url(#linearGradient-primary-detail-content-body-padding-example-masthead)"
2605
2590
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
2606
2591
  />
2607
2592
  </g>
@@ -2616,8 +2601,38 @@ wrapperTag: div
2616
2601
  >
2617
2602
  <div class="pf-v5-c-toolbar__content">
2618
2603
  <div class="pf-v5-c-toolbar__content-section">
2604
+ <div class="pf-v5-c-toolbar__item">
2605
+ <button
2606
+ class="pf-v5-c-menu-toggle"
2607
+ type="button"
2608
+ aria-expanded="false"
2609
+ >
2610
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
2611
+ <span class="pf-v5-c-menu-toggle__controls">
2612
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2613
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2614
+ </span>
2615
+ </span>
2616
+ </button>
2617
+ </div>
2618
+
2619
+ <div class="pf-v5-c-toolbar__item">
2620
+ <button
2621
+ class="pf-v5-c-menu-toggle"
2622
+ type="button"
2623
+ aria-expanded="false"
2624
+ >
2625
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
2626
+ <span class="pf-v5-c-menu-toggle__controls">
2627
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2628
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2629
+ </span>
2630
+ </span>
2631
+ </button>
2632
+ </div>
2633
+
2619
2634
  <div
2620
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
2635
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
2621
2636
  >
2622
2637
  <div
2623
2638
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -2664,27 +2679,6 @@ wrapperTag: div
2664
2679
  </button>
2665
2680
  </div>
2666
2681
  </div>
2667
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
2668
- <button
2669
- class="pf-v5-c-menu-toggle pf-m-full-height"
2670
- type="button"
2671
- aria-expanded="false"
2672
- >
2673
- <span class="pf-v5-c-menu-toggle__icon">
2674
- <img
2675
- class="pf-v5-c-avatar"
2676
- alt="Avatar image"
2677
- src="/assets/images/img_avatar-light.svg"
2678
- />
2679
- </span>
2680
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
2681
- <span class="pf-v5-c-menu-toggle__controls">
2682
- <span class="pf-v5-c-menu-toggle__toggle-icon">
2683
- <i class="fas fa-angle-down" aria-hidden="true"></i>
2684
- </span>
2685
- </span>
2686
- </button>
2687
- </div>
2688
2682
  </div>
2689
2683
  </div>
2690
2684
  </div>
@@ -3684,20 +3678,16 @@ wrapperTag: div
3684
3678
  </button>
3685
3679
  </span>
3686
3680
  <div class="pf-v5-c-masthead__main">
3687
- <a
3688
- class="pf-v5-c-masthead__brand"
3689
- href="#"
3690
- style="--pf-v5-c-brand--Height: 36px;"
3691
- >
3692
- <svg height="36px" viewBox="0 0 679 158" role="img">
3693
- <title>Patternfly logo</title>
3681
+ <a class="pf-v5-c-masthead__brand" href="#">
3682
+ <svg height="40px" viewBox="0 0 679 158">
3683
+ <title>PF-HorizontalLogo-Color</title>
3694
3684
  <defs>
3695
3685
  <linearGradient
3696
3686
  x1="68%"
3697
3687
  y1="2.25860997e-13%"
3698
3688
  x2="32%"
3699
3689
  y2="100%"
3700
- id="linearGradient-1"
3690
+ id="linearGradient-primary-detail-card-view-expanded-example-masthead"
3701
3691
  >
3702
3692
  <stop stop-color="#2B9AF3" offset="0%" />
3703
3693
  <stop
@@ -3707,13 +3697,7 @@ wrapperTag: div
3707
3697
  />
3708
3698
  </linearGradient>
3709
3699
  </defs>
3710
- <g
3711
- id="PF-HorizontalLogo-Color"
3712
- stroke="none"
3713
- stroke-width="1"
3714
- fill="none"
3715
- fill-rule="evenodd"
3716
- >
3700
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
3717
3701
  <g
3718
3702
  transform="translate(206.000000, 45.750000)"
3719
3703
  fill="var(--pf-t--global--text--color--regular)"
@@ -3748,19 +3732,18 @@ wrapperTag: div
3748
3732
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
3749
3733
  />
3750
3734
  </g>
3751
- <g id="Logo" transform="translate(0.000000, 0.000000)">
3735
+ <g transform="translate(0.000000, 0.000000)">
3752
3736
  <path
3753
3737
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
3754
- id="Rectangle-Copy-17"
3755
- fill="var(--pf-t--global--color--brand--200)"
3738
+ fill="#0066CC"
3756
3739
  />
3757
3740
  <path
3758
3741
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
3759
- fill="url(#linearGradient-1)"
3742
+ fill="url(#linearGradient-primary-detail-card-view-expanded-example-masthead)"
3760
3743
  />
3761
3744
  <path
3762
3745
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
3763
- fill="url(#linearGradient-1)"
3746
+ fill="url(#linearGradient-primary-detail-card-view-expanded-example-masthead)"
3764
3747
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
3765
3748
  />
3766
3749
  </g>
@@ -3775,8 +3758,38 @@ wrapperTag: div
3775
3758
  >
3776
3759
  <div class="pf-v5-c-toolbar__content">
3777
3760
  <div class="pf-v5-c-toolbar__content-section">
3761
+ <div class="pf-v5-c-toolbar__item">
3762
+ <button
3763
+ class="pf-v5-c-menu-toggle"
3764
+ type="button"
3765
+ aria-expanded="false"
3766
+ >
3767
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
3768
+ <span class="pf-v5-c-menu-toggle__controls">
3769
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
3770
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
3771
+ </span>
3772
+ </span>
3773
+ </button>
3774
+ </div>
3775
+
3776
+ <div class="pf-v5-c-toolbar__item">
3777
+ <button
3778
+ class="pf-v5-c-menu-toggle"
3779
+ type="button"
3780
+ aria-expanded="false"
3781
+ >
3782
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
3783
+ <span class="pf-v5-c-menu-toggle__controls">
3784
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
3785
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
3786
+ </span>
3787
+ </span>
3788
+ </button>
3789
+ </div>
3790
+
3778
3791
  <div
3779
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
3792
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
3780
3793
  >
3781
3794
  <div
3782
3795
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -3823,27 +3836,6 @@ wrapperTag: div
3823
3836
  </button>
3824
3837
  </div>
3825
3838
  </div>
3826
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
3827
- <button
3828
- class="pf-v5-c-menu-toggle pf-m-full-height"
3829
- type="button"
3830
- aria-expanded="false"
3831
- >
3832
- <span class="pf-v5-c-menu-toggle__icon">
3833
- <img
3834
- class="pf-v5-c-avatar"
3835
- alt="Avatar image"
3836
- src="/assets/images/img_avatar-light.svg"
3837
- />
3838
- </span>
3839
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
3840
- <span class="pf-v5-c-menu-toggle__controls">
3841
- <span class="pf-v5-c-menu-toggle__toggle-icon">
3842
- <i class="fas fa-angle-down" aria-hidden="true"></i>
3843
- </span>
3844
- </span>
3845
- </button>
3846
- </div>
3847
3839
  </div>
3848
3840
  </div>
3849
3841
  </div>
@@ -5263,20 +5255,16 @@ wrapperTag: div
5263
5255
  </button>
5264
5256
  </span>
5265
5257
  <div class="pf-v5-c-masthead__main">
5266
- <a
5267
- class="pf-v5-c-masthead__brand"
5268
- href="#"
5269
- style="--pf-v5-c-brand--Height: 36px;"
5270
- >
5271
- <svg height="36px" viewBox="0 0 679 158" role="img">
5272
- <title>Patternfly logo</title>
5258
+ <a class="pf-v5-c-masthead__brand" href="#">
5259
+ <svg height="40px" viewBox="0 0 679 158">
5260
+ <title>PF-HorizontalLogo-Color</title>
5273
5261
  <defs>
5274
5262
  <linearGradient
5275
5263
  x1="68%"
5276
5264
  y1="2.25860997e-13%"
5277
5265
  x2="32%"
5278
5266
  y2="100%"
5279
- id="linearGradient-1"
5267
+ id="linearGradient-primary-detail-card-simple-list-on-mobile-example-masthead"
5280
5268
  >
5281
5269
  <stop stop-color="#2B9AF3" offset="0%" />
5282
5270
  <stop
@@ -5286,13 +5274,7 @@ wrapperTag: div
5286
5274
  />
5287
5275
  </linearGradient>
5288
5276
  </defs>
5289
- <g
5290
- id="PF-HorizontalLogo-Color"
5291
- stroke="none"
5292
- stroke-width="1"
5293
- fill="none"
5294
- fill-rule="evenodd"
5295
- >
5277
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
5296
5278
  <g
5297
5279
  transform="translate(206.000000, 45.750000)"
5298
5280
  fill="var(--pf-t--global--text--color--regular)"
@@ -5327,19 +5309,18 @@ wrapperTag: div
5327
5309
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
5328
5310
  />
5329
5311
  </g>
5330
- <g id="Logo" transform="translate(0.000000, 0.000000)">
5312
+ <g transform="translate(0.000000, 0.000000)">
5331
5313
  <path
5332
5314
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
5333
- id="Rectangle-Copy-17"
5334
- fill="var(--pf-t--global--color--brand--200)"
5315
+ fill="#0066CC"
5335
5316
  />
5336
5317
  <path
5337
5318
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
5338
- fill="url(#linearGradient-1)"
5319
+ fill="url(#linearGradient-primary-detail-card-simple-list-on-mobile-example-masthead)"
5339
5320
  />
5340
5321
  <path
5341
5322
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
5342
- fill="url(#linearGradient-1)"
5323
+ fill="url(#linearGradient-primary-detail-card-simple-list-on-mobile-example-masthead)"
5343
5324
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
5344
5325
  />
5345
5326
  </g>
@@ -5354,8 +5335,38 @@ wrapperTag: div
5354
5335
  >
5355
5336
  <div class="pf-v5-c-toolbar__content">
5356
5337
  <div class="pf-v5-c-toolbar__content-section">
5338
+ <div class="pf-v5-c-toolbar__item">
5339
+ <button
5340
+ class="pf-v5-c-menu-toggle"
5341
+ type="button"
5342
+ aria-expanded="false"
5343
+ >
5344
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
5345
+ <span class="pf-v5-c-menu-toggle__controls">
5346
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
5347
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
5348
+ </span>
5349
+ </span>
5350
+ </button>
5351
+ </div>
5352
+
5353
+ <div class="pf-v5-c-toolbar__item">
5354
+ <button
5355
+ class="pf-v5-c-menu-toggle"
5356
+ type="button"
5357
+ aria-expanded="false"
5358
+ >
5359
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
5360
+ <span class="pf-v5-c-menu-toggle__controls">
5361
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
5362
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
5363
+ </span>
5364
+ </span>
5365
+ </button>
5366
+ </div>
5367
+
5357
5368
  <div
5358
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
5369
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
5359
5370
  >
5360
5371
  <div
5361
5372
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -5402,27 +5413,6 @@ wrapperTag: div
5402
5413
  </button>
5403
5414
  </div>
5404
5415
  </div>
5405
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
5406
- <button
5407
- class="pf-v5-c-menu-toggle pf-m-full-height"
5408
- type="button"
5409
- aria-expanded="false"
5410
- >
5411
- <span class="pf-v5-c-menu-toggle__icon">
5412
- <img
5413
- class="pf-v5-c-avatar"
5414
- alt="Avatar image"
5415
- src="/assets/images/img_avatar-light.svg"
5416
- />
5417
- </span>
5418
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
5419
- <span class="pf-v5-c-menu-toggle__controls">
5420
- <span class="pf-v5-c-menu-toggle__toggle-icon">
5421
- <i class="fas fa-angle-down" aria-hidden="true"></i>
5422
- </span>
5423
- </span>
5424
- </button>
5425
- </div>
5426
5416
  </div>
5427
5417
  </div>
5428
5418
  </div>
@@ -5718,20 +5708,16 @@ wrapperTag: div
5718
5708
  </button>
5719
5709
  </span>
5720
5710
  <div class="pf-v5-c-masthead__main">
5721
- <a
5722
- class="pf-v5-c-masthead__brand"
5723
- href="#"
5724
- style="--pf-v5-c-brand--Height: 36px;"
5725
- >
5726
- <svg height="36px" viewBox="0 0 679 158" role="img">
5727
- <title>Patternfly logo</title>
5711
+ <a class="pf-v5-c-masthead__brand" href="#">
5712
+ <svg height="40px" viewBox="0 0 679 158">
5713
+ <title>PF-HorizontalLogo-Color</title>
5728
5714
  <defs>
5729
5715
  <linearGradient
5730
5716
  x1="68%"
5731
5717
  y1="2.25860997e-13%"
5732
5718
  x2="32%"
5733
5719
  y2="100%"
5734
- id="linearGradient-1"
5720
+ id="linearGradient-primary-detail-card-data-list-example-masthead"
5735
5721
  >
5736
5722
  <stop stop-color="#2B9AF3" offset="0%" />
5737
5723
  <stop
@@ -5741,13 +5727,7 @@ wrapperTag: div
5741
5727
  />
5742
5728
  </linearGradient>
5743
5729
  </defs>
5744
- <g
5745
- id="PF-HorizontalLogo-Color"
5746
- stroke="none"
5747
- stroke-width="1"
5748
- fill="none"
5749
- fill-rule="evenodd"
5750
- >
5730
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
5751
5731
  <g
5752
5732
  transform="translate(206.000000, 45.750000)"
5753
5733
  fill="var(--pf-t--global--text--color--regular)"
@@ -5782,19 +5762,18 @@ wrapperTag: div
5782
5762
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
5783
5763
  />
5784
5764
  </g>
5785
- <g id="Logo" transform="translate(0.000000, 0.000000)">
5765
+ <g transform="translate(0.000000, 0.000000)">
5786
5766
  <path
5787
5767
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
5788
- id="Rectangle-Copy-17"
5789
- fill="var(--pf-t--global--color--brand--200)"
5768
+ fill="#0066CC"
5790
5769
  />
5791
5770
  <path
5792
5771
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
5793
- fill="url(#linearGradient-1)"
5772
+ fill="url(#linearGradient-primary-detail-card-data-list-example-masthead)"
5794
5773
  />
5795
5774
  <path
5796
5775
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
5797
- fill="url(#linearGradient-1)"
5776
+ fill="url(#linearGradient-primary-detail-card-data-list-example-masthead)"
5798
5777
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
5799
5778
  />
5800
5779
  </g>
@@ -5809,8 +5788,38 @@ wrapperTag: div
5809
5788
  >
5810
5789
  <div class="pf-v5-c-toolbar__content">
5811
5790
  <div class="pf-v5-c-toolbar__content-section">
5791
+ <div class="pf-v5-c-toolbar__item">
5792
+ <button
5793
+ class="pf-v5-c-menu-toggle"
5794
+ type="button"
5795
+ aria-expanded="false"
5796
+ >
5797
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
5798
+ <span class="pf-v5-c-menu-toggle__controls">
5799
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
5800
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
5801
+ </span>
5802
+ </span>
5803
+ </button>
5804
+ </div>
5805
+
5806
+ <div class="pf-v5-c-toolbar__item">
5807
+ <button
5808
+ class="pf-v5-c-menu-toggle"
5809
+ type="button"
5810
+ aria-expanded="false"
5811
+ >
5812
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
5813
+ <span class="pf-v5-c-menu-toggle__controls">
5814
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
5815
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
5816
+ </span>
5817
+ </span>
5818
+ </button>
5819
+ </div>
5820
+
5812
5821
  <div
5813
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
5822
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
5814
5823
  >
5815
5824
  <div
5816
5825
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -5857,27 +5866,6 @@ wrapperTag: div
5857
5866
  </button>
5858
5867
  </div>
5859
5868
  </div>
5860
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
5861
- <button
5862
- class="pf-v5-c-menu-toggle pf-m-full-height"
5863
- type="button"
5864
- aria-expanded="false"
5865
- >
5866
- <span class="pf-v5-c-menu-toggle__icon">
5867
- <img
5868
- class="pf-v5-c-avatar"
5869
- alt="Avatar image"
5870
- src="/assets/images/img_avatar-light.svg"
5871
- />
5872
- </span>
5873
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
5874
- <span class="pf-v5-c-menu-toggle__controls">
5875
- <span class="pf-v5-c-menu-toggle__toggle-icon">
5876
- <i class="fas fa-angle-down" aria-hidden="true"></i>
5877
- </span>
5878
- </span>
5879
- </button>
5880
- </div>
5881
5869
  </div>
5882
5870
  </div>
5883
5871
  </div>
@@ -6419,20 +6407,16 @@ wrapperTag: div
6419
6407
  </button>
6420
6408
  </span>
6421
6409
  <div class="pf-v5-c-masthead__main">
6422
- <a
6423
- class="pf-v5-c-masthead__brand"
6424
- href="#"
6425
- style="--pf-v5-c-brand--Height: 36px;"
6426
- >
6427
- <svg height="36px" viewBox="0 0 679 158" role="img">
6428
- <title>Patternfly logo</title>
6410
+ <a class="pf-v5-c-masthead__brand" href="#">
6411
+ <svg height="40px" viewBox="0 0 679 158">
6412
+ <title>PF-HorizontalLogo-Color</title>
6429
6413
  <defs>
6430
6414
  <linearGradient
6431
6415
  x1="68%"
6432
6416
  y1="2.25860997e-13%"
6433
6417
  x2="32%"
6434
6418
  y2="100%"
6435
- id="linearGradient-1"
6419
+ id="linearGradient-primary-detail-inline-modifier-example-masthead"
6436
6420
  >
6437
6421
  <stop stop-color="#2B9AF3" offset="0%" />
6438
6422
  <stop
@@ -6442,13 +6426,7 @@ wrapperTag: div
6442
6426
  />
6443
6427
  </linearGradient>
6444
6428
  </defs>
6445
- <g
6446
- id="PF-HorizontalLogo-Color"
6447
- stroke="none"
6448
- stroke-width="1"
6449
- fill="none"
6450
- fill-rule="evenodd"
6451
- >
6429
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
6452
6430
  <g
6453
6431
  transform="translate(206.000000, 45.750000)"
6454
6432
  fill="var(--pf-t--global--text--color--regular)"
@@ -6483,19 +6461,18 @@ wrapperTag: div
6483
6461
  d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
6484
6462
  />
6485
6463
  </g>
6486
- <g id="Logo" transform="translate(0.000000, 0.000000)">
6464
+ <g transform="translate(0.000000, 0.000000)">
6487
6465
  <path
6488
6466
  d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
6489
- id="Rectangle-Copy-17"
6490
- fill="var(--pf-t--global--color--brand--200)"
6467
+ fill="#0066CC"
6491
6468
  />
6492
6469
  <path
6493
6470
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
6494
- fill="url(#linearGradient-1)"
6471
+ fill="url(#linearGradient-primary-detail-inline-modifier-example-masthead)"
6495
6472
  />
6496
6473
  <path
6497
6474
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
6498
- fill="url(#linearGradient-1)"
6475
+ fill="url(#linearGradient-primary-detail-inline-modifier-example-masthead)"
6499
6476
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
6500
6477
  />
6501
6478
  </g>
@@ -6510,8 +6487,38 @@ wrapperTag: div
6510
6487
  >
6511
6488
  <div class="pf-v5-c-toolbar__content">
6512
6489
  <div class="pf-v5-c-toolbar__content-section">
6490
+ <div class="pf-v5-c-toolbar__item">
6491
+ <button
6492
+ class="pf-v5-c-menu-toggle"
6493
+ type="button"
6494
+ aria-expanded="false"
6495
+ >
6496
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
6497
+ <span class="pf-v5-c-menu-toggle__controls">
6498
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
6499
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
6500
+ </span>
6501
+ </span>
6502
+ </button>
6503
+ </div>
6504
+
6505
+ <div class="pf-v5-c-toolbar__item">
6506
+ <button
6507
+ class="pf-v5-c-menu-toggle"
6508
+ type="button"
6509
+ aria-expanded="false"
6510
+ >
6511
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
6512
+ <span class="pf-v5-c-menu-toggle__controls">
6513
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
6514
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
6515
+ </span>
6516
+ </span>
6517
+ </button>
6518
+ </div>
6519
+
6513
6520
  <div
6514
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
6521
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
6515
6522
  >
6516
6523
  <div
6517
6524
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -6558,27 +6565,6 @@ wrapperTag: div
6558
6565
  </button>
6559
6566
  </div>
6560
6567
  </div>
6561
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
6562
- <button
6563
- class="pf-v5-c-menu-toggle pf-m-full-height"
6564
- type="button"
6565
- aria-expanded="false"
6566
- >
6567
- <span class="pf-v5-c-menu-toggle__icon">
6568
- <img
6569
- class="pf-v5-c-avatar"
6570
- alt="Avatar image"
6571
- src="/assets/images/img_avatar-light.svg"
6572
- />
6573
- </span>
6574
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
6575
- <span class="pf-v5-c-menu-toggle__controls">
6576
- <span class="pf-v5-c-menu-toggle__toggle-icon">
6577
- <i class="fas fa-angle-down" aria-hidden="true"></i>
6578
- </span>
6579
- </span>
6580
- </button>
6581
- </div>
6582
6568
  </div>
6583
6569
  </div>
6584
6570
  </div>