@patternfly/patternfly 6.0.0-alpha.102 → 6.0.0-alpha.104
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Check/check.css +2 -2
- package/components/Check/check.scss +2 -2
- package/components/Drawer/drawer.css +5 -4
- package/components/Drawer/drawer.scss +7 -6
- package/components/Page/page.css +24 -23
- package/components/Page/page.scss +24 -23
- package/components/Table/table.css +0 -37
- package/components/Table/table.scss +0 -49
- package/docs/components/Drawer/examples/Drawer.md +2 -1
- package/docs/components/Page/deprecated/PageHeader.md +113 -99
- package/docs/components/Page/examples/Page.md +114 -100
- package/docs/demos/AboutModal/examples/AboutModal.md +81 -79
- package/docs/demos/Alert/examples/Alert.md +551 -524
- package/docs/demos/BackToTop/examples/BackToTop.md +211 -209
- package/docs/demos/Banner/examples/Banner.md +420 -412
- package/docs/demos/CardView/examples/CardView.md +1302 -1297
- package/docs/demos/ContextSelector/examples/ContextSelector.md +536 -523
- package/docs/demos/Dashboard/examples/Dashboard.md +1344 -1314
- package/docs/demos/DataList/examples/DataList.md +3006 -2958
- package/docs/demos/DescriptionList/examples/DescriptionList.md +532 -518
- package/docs/demos/Drawer/examples/Drawer.md +544 -528
- package/docs/demos/JumpLinks/examples/JumpLinks.md +915 -897
- package/docs/demos/Masthead/examples/Masthead.md +729 -711
- package/docs/demos/Modal/examples/Modal.md +486 -474
- package/docs/demos/Nav/examples/Nav.md +528 -510
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +440 -435
- package/docs/demos/Page/examples/Page.md +1656 -1633
- package/docs/demos/Page/examples/Penta.md +632 -577
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +5222 -5080
- package/docs/demos/Skeleton/examples/Skeleton.md +177 -175
- package/docs/demos/Table/examples/Table.md +14137 -13972
- package/docs/demos/Tabs/examples/Tabs.md +2206 -2138
- package/docs/demos/Toolbar/examples/Toolbar.md +1322 -1269
- package/docs/demos/Wizard/examples/Wizard.md +1571 -1553
- package/package.json +1 -1
- package/patternfly-no-globals.css +31 -66
- package/patternfly-theme-dark-unversioned.css +31 -66
- package/patternfly.css +31 -66
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -226,352 +226,358 @@ section: components
|
|
|
226
226
|
</nav>
|
|
227
227
|
</div>
|
|
228
228
|
</div>
|
|
229
|
-
<
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
<
|
|
236
|
-
<
|
|
237
|
-
<
|
|
238
|
-
<
|
|
239
|
-
<
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
<
|
|
243
|
-
<
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
247
|
-
</li>
|
|
248
|
-
<li class="pf-v6-c-breadcrumb__item">
|
|
249
|
-
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
250
|
-
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
251
|
-
</span>
|
|
252
|
-
|
|
253
|
-
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
254
|
-
</li>
|
|
255
|
-
<li class="pf-v6-c-breadcrumb__item">
|
|
256
|
-
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
257
|
-
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
258
|
-
</span>
|
|
259
|
-
|
|
260
|
-
<a
|
|
261
|
-
href="#"
|
|
262
|
-
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
263
|
-
aria-current="page"
|
|
264
|
-
>Section landing</a>
|
|
265
|
-
</li>
|
|
266
|
-
</ol>
|
|
267
|
-
</nav>
|
|
268
|
-
</div>
|
|
269
|
-
</section>
|
|
270
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
271
|
-
<div class="pf-v6-c-page__main-body">
|
|
272
|
-
<div class="pf-v6-c-content">
|
|
273
|
-
<h1>Main title</h1>
|
|
274
|
-
<p>This is a full page demo.</p>
|
|
275
|
-
</div>
|
|
276
|
-
</div>
|
|
277
|
-
</section>
|
|
229
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
230
|
+
<main
|
|
231
|
+
class="pf-v6-c-page__main"
|
|
232
|
+
tabindex="-1"
|
|
233
|
+
id="main-content-tabs-tables-and-tabs-example"
|
|
234
|
+
>
|
|
235
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
236
|
+
<div class="pf-v6-c-page__main-body">
|
|
237
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
238
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
239
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
240
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
241
|
+
</li>
|
|
242
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
243
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
244
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
245
|
+
</span>
|
|
278
246
|
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
<
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
class="pf-v6-c-tabs__link"
|
|
302
|
-
role="tab"
|
|
303
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
304
|
-
id="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
305
|
-
>
|
|
306
|
-
<span class="pf-v6-c-tabs__item-text">YAML</span>
|
|
307
|
-
</button>
|
|
308
|
-
</li>
|
|
309
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
310
|
-
<button
|
|
311
|
-
type="button"
|
|
312
|
-
class="pf-v6-c-tabs__link"
|
|
313
|
-
role="tab"
|
|
314
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
315
|
-
id="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
316
|
-
>
|
|
317
|
-
<span class="pf-v6-c-tabs__item-text">Environment</span>
|
|
318
|
-
</button>
|
|
319
|
-
</li>
|
|
320
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
321
|
-
<button
|
|
322
|
-
type="button"
|
|
323
|
-
class="pf-v6-c-tabs__link"
|
|
324
|
-
role="tab"
|
|
325
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
326
|
-
id="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
327
|
-
>
|
|
328
|
-
<span class="pf-v6-c-tabs__item-text">Logs</span>
|
|
329
|
-
</button>
|
|
330
|
-
</li>
|
|
331
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
332
|
-
<button
|
|
333
|
-
type="button"
|
|
334
|
-
class="pf-v6-c-tabs__link"
|
|
335
|
-
role="tab"
|
|
336
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
337
|
-
id="tabs-tables-and-tabs-example-tabs-events-link"
|
|
338
|
-
>
|
|
339
|
-
<span class="pf-v6-c-tabs__item-text">Events</span>
|
|
340
|
-
</button>
|
|
341
|
-
</li>
|
|
342
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
343
|
-
<button
|
|
344
|
-
type="button"
|
|
345
|
-
class="pf-v6-c-tabs__link"
|
|
346
|
-
role="tab"
|
|
347
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
348
|
-
id="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
349
|
-
>
|
|
350
|
-
<span class="pf-v6-c-tabs__item-text">Terminal</span>
|
|
351
|
-
</button>
|
|
352
|
-
</li>
|
|
353
|
-
</ul>
|
|
247
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
248
|
+
</li>
|
|
249
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
250
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
251
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
252
|
+
</span>
|
|
253
|
+
|
|
254
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
255
|
+
</li>
|
|
256
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
257
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
258
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
259
|
+
</span>
|
|
260
|
+
|
|
261
|
+
<a
|
|
262
|
+
href="#"
|
|
263
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
264
|
+
aria-current="page"
|
|
265
|
+
>Section landing</a>
|
|
266
|
+
</li>
|
|
267
|
+
</ol>
|
|
268
|
+
</nav>
|
|
354
269
|
</div>
|
|
355
|
-
</
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
>
|
|
367
|
-
<div
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
aria-
|
|
270
|
+
</section>
|
|
271
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
272
|
+
<div class="pf-v6-c-page__main-body">
|
|
273
|
+
<div class="pf-v6-c-content">
|
|
274
|
+
<h1>Main title</h1>
|
|
275
|
+
<p>This is a full page demo.</p>
|
|
276
|
+
</div>
|
|
277
|
+
</div>
|
|
278
|
+
</section>
|
|
279
|
+
|
|
280
|
+
<section class="pf-v6-c-page__main-tabs pf-m-limit-width">
|
|
281
|
+
<div class="pf-v6-c-page__main-body">
|
|
282
|
+
<div
|
|
283
|
+
class="pf-v6-c-tabs pf-m-page-insets"
|
|
284
|
+
role="region"
|
|
285
|
+
id="tabs-tables-and-tabs-example-tabs"
|
|
286
|
+
>
|
|
287
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
288
|
+
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
289
|
+
<button
|
|
290
|
+
type="button"
|
|
291
|
+
class="pf-v6-c-tabs__link"
|
|
292
|
+
role="tab"
|
|
293
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-details-panel"
|
|
294
|
+
id="tabs-tables-and-tabs-example-tabs-details-link"
|
|
379
295
|
>
|
|
380
|
-
<
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
296
|
+
<span class="pf-v6-c-tabs__item-text">Details</span>
|
|
297
|
+
</button>
|
|
298
|
+
</li>
|
|
299
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
300
|
+
<button
|
|
301
|
+
type="button"
|
|
302
|
+
class="pf-v6-c-tabs__link"
|
|
303
|
+
role="tab"
|
|
304
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
305
|
+
id="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
306
|
+
>
|
|
307
|
+
<span class="pf-v6-c-tabs__item-text">YAML</span>
|
|
308
|
+
</button>
|
|
309
|
+
</li>
|
|
310
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
311
|
+
<button
|
|
312
|
+
type="button"
|
|
313
|
+
class="pf-v6-c-tabs__link"
|
|
314
|
+
role="tab"
|
|
315
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
316
|
+
id="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
317
|
+
>
|
|
318
|
+
<span class="pf-v6-c-tabs__item-text">Environment</span>
|
|
319
|
+
</button>
|
|
320
|
+
</li>
|
|
321
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
322
|
+
<button
|
|
323
|
+
type="button"
|
|
324
|
+
class="pf-v6-c-tabs__link"
|
|
325
|
+
role="tab"
|
|
326
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
327
|
+
id="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
328
|
+
>
|
|
329
|
+
<span class="pf-v6-c-tabs__item-text">Logs</span>
|
|
330
|
+
</button>
|
|
331
|
+
</li>
|
|
332
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
333
|
+
<button
|
|
334
|
+
type="button"
|
|
335
|
+
class="pf-v6-c-tabs__link"
|
|
336
|
+
role="tab"
|
|
337
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
338
|
+
id="tabs-tables-and-tabs-example-tabs-events-link"
|
|
339
|
+
>
|
|
340
|
+
<span class="pf-v6-c-tabs__item-text">Events</span>
|
|
341
|
+
</button>
|
|
342
|
+
</li>
|
|
343
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
344
|
+
<button
|
|
345
|
+
type="button"
|
|
346
|
+
class="pf-v6-c-tabs__link"
|
|
347
|
+
role="tab"
|
|
348
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
349
|
+
id="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
350
|
+
>
|
|
351
|
+
<span class="pf-v6-c-tabs__item-text">Terminal</span>
|
|
352
|
+
</button>
|
|
353
|
+
</li>
|
|
354
|
+
</ul>
|
|
355
|
+
</div>
|
|
356
|
+
</div>
|
|
357
|
+
</section>
|
|
358
|
+
|
|
359
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
360
|
+
<div class="pf-v6-c-page__main-body">
|
|
361
|
+
<section
|
|
362
|
+
class="pf-v6-c-tab-content"
|
|
363
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-details-link"
|
|
364
|
+
id="tabs-tables-and-tabs-example-tabs-details-panel"
|
|
365
|
+
role="tabpanel"
|
|
366
|
+
tabindex="0"
|
|
367
|
+
>
|
|
368
|
+
<div class="pf-v6-c-tab-content__body">
|
|
369
|
+
<div class="pf-v6-l-flex pf-m-column">
|
|
370
|
+
<div class="pf-v6-l-flex__item pf-m-spacer-lg">
|
|
371
|
+
<h2
|
|
372
|
+
class="pf-v6-c-title pf-m-lg pf-v5-u-mt-sm"
|
|
373
|
+
id="-details-title"
|
|
374
|
+
>Pod details</h2>
|
|
375
|
+
</div>
|
|
376
|
+
<div class="pf-v6-l-flex__item">
|
|
377
|
+
<dl
|
|
378
|
+
class="pf-v6-c-description-list pf-m-2-col-on-lg"
|
|
379
|
+
aria-labelledby="-details-title"
|
|
380
|
+
>
|
|
381
|
+
<div class="pf-v6-c-description-list__group">
|
|
382
|
+
<dt class="pf-v6-c-description-list__term">Name</dt>
|
|
383
|
+
<dd class="pf-v6-c-description-list__description">
|
|
384
|
+
<div
|
|
385
|
+
class="pf-v6-c-description-list__text"
|
|
386
|
+
>3scale-control-fccb6ddb9-phyqv9</div>
|
|
387
|
+
</dd>
|
|
388
|
+
</div>
|
|
389
|
+
<div class="pf-v6-c-description-list__group">
|
|
390
|
+
<dt class="pf-v6-c-description-list__term">Status</dt>
|
|
391
|
+
<dd class="pf-v6-c-description-list__description">
|
|
392
|
+
<div class="pf-v6-c-description-list__text">
|
|
393
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
394
|
+
<div class="pf-v6-l-flex__item">
|
|
395
|
+
<i
|
|
396
|
+
class="fas fa-fw fa-check-circle"
|
|
397
|
+
aria-hidden="true"
|
|
398
|
+
></i>
|
|
399
|
+
</div>
|
|
400
|
+
<div class="pf-v6-l-flex__item">Running</div>
|
|
398
401
|
</div>
|
|
399
|
-
<div class="pf-v6-l-flex__item">Running</div>
|
|
400
402
|
</div>
|
|
401
|
-
</
|
|
402
|
-
</
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
403
|
+
</dd>
|
|
404
|
+
</div>
|
|
405
|
+
<div class="pf-v6-c-description-list__group">
|
|
406
|
+
<dt class="pf-v6-c-description-list__term">Namespace</dt>
|
|
407
|
+
<dd class="pf-v6-c-description-list__description">
|
|
408
|
+
<div class="pf-v6-c-description-list__text">
|
|
409
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
410
|
+
<div class="pf-v6-l-flex__item">
|
|
411
|
+
<span class="pf-v6-c-label pf-m-cyan">
|
|
412
|
+
<span class="pf-v6-c-label__content">
|
|
413
|
+
<span class="pf-v6-c-label__text">NS</span>
|
|
414
|
+
</span>
|
|
413
415
|
</span>
|
|
414
|
-
</
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
416
|
+
</div>
|
|
417
|
+
<div class="pf-v6-l-flex__item">
|
|
418
|
+
<a href="#">knative-serving-ingress</a>
|
|
419
|
+
</div>
|
|
418
420
|
</div>
|
|
419
421
|
</div>
|
|
420
|
-
</
|
|
421
|
-
</
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
<
|
|
431
|
-
|
|
432
|
-
<
|
|
433
|
-
<div class="pf-v6-c-
|
|
434
|
-
<div class="pf-v6-c-label-
|
|
435
|
-
<
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
<
|
|
442
|
-
<span class="pf-v6-c-
|
|
443
|
-
<span
|
|
444
|
-
|
|
445
|
-
|
|
422
|
+
</dd>
|
|
423
|
+
</div>
|
|
424
|
+
<div class="pf-v6-c-description-list__group">
|
|
425
|
+
<dt class="pf-v6-c-description-list__term">Restart policy</dt>
|
|
426
|
+
<dd class="pf-v6-c-description-list__description">
|
|
427
|
+
<div
|
|
428
|
+
class="pf-v6-c-description-list__text"
|
|
429
|
+
>Always restart</div>
|
|
430
|
+
</dd>
|
|
431
|
+
</div>
|
|
432
|
+
<div class="pf-v6-c-description-list__group">
|
|
433
|
+
<dt class="pf-v6-c-description-list__term">Labels</dt>
|
|
434
|
+
<dd class="pf-v6-c-description-list__description">
|
|
435
|
+
<div class="pf-v6-c-description-list__text">
|
|
436
|
+
<div class="pf-v6-c-label-group">
|
|
437
|
+
<div class="pf-v6-c-label-group__main">
|
|
438
|
+
<ul
|
|
439
|
+
class="pf-v6-c-label-group__list"
|
|
440
|
+
role="list"
|
|
441
|
+
aria-label="Group of labels"
|
|
442
|
+
>
|
|
443
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
444
|
+
<span class="pf-v6-c-label pf-m-outline">
|
|
445
|
+
<span class="pf-v6-c-label__content">
|
|
446
|
+
<span
|
|
447
|
+
class="pf-v6-c-label__text"
|
|
448
|
+
>app=3scale-gateway</span>
|
|
449
|
+
</span>
|
|
446
450
|
</span>
|
|
447
|
-
</
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
451
|
+
</li>
|
|
452
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
453
|
+
<span class="pf-v6-c-label pf-m-outline">
|
|
454
|
+
<span class="pf-v6-c-label__content">
|
|
455
|
+
<span
|
|
456
|
+
class="pf-v6-c-label__text"
|
|
457
|
+
>pod-template-has=6747686899</span>
|
|
458
|
+
</span>
|
|
455
459
|
</span>
|
|
456
|
-
</
|
|
457
|
-
</
|
|
458
|
-
</
|
|
460
|
+
</li>
|
|
461
|
+
</ul>
|
|
462
|
+
</div>
|
|
459
463
|
</div>
|
|
460
464
|
</div>
|
|
461
|
-
</
|
|
462
|
-
</
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
<
|
|
474
|
-
|
|
475
|
-
<
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
<
|
|
480
|
-
|
|
481
|
-
<
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
<
|
|
486
|
-
|
|
487
|
-
<
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
<
|
|
492
|
-
|
|
493
|
-
<
|
|
494
|
-
<div class="pf-v6-
|
|
495
|
-
<div class="pf-v6-l-
|
|
496
|
-
<
|
|
497
|
-
<span class="pf-v6-c-
|
|
498
|
-
<span class="pf-v6-c-
|
|
465
|
+
</dd>
|
|
466
|
+
</div>
|
|
467
|
+
<div class="pf-v6-c-description-list__group">
|
|
468
|
+
<dt
|
|
469
|
+
class="pf-v6-c-description-list__term"
|
|
470
|
+
>Active deadline seconds</dt>
|
|
471
|
+
<dd class="pf-v6-c-description-list__description">
|
|
472
|
+
<div
|
|
473
|
+
class="pf-v6-c-description-list__text"
|
|
474
|
+
>Not configured</div>
|
|
475
|
+
</dd>
|
|
476
|
+
</div>
|
|
477
|
+
<div class="pf-v6-c-description-list__group">
|
|
478
|
+
<dt class="pf-v6-c-description-list__term">Tolerations</dt>
|
|
479
|
+
<dd class="pf-v6-c-description-list__description">
|
|
480
|
+
<div class="pf-v6-c-description-list__text">stuff</div>
|
|
481
|
+
</dd>
|
|
482
|
+
</div>
|
|
483
|
+
<div class="pf-v6-c-description-list__group">
|
|
484
|
+
<dt class="pf-v6-c-description-list__term">Pod IP</dt>
|
|
485
|
+
<dd class="pf-v6-c-description-list__description">
|
|
486
|
+
<div class="pf-v6-c-description-list__text">10.345.2.197</div>
|
|
487
|
+
</dd>
|
|
488
|
+
</div>
|
|
489
|
+
<div class="pf-v6-c-description-list__group">
|
|
490
|
+
<dt class="pf-v6-c-description-list__term">Annotations</dt>
|
|
491
|
+
<dd class="pf-v6-c-description-list__description">
|
|
492
|
+
<div class="pf-v6-c-description-list__text">stuff</div>
|
|
493
|
+
</dd>
|
|
494
|
+
</div>
|
|
495
|
+
<div class="pf-v6-c-description-list__group">
|
|
496
|
+
<dt class="pf-v6-c-description-list__term">Node</dt>
|
|
497
|
+
<dd class="pf-v6-c-description-list__description">
|
|
498
|
+
<div class="pf-v6-c-description-list__text">
|
|
499
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
500
|
+
<div class="pf-v6-l-flex__item">
|
|
501
|
+
<span class="pf-v6-c-label pf-m-purple">
|
|
502
|
+
<span class="pf-v6-c-label__content">
|
|
503
|
+
<span class="pf-v6-c-label__text">N</span>
|
|
504
|
+
</span>
|
|
499
505
|
</span>
|
|
500
|
-
</
|
|
506
|
+
</div>
|
|
507
|
+
<div
|
|
508
|
+
class="pf-v6-l-flex__item"
|
|
509
|
+
>ip-10-0-233-118.us-east-2.computer.external</div>
|
|
501
510
|
</div>
|
|
502
|
-
<div
|
|
503
|
-
class="pf-v6-l-flex__item"
|
|
504
|
-
>ip-10-0-233-118.us-east-2.computer.external</div>
|
|
505
511
|
</div>
|
|
506
|
-
</
|
|
507
|
-
</
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
</
|
|
515
|
-
</
|
|
516
|
-
</
|
|
517
|
-
</
|
|
512
|
+
</dd>
|
|
513
|
+
</div>
|
|
514
|
+
<div class="pf-v6-c-description-list__group">
|
|
515
|
+
<dt class="pf-v6-c-description-list__term">Created at</dt>
|
|
516
|
+
<dd class="pf-v6-c-description-list__description">
|
|
517
|
+
<div class="pf-v6-c-description-list__text">
|
|
518
|
+
<time>Oct 15, 1:51 pm</time>
|
|
519
|
+
</div>
|
|
520
|
+
</dd>
|
|
521
|
+
</div>
|
|
522
|
+
</dl>
|
|
523
|
+
</div>
|
|
518
524
|
</div>
|
|
519
525
|
</div>
|
|
520
|
-
</
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
</
|
|
572
|
-
</
|
|
573
|
-
</
|
|
574
|
-
</
|
|
526
|
+
</section>
|
|
527
|
+
<section
|
|
528
|
+
class="pf-v6-c-tab-content"
|
|
529
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
530
|
+
id="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
531
|
+
role="tabpanel"
|
|
532
|
+
tabindex="0"
|
|
533
|
+
hidden
|
|
534
|
+
>
|
|
535
|
+
<div class="pf-v6-c-tab-content__body">YAML panel</div>
|
|
536
|
+
</section>
|
|
537
|
+
<section
|
|
538
|
+
class="pf-v6-c-tab-content"
|
|
539
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
540
|
+
id="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
541
|
+
role="tabpanel"
|
|
542
|
+
tabindex="0"
|
|
543
|
+
hidden
|
|
544
|
+
>
|
|
545
|
+
<div class="pf-v6-c-tab-content__body">Environment panel</div>
|
|
546
|
+
</section>
|
|
547
|
+
<section
|
|
548
|
+
class="pf-v6-c-tab-content"
|
|
549
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
550
|
+
id="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
551
|
+
role="tabpanel"
|
|
552
|
+
tabindex="0"
|
|
553
|
+
hidden
|
|
554
|
+
>
|
|
555
|
+
<div class="pf-v6-c-tab-content__body">Logs panel</div>
|
|
556
|
+
</section>
|
|
557
|
+
<section
|
|
558
|
+
class="pf-v6-c-tab-content"
|
|
559
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-events-link"
|
|
560
|
+
id="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
561
|
+
role="tabpanel"
|
|
562
|
+
tabindex="0"
|
|
563
|
+
hidden
|
|
564
|
+
>
|
|
565
|
+
<div class="pf-v6-c-tab-content__body">Events panel</div>
|
|
566
|
+
</section>
|
|
567
|
+
<section
|
|
568
|
+
class="pf-v6-c-tab-content"
|
|
569
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
570
|
+
id="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
571
|
+
role="tabpanel"
|
|
572
|
+
tabindex="0"
|
|
573
|
+
hidden
|
|
574
|
+
>
|
|
575
|
+
<div class="pf-v6-c-tab-content__body">Terminal panel</div>
|
|
576
|
+
</section>
|
|
577
|
+
</div>
|
|
578
|
+
</section>
|
|
579
|
+
</main>
|
|
580
|
+
</div>
|
|
575
581
|
</div>
|
|
576
582
|
|
|
577
583
|
```
|
|
@@ -799,357 +805,361 @@ section: components
|
|
|
799
805
|
</nav>
|
|
800
806
|
</div>
|
|
801
807
|
</div>
|
|
802
|
-
<
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
<
|
|
809
|
-
<
|
|
810
|
-
<
|
|
811
|
-
<
|
|
812
|
-
<
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
<
|
|
816
|
-
<
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
<
|
|
823
|
-
<
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
<
|
|
830
|
-
<
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
</section>
|
|
843
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
844
|
-
<div class="pf-v6-c-page__main-body">
|
|
845
|
-
<div class="pf-v6-c-content">
|
|
846
|
-
<h1>Main title</h1>
|
|
847
|
-
<p>This is a full page demo.</p>
|
|
808
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
809
|
+
<main
|
|
810
|
+
class="pf-v6-c-page__main"
|
|
811
|
+
tabindex="-1"
|
|
812
|
+
id="main-content-tabs-tables-and-tabs-example"
|
|
813
|
+
>
|
|
814
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
815
|
+
<div class="pf-v6-c-page__main-body">
|
|
816
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
817
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
818
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
819
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
820
|
+
</li>
|
|
821
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
822
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
823
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
824
|
+
</span>
|
|
825
|
+
|
|
826
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
827
|
+
</li>
|
|
828
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
829
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
830
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
831
|
+
</span>
|
|
832
|
+
|
|
833
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
834
|
+
</li>
|
|
835
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
836
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
837
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
838
|
+
</span>
|
|
839
|
+
|
|
840
|
+
<a
|
|
841
|
+
href="#"
|
|
842
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
843
|
+
aria-current="page"
|
|
844
|
+
>Section landing</a>
|
|
845
|
+
</li>
|
|
846
|
+
</ol>
|
|
847
|
+
</nav>
|
|
848
848
|
</div>
|
|
849
|
-
</
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
id="tabs-tables-and-tabs-example-tabs"
|
|
857
|
-
>
|
|
858
|
-
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
859
|
-
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
860
|
-
<button
|
|
861
|
-
type="button"
|
|
862
|
-
class="pf-v6-c-tabs__link"
|
|
863
|
-
role="tab"
|
|
864
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-details-panel"
|
|
865
|
-
id="tabs-tables-and-tabs-example-tabs-details-link"
|
|
866
|
-
>
|
|
867
|
-
<span class="pf-v6-c-tabs__item-text">Details</span>
|
|
868
|
-
</button>
|
|
869
|
-
</li>
|
|
870
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
871
|
-
<button
|
|
872
|
-
type="button"
|
|
873
|
-
class="pf-v6-c-tabs__link"
|
|
874
|
-
role="tab"
|
|
875
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
876
|
-
id="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
877
|
-
>
|
|
878
|
-
<span class="pf-v6-c-tabs__item-text">YAML</span>
|
|
879
|
-
</button>
|
|
880
|
-
</li>
|
|
881
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
882
|
-
<button
|
|
883
|
-
type="button"
|
|
884
|
-
class="pf-v6-c-tabs__link"
|
|
885
|
-
role="tab"
|
|
886
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
887
|
-
id="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
888
|
-
>
|
|
889
|
-
<span class="pf-v6-c-tabs__item-text">Environment</span>
|
|
890
|
-
</button>
|
|
891
|
-
</li>
|
|
892
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
893
|
-
<button
|
|
894
|
-
type="button"
|
|
895
|
-
class="pf-v6-c-tabs__link"
|
|
896
|
-
role="tab"
|
|
897
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
898
|
-
id="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
899
|
-
>
|
|
900
|
-
<span class="pf-v6-c-tabs__item-text">Logs</span>
|
|
901
|
-
</button>
|
|
902
|
-
</li>
|
|
903
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
904
|
-
<button
|
|
905
|
-
type="button"
|
|
906
|
-
class="pf-v6-c-tabs__link"
|
|
907
|
-
role="tab"
|
|
908
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
909
|
-
id="tabs-tables-and-tabs-example-tabs-events-link"
|
|
910
|
-
>
|
|
911
|
-
<span class="pf-v6-c-tabs__item-text">Events</span>
|
|
912
|
-
</button>
|
|
913
|
-
</li>
|
|
914
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
915
|
-
<button
|
|
916
|
-
type="button"
|
|
917
|
-
class="pf-v6-c-tabs__link"
|
|
918
|
-
role="tab"
|
|
919
|
-
aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
920
|
-
id="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
921
|
-
>
|
|
922
|
-
<span class="pf-v6-c-tabs__item-text">Terminal</span>
|
|
923
|
-
</button>
|
|
924
|
-
</li>
|
|
925
|
-
</ul>
|
|
849
|
+
</section>
|
|
850
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
851
|
+
<div class="pf-v6-c-page__main-body">
|
|
852
|
+
<div class="pf-v6-c-content">
|
|
853
|
+
<h1>Main title</h1>
|
|
854
|
+
<p>This is a full page demo.</p>
|
|
855
|
+
</div>
|
|
926
856
|
</div>
|
|
927
|
-
</
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
>
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
>
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
857
|
+
</section>
|
|
858
|
+
<section class="pf-v6-c-page__main-tabs pf-m-limit-width">
|
|
859
|
+
<div class="pf-v6-c-page__main-body">
|
|
860
|
+
<div
|
|
861
|
+
class="pf-v6-c-tabs pf-m-page-insets"
|
|
862
|
+
role="region"
|
|
863
|
+
id="tabs-tables-and-tabs-example-tabs"
|
|
864
|
+
>
|
|
865
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
866
|
+
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
867
|
+
<button
|
|
868
|
+
type="button"
|
|
869
|
+
class="pf-v6-c-tabs__link"
|
|
870
|
+
role="tab"
|
|
871
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-details-panel"
|
|
872
|
+
id="tabs-tables-and-tabs-example-tabs-details-link"
|
|
873
|
+
>
|
|
874
|
+
<span class="pf-v6-c-tabs__item-text">Details</span>
|
|
875
|
+
</button>
|
|
876
|
+
</li>
|
|
877
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
878
|
+
<button
|
|
879
|
+
type="button"
|
|
880
|
+
class="pf-v6-c-tabs__link"
|
|
881
|
+
role="tab"
|
|
882
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
883
|
+
id="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
884
|
+
>
|
|
885
|
+
<span class="pf-v6-c-tabs__item-text">YAML</span>
|
|
886
|
+
</button>
|
|
887
|
+
</li>
|
|
888
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
889
|
+
<button
|
|
890
|
+
type="button"
|
|
891
|
+
class="pf-v6-c-tabs__link"
|
|
892
|
+
role="tab"
|
|
893
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
894
|
+
id="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
895
|
+
>
|
|
896
|
+
<span class="pf-v6-c-tabs__item-text">Environment</span>
|
|
897
|
+
</button>
|
|
898
|
+
</li>
|
|
899
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
900
|
+
<button
|
|
901
|
+
type="button"
|
|
902
|
+
class="pf-v6-c-tabs__link"
|
|
903
|
+
role="tab"
|
|
904
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
905
|
+
id="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
906
|
+
>
|
|
907
|
+
<span class="pf-v6-c-tabs__item-text">Logs</span>
|
|
908
|
+
</button>
|
|
909
|
+
</li>
|
|
910
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
911
|
+
<button
|
|
912
|
+
type="button"
|
|
913
|
+
class="pf-v6-c-tabs__link"
|
|
914
|
+
role="tab"
|
|
915
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
916
|
+
id="tabs-tables-and-tabs-example-tabs-events-link"
|
|
917
|
+
>
|
|
918
|
+
<span class="pf-v6-c-tabs__item-text">Events</span>
|
|
919
|
+
</button>
|
|
920
|
+
</li>
|
|
921
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
922
|
+
<button
|
|
923
|
+
type="button"
|
|
924
|
+
class="pf-v6-c-tabs__link"
|
|
925
|
+
role="tab"
|
|
926
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
927
|
+
id="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
928
|
+
>
|
|
929
|
+
<span class="pf-v6-c-tabs__item-text">Terminal</span>
|
|
930
|
+
</button>
|
|
931
|
+
</li>
|
|
932
|
+
</ul>
|
|
933
|
+
</div>
|
|
962
934
|
</div>
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
935
|
+
</section>
|
|
936
|
+
<section
|
|
937
|
+
class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light pf-m-no-padding"
|
|
938
|
+
>
|
|
939
|
+
<div class="pf-v6-c-page__main-body">
|
|
940
|
+
<div
|
|
941
|
+
class="pf-v6-c-tabs pf-m-secondary pf-m-page-insets"
|
|
942
|
+
role="region"
|
|
943
|
+
id="tabs-tables-and-tabs-example-tabs-secondary"
|
|
944
|
+
>
|
|
945
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
946
|
+
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
947
|
+
<button
|
|
948
|
+
type="button"
|
|
949
|
+
class="pf-v6-c-tabs__link"
|
|
950
|
+
role="tab"
|
|
951
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-secondary-pod-info-panel"
|
|
952
|
+
id="tabs-tables-and-tabs-example-tabs-secondary-pod-info-link"
|
|
953
|
+
>
|
|
954
|
+
<span class="pf-v6-c-tabs__item-text">Pod information</span>
|
|
955
|
+
</button>
|
|
956
|
+
</li>
|
|
957
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
958
|
+
<button
|
|
959
|
+
type="button"
|
|
960
|
+
class="pf-v6-c-tabs__link"
|
|
961
|
+
role="tab"
|
|
962
|
+
aria-controls="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-panel"
|
|
963
|
+
id="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-link"
|
|
964
|
+
>
|
|
965
|
+
<span class="pf-v6-c-tabs__item-text">Editable Aspects</span>
|
|
966
|
+
</button>
|
|
967
|
+
</li>
|
|
968
|
+
</ul>
|
|
969
|
+
</div>
|
|
970
|
+
<section
|
|
971
|
+
class="pf-v6-c-tab-content"
|
|
972
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-details-link"
|
|
973
|
+
id="tabs-tables-and-tabs-example-tabs-details-panel"
|
|
974
|
+
role="tabpanel"
|
|
975
|
+
tabindex="0"
|
|
976
|
+
>
|
|
977
|
+
<div class="pf-v6-c-tab-content__body pf-m-padding">
|
|
978
|
+
<section
|
|
979
|
+
class="pf-v6-c-tab-content"
|
|
980
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-secondary-pod-info-link"
|
|
981
|
+
id="tabs-tables-and-tabs-example-tabs-secondary-pod-info-panel"
|
|
982
|
+
role="tabpanel"
|
|
983
|
+
tabindex="0"
|
|
984
|
+
>
|
|
985
|
+
<div class="pf-v6-c-tab-content__body">
|
|
986
|
+
<div class="pf-v6-l-flex pf-m-column">
|
|
987
|
+
<div class="pf-v6-l-flex__item">
|
|
988
|
+
<dl
|
|
989
|
+
class="pf-v6-c-description-list pf-m-2-col-on-lg"
|
|
990
|
+
aria-label="Pod information list"
|
|
991
|
+
>
|
|
992
|
+
<div class="pf-v6-c-description-list__group">
|
|
993
|
+
<dt class="pf-v6-c-description-list__term">Name</dt>
|
|
994
|
+
<dd class="pf-v6-c-description-list__description">
|
|
995
|
+
<div
|
|
996
|
+
class="pf-v6-c-description-list__text"
|
|
997
|
+
>3scale-control-fccb6ddb9-phyqv9</div>
|
|
998
|
+
</dd>
|
|
999
|
+
</div>
|
|
1000
|
+
<div class="pf-v6-c-description-list__group">
|
|
1001
|
+
<dt class="pf-v6-c-description-list__term">Status</dt>
|
|
1002
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1003
|
+
<div class="pf-v6-c-description-list__text">
|
|
1004
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
1005
|
+
<div class="pf-v6-l-flex__item">
|
|
1006
|
+
<i
|
|
1007
|
+
class="fas fa-fw fa-check-circle"
|
|
1008
|
+
aria-hidden="true"
|
|
1009
|
+
></i>
|
|
1010
|
+
</div>
|
|
1011
|
+
<div class="pf-v6-l-flex__item">Running</div>
|
|
1003
1012
|
</div>
|
|
1004
|
-
<div class="pf-v6-l-flex__item">Running</div>
|
|
1005
1013
|
</div>
|
|
1006
|
-
</
|
|
1007
|
-
</
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1014
|
+
</dd>
|
|
1015
|
+
</div>
|
|
1016
|
+
<div class="pf-v6-c-description-list__group">
|
|
1017
|
+
<dt class="pf-v6-c-description-list__term">Namespace</dt>
|
|
1018
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1019
|
+
<div class="pf-v6-c-description-list__text">
|
|
1020
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
1021
|
+
<div class="pf-v6-l-flex__item">
|
|
1022
|
+
<span class="pf-v6-c-label pf-m-cyan">
|
|
1023
|
+
<span class="pf-v6-c-label__content">
|
|
1024
|
+
<span class="pf-v6-c-label__text">NS</span>
|
|
1025
|
+
</span>
|
|
1018
1026
|
</span>
|
|
1019
|
-
</
|
|
1027
|
+
</div>
|
|
1028
|
+
<div class="pf-v6-l-flex__item">
|
|
1029
|
+
<a href="#">knative-serving-ingress</a>
|
|
1030
|
+
</div>
|
|
1020
1031
|
</div>
|
|
1021
|
-
|
|
1022
|
-
|
|
1032
|
+
</div>
|
|
1033
|
+
</dd>
|
|
1034
|
+
</div>
|
|
1035
|
+
<div class="pf-v6-c-description-list__group">
|
|
1036
|
+
<dt
|
|
1037
|
+
class="pf-v6-c-description-list__term"
|
|
1038
|
+
>Restart policy</dt>
|
|
1039
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1040
|
+
<div
|
|
1041
|
+
class="pf-v6-c-description-list__text"
|
|
1042
|
+
>Always restart</div>
|
|
1043
|
+
</dd>
|
|
1044
|
+
</div>
|
|
1045
|
+
<div class="pf-v6-c-description-list__group">
|
|
1046
|
+
<dt class="pf-v6-c-description-list__term">Pod IP</dt>
|
|
1047
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1048
|
+
<div
|
|
1049
|
+
class="pf-v6-c-description-list__text"
|
|
1050
|
+
>10.345.2.197</div>
|
|
1051
|
+
</dd>
|
|
1052
|
+
</div>
|
|
1053
|
+
<div class="pf-v6-c-description-list__group">
|
|
1054
|
+
<dt
|
|
1055
|
+
class="pf-v6-c-description-list__term"
|
|
1056
|
+
>Active deadline seconds</dt>
|
|
1057
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1058
|
+
<div
|
|
1059
|
+
class="pf-v6-c-description-list__text"
|
|
1060
|
+
>Not configured</div>
|
|
1061
|
+
</dd>
|
|
1062
|
+
</div>
|
|
1063
|
+
<div class="pf-v6-c-description-list__group">
|
|
1064
|
+
<dt class="pf-v6-c-description-list__term">Created at</dt>
|
|
1065
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1066
|
+
<div class="pf-v6-c-description-list__text">
|
|
1067
|
+
<time>Oct 15, 1:51 pm</time>
|
|
1068
|
+
</div>
|
|
1069
|
+
</dd>
|
|
1070
|
+
</div>
|
|
1071
|
+
<div class="pf-v6-c-description-list__group">
|
|
1072
|
+
<dt class="pf-v6-c-description-list__term">Node</dt>
|
|
1073
|
+
<dd class="pf-v6-c-description-list__description">
|
|
1074
|
+
<div class="pf-v6-c-description-list__text">
|
|
1075
|
+
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
1076
|
+
<div class="pf-v6-l-flex__item">
|
|
1077
|
+
<span class="pf-v6-c-label pf-m-purple">
|
|
1078
|
+
<span class="pf-v6-c-label__content">
|
|
1079
|
+
<span class="pf-v6-c-label__text">N</span>
|
|
1080
|
+
</span>
|
|
1081
|
+
</span>
|
|
1082
|
+
</div>
|
|
1083
|
+
<div
|
|
1084
|
+
class="pf-v6-l-flex__item"
|
|
1085
|
+
>ip-10-0-233-118.us-east-2.computer.external</div>
|
|
1023
1086
|
</div>
|
|
1024
1087
|
</div>
|
|
1025
|
-
</
|
|
1026
|
-
</
|
|
1027
|
-
</
|
|
1028
|
-
|
|
1029
|
-
<dt
|
|
1030
|
-
class="pf-v6-c-description-list__term"
|
|
1031
|
-
>Restart policy</dt>
|
|
1032
|
-
<dd class="pf-v6-c-description-list__description">
|
|
1033
|
-
<div
|
|
1034
|
-
class="pf-v6-c-description-list__text"
|
|
1035
|
-
>Always restart</div>
|
|
1036
|
-
</dd>
|
|
1037
|
-
</div>
|
|
1038
|
-
<div class="pf-v6-c-description-list__group">
|
|
1039
|
-
<dt class="pf-v6-c-description-list__term">Pod IP</dt>
|
|
1040
|
-
<dd class="pf-v6-c-description-list__description">
|
|
1041
|
-
<div
|
|
1042
|
-
class="pf-v6-c-description-list__text"
|
|
1043
|
-
>10.345.2.197</div>
|
|
1044
|
-
</dd>
|
|
1045
|
-
</div>
|
|
1046
|
-
<div class="pf-v6-c-description-list__group">
|
|
1047
|
-
<dt
|
|
1048
|
-
class="pf-v6-c-description-list__term"
|
|
1049
|
-
>Active deadline seconds</dt>
|
|
1050
|
-
<dd class="pf-v6-c-description-list__description">
|
|
1051
|
-
<div
|
|
1052
|
-
class="pf-v6-c-description-list__text"
|
|
1053
|
-
>Not configured</div>
|
|
1054
|
-
</dd>
|
|
1055
|
-
</div>
|
|
1056
|
-
<div class="pf-v6-c-description-list__group">
|
|
1057
|
-
<dt class="pf-v6-c-description-list__term">Created at</dt>
|
|
1058
|
-
<dd class="pf-v6-c-description-list__description">
|
|
1059
|
-
<div class="pf-v6-c-description-list__text">
|
|
1060
|
-
<time>Oct 15, 1:51 pm</time>
|
|
1061
|
-
</div>
|
|
1062
|
-
</dd>
|
|
1063
|
-
</div>
|
|
1064
|
-
<div class="pf-v6-c-description-list__group">
|
|
1065
|
-
<dt class="pf-v6-c-description-list__term">Node</dt>
|
|
1066
|
-
<dd class="pf-v6-c-description-list__description">
|
|
1067
|
-
<div class="pf-v6-c-description-list__text">
|
|
1068
|
-
<div class="pf-v6-l-flex pf-m-space-items-sm">
|
|
1069
|
-
<div class="pf-v6-l-flex__item">
|
|
1070
|
-
<span class="pf-v6-c-label pf-m-purple">
|
|
1071
|
-
<span class="pf-v6-c-label__content">
|
|
1072
|
-
<span class="pf-v6-c-label__text">N</span>
|
|
1073
|
-
</span>
|
|
1074
|
-
</span>
|
|
1075
|
-
</div>
|
|
1076
|
-
<div
|
|
1077
|
-
class="pf-v6-l-flex__item"
|
|
1078
|
-
>ip-10-0-233-118.us-east-2.computer.external</div>
|
|
1079
|
-
</div>
|
|
1080
|
-
</div>
|
|
1081
|
-
</dd>
|
|
1082
|
-
</div>
|
|
1083
|
-
</dl>
|
|
1088
|
+
</dd>
|
|
1089
|
+
</div>
|
|
1090
|
+
</dl>
|
|
1091
|
+
</div>
|
|
1084
1092
|
</div>
|
|
1085
1093
|
</div>
|
|
1086
|
-
</
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
</
|
|
1098
|
-
</
|
|
1099
|
-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
|
|
1094
|
+
</section>
|
|
1095
|
+
<section
|
|
1096
|
+
class="pf-v6-c-tab-content"
|
|
1097
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-link"
|
|
1098
|
+
id="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-panel"
|
|
1099
|
+
role="tabpanel"
|
|
1100
|
+
tabindex="0"
|
|
1101
|
+
hidden
|
|
1102
|
+
>
|
|
1103
|
+
<div class="pf-v6-c-tab-content__body">Editable aspects panel</div>
|
|
1104
|
+
</section>
|
|
1105
|
+
</div>
|
|
1106
|
+
</section>
|
|
1107
|
+
<section
|
|
1108
|
+
class="pf-v6-c-tab-content"
|
|
1109
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-yaml-link"
|
|
1110
|
+
id="tabs-tables-and-tabs-example-tabs-yaml-panel"
|
|
1111
|
+
role="tabpanel"
|
|
1112
|
+
tabindex="0"
|
|
1113
|
+
hidden
|
|
1114
|
+
>
|
|
1115
|
+
<div class="pf-v6-c-tab-content__body pf-m-padding">YAML panel</div>
|
|
1116
|
+
</section>
|
|
1117
|
+
<section
|
|
1118
|
+
class="pf-v6-c-tab-content"
|
|
1119
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-environment-link"
|
|
1120
|
+
id="tabs-tables-and-tabs-example-tabs-environment-panel"
|
|
1121
|
+
role="tabpanel"
|
|
1122
|
+
tabindex="0"
|
|
1123
|
+
hidden
|
|
1124
|
+
>
|
|
1125
|
+
<div
|
|
1126
|
+
class="pf-v6-c-tab-content__body pf-m-padding"
|
|
1127
|
+
>Environment panel</div>
|
|
1128
|
+
</section>
|
|
1129
|
+
<section
|
|
1130
|
+
class="pf-v6-c-tab-content"
|
|
1131
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-logs-link"
|
|
1132
|
+
id="tabs-tables-and-tabs-example-tabs-logs-panel"
|
|
1133
|
+
role="tabpanel"
|
|
1134
|
+
tabindex="0"
|
|
1135
|
+
hidden
|
|
1136
|
+
>
|
|
1137
|
+
<div class="pf-v6-c-tab-content__body pf-m-padding">Logs panel</div>
|
|
1138
|
+
</section>
|
|
1139
|
+
<section
|
|
1140
|
+
class="pf-v6-c-tab-content"
|
|
1141
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-events-link"
|
|
1142
|
+
id="tabs-tables-and-tabs-example-tabs-events-panel"
|
|
1143
|
+
role="tabpanel"
|
|
1144
|
+
tabindex="0"
|
|
1145
|
+
hidden
|
|
1146
|
+
>
|
|
1147
|
+
<div class="pf-v6-c-tab-content__body pf-m-padding">Events panel</div>
|
|
1148
|
+
</section>
|
|
1149
|
+
<section
|
|
1150
|
+
class="pf-v6-c-tab-content"
|
|
1151
|
+
aria-labelledby="tabs-tables-and-tabs-example-tabs-terminal-link"
|
|
1152
|
+
id="tabs-tables-and-tabs-example-tabs-terminal-panel"
|
|
1153
|
+
role="tabpanel"
|
|
1154
|
+
tabindex="0"
|
|
1155
|
+
hidden
|
|
1156
|
+
>
|
|
1157
|
+
<div class="pf-v6-c-tab-content__body pf-m-padding">Terminal panel</div>
|
|
1158
|
+
</section>
|
|
1159
|
+
</div>
|
|
1160
|
+
</section>
|
|
1161
|
+
</main>
|
|
1162
|
+
</div>
|
|
1153
1163
|
</div>
|
|
1154
1164
|
|
|
1155
1165
|
```
|
|
@@ -1377,261 +1387,278 @@ section: components
|
|
|
1377
1387
|
</nav>
|
|
1378
1388
|
</div>
|
|
1379
1389
|
</div>
|
|
1380
|
-
<
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
<
|
|
1387
|
-
<
|
|
1388
|
-
<
|
|
1389
|
-
<
|
|
1390
|
-
<
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
<
|
|
1394
|
-
<
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
<
|
|
1401
|
-
<
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
<
|
|
1408
|
-
<
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
</section>
|
|
1421
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
1422
|
-
<div class="pf-v6-c-page__main-body">
|
|
1423
|
-
<div class="pf-v6-c-content">
|
|
1424
|
-
<h1>Main title</h1>
|
|
1425
|
-
<p>This is a full page demo.</p>
|
|
1390
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
1391
|
+
<main
|
|
1392
|
+
class="pf-v6-c-page__main"
|
|
1393
|
+
tabindex="-1"
|
|
1394
|
+
id="main-content-nested-tabs-example"
|
|
1395
|
+
>
|
|
1396
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
1397
|
+
<div class="pf-v6-c-page__main-body">
|
|
1398
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
1399
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
1400
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1401
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
1402
|
+
</li>
|
|
1403
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1404
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1405
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1406
|
+
</span>
|
|
1407
|
+
|
|
1408
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1409
|
+
</li>
|
|
1410
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1411
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1412
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1413
|
+
</span>
|
|
1414
|
+
|
|
1415
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1416
|
+
</li>
|
|
1417
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1418
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1419
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1420
|
+
</span>
|
|
1421
|
+
|
|
1422
|
+
<a
|
|
1423
|
+
href="#"
|
|
1424
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
1425
|
+
aria-current="page"
|
|
1426
|
+
>Section landing</a>
|
|
1427
|
+
</li>
|
|
1428
|
+
</ol>
|
|
1429
|
+
</nav>
|
|
1426
1430
|
</div>
|
|
1427
|
-
</
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
id="nested-tabs-example-tabs-tabs"
|
|
1435
|
-
>
|
|
1436
|
-
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
1437
|
-
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
1438
|
-
<button
|
|
1439
|
-
type="button"
|
|
1440
|
-
class="pf-v6-c-tabs__link"
|
|
1441
|
-
role="tab"
|
|
1442
|
-
aria-controls="nested-tabs-example-tabs-tabs-cluster-1-panel"
|
|
1443
|
-
id="nested-tabs-example-tabs-tabs-cluster-1-link"
|
|
1444
|
-
>
|
|
1445
|
-
<span class="pf-v6-c-tabs__item-text">Cluster 1</span>
|
|
1446
|
-
</button>
|
|
1447
|
-
</li>
|
|
1448
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
1449
|
-
<button
|
|
1450
|
-
type="button"
|
|
1451
|
-
class="pf-v6-c-tabs__link"
|
|
1452
|
-
role="tab"
|
|
1453
|
-
aria-controls="nested-tabs-example-tabs-tabs-cluster-2-panel"
|
|
1454
|
-
id="nested-tabs-example-tabs-tabs-cluster-2-link"
|
|
1455
|
-
>
|
|
1456
|
-
<span class="pf-v6-c-tabs__item-text">Cluster 2</span>
|
|
1457
|
-
</button>
|
|
1458
|
-
</li>
|
|
1459
|
-
</ul>
|
|
1431
|
+
</section>
|
|
1432
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
1433
|
+
<div class="pf-v6-c-page__main-body">
|
|
1434
|
+
<div class="pf-v6-c-content">
|
|
1435
|
+
<h1>Main title</h1>
|
|
1436
|
+
<p>This is a full page demo.</p>
|
|
1437
|
+
</div>
|
|
1460
1438
|
</div>
|
|
1461
|
-
</
|
|
1462
|
-
|
|
1463
|
-
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1470
|
-
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
</
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1439
|
+
</section>
|
|
1440
|
+
<section class="pf-v6-c-page__main-tabs pf-m-limit-width">
|
|
1441
|
+
<div class="pf-v6-c-page__main-body">
|
|
1442
|
+
<div
|
|
1443
|
+
class="pf-v6-c-tabs pf-m-page-insets"
|
|
1444
|
+
role="region"
|
|
1445
|
+
id="nested-tabs-example-tabs-tabs"
|
|
1446
|
+
>
|
|
1447
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
1448
|
+
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
1449
|
+
<button
|
|
1450
|
+
type="button"
|
|
1451
|
+
class="pf-v6-c-tabs__link"
|
|
1452
|
+
role="tab"
|
|
1453
|
+
aria-controls="nested-tabs-example-tabs-tabs-cluster-1-panel"
|
|
1454
|
+
id="nested-tabs-example-tabs-tabs-cluster-1-link"
|
|
1455
|
+
>
|
|
1456
|
+
<span class="pf-v6-c-tabs__item-text">Cluster 1</span>
|
|
1457
|
+
</button>
|
|
1458
|
+
</li>
|
|
1459
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
1460
|
+
<button
|
|
1461
|
+
type="button"
|
|
1462
|
+
class="pf-v6-c-tabs__link"
|
|
1463
|
+
role="tab"
|
|
1464
|
+
aria-controls="nested-tabs-example-tabs-tabs-cluster-2-panel"
|
|
1465
|
+
id="nested-tabs-example-tabs-tabs-cluster-2-link"
|
|
1466
|
+
>
|
|
1467
|
+
<span class="pf-v6-c-tabs__item-text">Cluster 2</span>
|
|
1468
|
+
</button>
|
|
1469
|
+
</li>
|
|
1470
|
+
</ul>
|
|
1471
|
+
</div>
|
|
1472
|
+
</div>
|
|
1473
|
+
</section>
|
|
1474
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width">
|
|
1475
|
+
<div class="pf-v6-c-page__main-body">
|
|
1476
|
+
<section
|
|
1477
|
+
class="pf-v6-c-tab-content"
|
|
1478
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-cluster-1-link"
|
|
1479
|
+
id="nested-tabs-example-tabs-tabs-cluster-1-panel"
|
|
1480
|
+
role="tabpanel"
|
|
1481
|
+
tabindex="0"
|
|
1482
|
+
>
|
|
1483
|
+
<div class="pf-v6-c-tab-content__body">
|
|
1484
|
+
<div class="pf-v6-l-grid pf-m-gutter">
|
|
1485
|
+
<div
|
|
1486
|
+
class="pf-v6-l-grid__item pf-m-6-col-on-md pf-m-8-col-on-xl"
|
|
1487
|
+
>
|
|
1488
|
+
<div class="pf-v6-c-card pf-m-full-height">
|
|
1489
|
+
<div class="pf-v6-c-card__header">
|
|
1490
|
+
<h2 class="pf-v6-c-title pf-m-lg">Status</h2>
|
|
1491
|
+
</div>
|
|
1492
|
+
<div class="pf-v6-c-card__body">
|
|
1493
|
+
<div class="pf-v6-l-flex pf-m-column">
|
|
1494
|
+
<div class="pf-v6-l-flex__item">
|
|
1495
|
+
<div
|
|
1496
|
+
class="pf-v6-c-tabs"
|
|
1497
|
+
role="region"
|
|
1498
|
+
id="nested-tabs-example-tabs-tabs-subtabs"
|
|
1499
|
+
>
|
|
1500
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
1501
|
+
<li
|
|
1502
|
+
class="pf-v6-c-tabs__item pf-m-current"
|
|
1503
|
+
role="presentation"
|
|
1498
1504
|
>
|
|
1499
|
-
<
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1505
|
+
<button
|
|
1506
|
+
type="button"
|
|
1507
|
+
class="pf-v6-c-tabs__link"
|
|
1508
|
+
role="tab"
|
|
1509
|
+
aria-controls="nested-tabs-example-tabs-tabs-subtabs-cluster-panel"
|
|
1510
|
+
id="nested-tabs-example-tabs-tabs-subtabs-cluster-link"
|
|
1511
|
+
>
|
|
1512
|
+
<span class="pf-v6-c-tabs__item-text">Cluster</span>
|
|
1513
|
+
</button>
|
|
1514
|
+
</li>
|
|
1515
|
+
<li
|
|
1516
|
+
class="pf-v6-c-tabs__item"
|
|
1517
|
+
role="presentation"
|
|
1509
1518
|
>
|
|
1510
|
-
<
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1519
|
+
<button
|
|
1520
|
+
type="button"
|
|
1521
|
+
class="pf-v6-c-tabs__link"
|
|
1522
|
+
role="tab"
|
|
1523
|
+
aria-controls="nested-tabs-example-tabs-tabs-subtabs-control-plane-panel"
|
|
1524
|
+
id="nested-tabs-example-tabs-tabs-subtabs-control-plane-link"
|
|
1525
|
+
>
|
|
1526
|
+
<span
|
|
1527
|
+
class="pf-v6-c-tabs__item-text"
|
|
1528
|
+
>Control plane</span>
|
|
1529
|
+
</button>
|
|
1530
|
+
</li>
|
|
1531
|
+
<li
|
|
1532
|
+
class="pf-v6-c-tabs__item"
|
|
1533
|
+
role="presentation"
|
|
1522
1534
|
>
|
|
1523
|
-
<
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1535
|
+
<button
|
|
1536
|
+
type="button"
|
|
1537
|
+
class="pf-v6-c-tabs__link"
|
|
1538
|
+
role="tab"
|
|
1539
|
+
aria-controls="nested-tabs-example-tabs-tabs-subtabs-operators-panel"
|
|
1540
|
+
id="nested-tabs-example-tabs-tabs-subtabs-operators-link"
|
|
1541
|
+
>
|
|
1542
|
+
<span
|
|
1543
|
+
class="pf-v6-c-tabs__item-text"
|
|
1544
|
+
>Operators</span>
|
|
1545
|
+
</button>
|
|
1546
|
+
</li>
|
|
1547
|
+
<li
|
|
1548
|
+
class="pf-v6-c-tabs__item"
|
|
1549
|
+
role="presentation"
|
|
1533
1550
|
>
|
|
1534
|
-
<
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1551
|
+
<button
|
|
1552
|
+
type="button"
|
|
1553
|
+
class="pf-v6-c-tabs__link"
|
|
1554
|
+
role="tab"
|
|
1555
|
+
aria-controls="nested-tabs-example-tabs-tabs-subtabs-virtualization-panel"
|
|
1556
|
+
id="nested-tabs-example-tabs-tabs-subtabs-virtualization-link"
|
|
1557
|
+
>
|
|
1558
|
+
<span
|
|
1559
|
+
class="pf-v6-c-tabs__item-text"
|
|
1560
|
+
>Virtualization</span>
|
|
1561
|
+
</button>
|
|
1562
|
+
</li>
|
|
1563
|
+
</ul>
|
|
1564
|
+
</div>
|
|
1540
1565
|
</div>
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1566
|
+
<div class="pf-v6-l-flex__item">
|
|
1567
|
+
<section
|
|
1568
|
+
class="pf-v6-c-tab-content"
|
|
1569
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-subtabs-cluster-link"
|
|
1570
|
+
id="nested-tabs-example-tabs-tabs-subtabs-cluster-panel"
|
|
1571
|
+
role="tabpanel"
|
|
1572
|
+
tabindex="0"
|
|
1573
|
+
>
|
|
1574
|
+
<div class="pf-v6-c-tab-content__body">
|
|
1575
|
+
<div class="pf-v6-c-content">
|
|
1576
|
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in odio porttitor, feugiat risus in, feugiat arcu. Nullam euismod enim eget fringilla condimentum. Maecenas tincidunt et metus id aliquet. Integer et fermentum purus. Nulla tempor velit arcu, vitae semper purus iaculis at. Sed malesuada auctor luctus. Pellentesque et leo urna. Aliquam vitae felis congue lacus mattis fringilla. Nullam et ultricies erat, sed dignissim elit. Cras mattis pulvinar aliquam. In ac est nulla. Pellentesque fermentum nibh ac sapien porta, ut congue orci aliquam. Sed nisl est, tempor eu pharetra eget, ullamcorper ut augue. Vestibulum eleifend libero eu nulla cursus lacinia.</p>
|
|
1577
|
+
</div>
|
|
1553
1578
|
</div>
|
|
1554
|
-
</
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
</
|
|
1579
|
+
</section>
|
|
1580
|
+
<section
|
|
1581
|
+
class="pf-v6-c-tab-content"
|
|
1582
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-subtabs-control-plane-link"
|
|
1583
|
+
id="nested-tabs-example-tabs-tabs-subtabs-control-plane-panel"
|
|
1584
|
+
role="tabpanel"
|
|
1585
|
+
tabindex="0"
|
|
1586
|
+
hidden
|
|
1587
|
+
>
|
|
1588
|
+
<div
|
|
1589
|
+
class="pf-v6-c-tab-content__body"
|
|
1590
|
+
>Control plane content</div>
|
|
1591
|
+
</section>
|
|
1592
|
+
<section
|
|
1593
|
+
class="pf-v6-c-tab-content"
|
|
1594
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-subtabs-operators-link"
|
|
1595
|
+
id="nested-tabs-example-tabs-tabs-subtabs-operators-panel"
|
|
1596
|
+
role="tabpanel"
|
|
1597
|
+
tabindex="0"
|
|
1598
|
+
hidden
|
|
1599
|
+
>
|
|
1600
|
+
<div
|
|
1601
|
+
class="pf-v6-c-tab-content__body"
|
|
1602
|
+
>Operators content</div>
|
|
1603
|
+
</section>
|
|
1604
|
+
<section
|
|
1605
|
+
class="pf-v6-c-tab-content"
|
|
1606
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-subtabs-virtualization-link"
|
|
1607
|
+
id="nested-tabs-example-tabs-tabs-subtabs-virtualization-panel"
|
|
1608
|
+
role="tabpanel"
|
|
1609
|
+
tabindex="0"
|
|
1610
|
+
hidden
|
|
1611
|
+
>
|
|
1612
|
+
<div
|
|
1613
|
+
class="pf-v6-c-tab-content__body"
|
|
1614
|
+
>Virtualization content</div>
|
|
1615
|
+
</section>
|
|
1616
|
+
</div>
|
|
1592
1617
|
</div>
|
|
1593
1618
|
</div>
|
|
1594
1619
|
</div>
|
|
1595
1620
|
</div>
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
<div class="pf-v6-l-
|
|
1600
|
-
<div class="pf-v6-
|
|
1601
|
-
<div class="pf-v6-c-
|
|
1602
|
-
<
|
|
1621
|
+
<div
|
|
1622
|
+
class="pf-v6-l-grid__item pf-m-6-col-on-md pf-m-4-col-on-xl"
|
|
1623
|
+
>
|
|
1624
|
+
<div class="pf-v6-l-flex pf-m-column pf-v5-u-h-100">
|
|
1625
|
+
<div class="pf-v6-l-flex__item pf-m-flex-1">
|
|
1626
|
+
<div class="pf-v6-c-card pf-m-full-height">
|
|
1627
|
+
<div class="pf-v6-c-card__header">
|
|
1628
|
+
<h2 class="pf-v6-c-title pf-m-lg">Title of card</h2>
|
|
1629
|
+
</div>
|
|
1603
1630
|
</div>
|
|
1604
1631
|
</div>
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1632
|
+
<div class="pf-v6-l-flex__item pf-m-flex-1">
|
|
1633
|
+
<div class="pf-v6-c-card pf-m-full-height">
|
|
1634
|
+
<div class="pf-v6-c-card__header">
|
|
1635
|
+
<h2 class="pf-v6-c-title pf-m-lg">Title of card</h2>
|
|
1636
|
+
</div>
|
|
1610
1637
|
</div>
|
|
1611
1638
|
</div>
|
|
1612
1639
|
</div>
|
|
1613
1640
|
</div>
|
|
1614
1641
|
</div>
|
|
1615
1642
|
</div>
|
|
1616
|
-
</
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1643
|
+
</section>
|
|
1644
|
+
<section
|
|
1645
|
+
class="pf-v6-c-tab-content"
|
|
1646
|
+
aria-labelledby="nested-tabs-example-tabs-tabs-cluster-2-link"
|
|
1647
|
+
id="nested-tabs-example-tabs-tabs-cluster-2-panel"
|
|
1648
|
+
role="tabpanel"
|
|
1649
|
+
tabindex="0"
|
|
1650
|
+
hidden
|
|
1651
|
+
>
|
|
1652
|
+
<div class="pf-v6-c-tab-content__body">
|
|
1653
|
+
<div class="pf-v6-c-content">
|
|
1654
|
+
<p>Cluster 2 content</p>
|
|
1655
|
+
</div>
|
|
1629
1656
|
</div>
|
|
1630
|
-
</
|
|
1631
|
-
</
|
|
1632
|
-
</
|
|
1633
|
-
</
|
|
1634
|
-
</
|
|
1657
|
+
</section>
|
|
1658
|
+
</div>
|
|
1659
|
+
</section>
|
|
1660
|
+
</main>
|
|
1661
|
+
</div>
|
|
1635
1662
|
</div>
|
|
1636
1663
|
|
|
1637
1664
|
```
|
|
@@ -1859,1000 +1886,1037 @@ section: components
|
|
|
1859
1886
|
</nav>
|
|
1860
1887
|
</div>
|
|
1861
1888
|
</div>
|
|
1862
|
-
<
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
<
|
|
1869
|
-
<
|
|
1870
|
-
<
|
|
1871
|
-
<
|
|
1872
|
-
<
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
<
|
|
1876
|
-
<
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1880
|
-
</li>
|
|
1881
|
-
<li class="pf-v6-c-breadcrumb__item">
|
|
1882
|
-
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1883
|
-
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1884
|
-
</span>
|
|
1885
|
-
|
|
1886
|
-
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1887
|
-
</li>
|
|
1888
|
-
<li class="pf-v6-c-breadcrumb__item">
|
|
1889
|
-
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1890
|
-
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1891
|
-
</span>
|
|
1892
|
-
|
|
1893
|
-
<a
|
|
1894
|
-
href="#"
|
|
1895
|
-
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
1896
|
-
aria-current="page"
|
|
1897
|
-
>Section landing</a>
|
|
1898
|
-
</li>
|
|
1899
|
-
</ol>
|
|
1900
|
-
</nav>
|
|
1901
|
-
</div>
|
|
1902
|
-
</section>
|
|
1903
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
1904
|
-
<div class="pf-v6-c-page__main-body">
|
|
1905
|
-
<div class="pf-v6-c-content">
|
|
1906
|
-
<h1>Main title</h1>
|
|
1907
|
-
<p>This is a full page demo.</p>
|
|
1908
|
-
</div>
|
|
1909
|
-
</div>
|
|
1910
|
-
</section>
|
|
1911
|
-
<section class="pf-v6-c-page__main-section pf-m-no-padding pf-m-light">
|
|
1912
|
-
<div
|
|
1913
|
-
class="pf-v6-c-toolbar pf-m-page-insets"
|
|
1914
|
-
id="table-tabs-example-tabs-toolbar"
|
|
1915
|
-
>
|
|
1916
|
-
<div class="pf-v6-c-toolbar__content">
|
|
1917
|
-
<div class="pf-v6-c-toolbar__content-section pf-m-nowrap">
|
|
1918
|
-
<div
|
|
1919
|
-
class="pf-v6-c-toolbar__group pf-m-toggle-group pf-m-show-on-xl"
|
|
1920
|
-
>
|
|
1921
|
-
<div class="pf-v6-c-toolbar__toggle pf-m-show">
|
|
1922
|
-
<button
|
|
1923
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1924
|
-
type="button"
|
|
1925
|
-
aria-expanded="false"
|
|
1926
|
-
aria-label="Show filters"
|
|
1927
|
-
aria-controls="table-tabs-example-tabs-toolbar-expandable-content"
|
|
1928
|
-
>
|
|
1929
|
-
<span class="pf-v6-c-menu-toggle__icon">
|
|
1930
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1931
|
-
</span>
|
|
1932
|
-
</button>
|
|
1933
|
-
</div>
|
|
1889
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
1890
|
+
<main
|
|
1891
|
+
class="pf-v6-c-page__main"
|
|
1892
|
+
tabindex="-1"
|
|
1893
|
+
id="main-content-table-tabs-example"
|
|
1894
|
+
>
|
|
1895
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
1896
|
+
<div class="pf-v6-c-page__main-body">
|
|
1897
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
1898
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
1899
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1900
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
1901
|
+
</li>
|
|
1902
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1903
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1904
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1905
|
+
</span>
|
|
1934
1906
|
|
|
1935
|
-
|
|
1936
|
-
|
|
1937
|
-
|
|
1938
|
-
|
|
1939
|
-
|
|
1940
|
-
|
|
1907
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1908
|
+
</li>
|
|
1909
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1910
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1911
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1912
|
+
</span>
|
|
1913
|
+
|
|
1914
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
1915
|
+
</li>
|
|
1916
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
1917
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
1918
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
1919
|
+
</span>
|
|
1941
1920
|
|
|
1921
|
+
<a
|
|
1922
|
+
href="#"
|
|
1923
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
1924
|
+
aria-current="page"
|
|
1925
|
+
>Section landing</a>
|
|
1926
|
+
</li>
|
|
1927
|
+
</ol>
|
|
1928
|
+
</nav>
|
|
1929
|
+
</div>
|
|
1930
|
+
</section>
|
|
1931
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
1932
|
+
<div class="pf-v6-c-page__main-body">
|
|
1933
|
+
<div class="pf-v6-c-content">
|
|
1934
|
+
<h1>Main title</h1>
|
|
1935
|
+
<p>This is a full page demo.</p>
|
|
1936
|
+
</div>
|
|
1937
|
+
</div>
|
|
1938
|
+
</section>
|
|
1939
|
+
<section class="pf-v6-c-page__main-section pf-m-no-padding pf-m-light">
|
|
1940
|
+
<div
|
|
1941
|
+
class="pf-v6-c-toolbar pf-m-page-insets"
|
|
1942
|
+
id="table-tabs-example-tabs-toolbar"
|
|
1943
|
+
>
|
|
1944
|
+
<div class="pf-v6-c-toolbar__content">
|
|
1945
|
+
<div class="pf-v6-c-toolbar__content-section pf-m-nowrap">
|
|
1946
|
+
<div
|
|
1947
|
+
class="pf-v6-c-toolbar__group pf-m-toggle-group pf-m-show-on-xl"
|
|
1948
|
+
>
|
|
1949
|
+
<div class="pf-v6-c-toolbar__toggle pf-m-show">
|
|
1942
1950
|
<button
|
|
1943
|
-
class="pf-v6-c-
|
|
1951
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1944
1952
|
type="button"
|
|
1945
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-toggle"
|
|
1946
|
-
aria-haspopup="true"
|
|
1947
1953
|
aria-expanded="false"
|
|
1948
|
-
aria-
|
|
1954
|
+
aria-label="Show filters"
|
|
1955
|
+
aria-controls="table-tabs-example-tabs-toolbar-expandable-content"
|
|
1949
1956
|
>
|
|
1950
|
-
<
|
|
1951
|
-
<
|
|
1952
|
-
</div>
|
|
1953
|
-
<span class="pf-v6-c-select__toggle-arrow">
|
|
1954
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1957
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
1958
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1955
1959
|
</span>
|
|
1956
1960
|
</button>
|
|
1961
|
+
</div>
|
|
1957
1962
|
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
|
|
1963
|
+
<div class="pf-v6-c-toolbar__item">
|
|
1964
|
+
<div class="pf-v6-c-select">
|
|
1965
|
+
<span
|
|
1966
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-label"
|
|
1967
|
+
hidden
|
|
1968
|
+
>Choose many</span>
|
|
1969
|
+
|
|
1970
|
+
<button
|
|
1971
|
+
class="pf-v6-c-select__toggle"
|
|
1972
|
+
type="button"
|
|
1973
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-toggle"
|
|
1974
|
+
aria-haspopup="true"
|
|
1975
|
+
aria-expanded="false"
|
|
1976
|
+
aria-labelledby="table-tabs-example-tabs-toolbar-select-checkbox-status-label table-tabs-example-tabs-toolbar-select-checkbox-status-toggle"
|
|
1962
1977
|
>
|
|
1963
|
-
<
|
|
1964
|
-
class="pf-v6-c-
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
<span class="pf-v6-c-check__label">Active</span>
|
|
1976
|
-
<span
|
|
1977
|
-
class="pf-v6-c-check__description"
|
|
1978
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-active-description"
|
|
1979
|
-
>This is a description</span>
|
|
1980
|
-
</label>
|
|
1981
|
-
<label
|
|
1982
|
-
class="pf-v6-c-check pf-v5-c-select__menu-item pf-m-description"
|
|
1983
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled"
|
|
1984
|
-
for="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
1985
|
-
>
|
|
1986
|
-
<input
|
|
1987
|
-
class="pf-v6-c-check__input"
|
|
1988
|
-
type="checkbox"
|
|
1989
|
-
aria-describedby="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-description"
|
|
1990
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
1991
|
-
name="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
1992
|
-
/>
|
|
1993
|
-
<span class="pf-v6-c-check__label">Canceled</span>
|
|
1994
|
-
<span
|
|
1995
|
-
class="pf-v6-c-check__description"
|
|
1996
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-description"
|
|
1997
|
-
>This is a really long description that describes the menu item. This is a really long description that describes the menu item.</span>
|
|
1998
|
-
</label>
|
|
1999
|
-
<label
|
|
2000
|
-
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2001
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-paused"
|
|
2002
|
-
for="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2003
|
-
>
|
|
2004
|
-
<input
|
|
2005
|
-
class="pf-v6-c-check__input"
|
|
2006
|
-
type="checkbox"
|
|
2007
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2008
|
-
name="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2009
|
-
/>
|
|
2010
|
-
<span class="pf-v6-c-check__label">Paused</span>
|
|
2011
|
-
</label>
|
|
2012
|
-
<label
|
|
2013
|
-
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2014
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-warning"
|
|
2015
|
-
for="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2016
|
-
>
|
|
2017
|
-
<input
|
|
2018
|
-
class="pf-v6-c-check__input"
|
|
2019
|
-
type="checkbox"
|
|
2020
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2021
|
-
name="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2022
|
-
/>
|
|
2023
|
-
<span class="pf-v6-c-check__label">Warning</span>
|
|
2024
|
-
</label>
|
|
2025
|
-
<label
|
|
2026
|
-
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2027
|
-
id="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted"
|
|
2028
|
-
for="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted-input"
|
|
1978
|
+
<div class="pf-v6-c-select__toggle-wrapper">
|
|
1979
|
+
<span class="pf-v6-c-select__toggle-text">Name</span>
|
|
1980
|
+
</div>
|
|
1981
|
+
<span class="pf-v6-c-select__toggle-arrow">
|
|
1982
|
+
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1983
|
+
</span>
|
|
1984
|
+
</button>
|
|
1985
|
+
|
|
1986
|
+
<div class="pf-v6-c-select__menu" hidden>
|
|
1987
|
+
<fieldset
|
|
1988
|
+
class="pf-v6-c-select__menu-fieldset"
|
|
1989
|
+
aria-label="Select input"
|
|
2029
1990
|
>
|
|
2030
|
-
<
|
|
2031
|
-
class="pf-v6-c-
|
|
2032
|
-
|
|
2033
|
-
|
|
2034
|
-
|
|
2035
|
-
|
|
2036
|
-
|
|
2037
|
-
|
|
2038
|
-
|
|
1991
|
+
<label
|
|
1992
|
+
class="pf-v6-c-check pf-v5-c-select__menu-item pf-m-description"
|
|
1993
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-active"
|
|
1994
|
+
for="table-tabs-example-tabs-toolbar-select-checkbox-status-active-input"
|
|
1995
|
+
>
|
|
1996
|
+
<input
|
|
1997
|
+
class="pf-v6-c-check__input"
|
|
1998
|
+
type="checkbox"
|
|
1999
|
+
aria-describedby="table-tabs-example-tabs-toolbar-select-checkbox-status-active-description"
|
|
2000
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-active-input"
|
|
2001
|
+
name="table-tabs-example-tabs-toolbar-select-checkbox-status-active-input"
|
|
2002
|
+
/>
|
|
2003
|
+
<span class="pf-v6-c-check__label">Active</span>
|
|
2004
|
+
<span
|
|
2005
|
+
class="pf-v6-c-check__description"
|
|
2006
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-active-description"
|
|
2007
|
+
>This is a description</span>
|
|
2008
|
+
</label>
|
|
2009
|
+
<label
|
|
2010
|
+
class="pf-v6-c-check pf-v5-c-select__menu-item pf-m-description"
|
|
2011
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled"
|
|
2012
|
+
for="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
2013
|
+
>
|
|
2014
|
+
<input
|
|
2015
|
+
class="pf-v6-c-check__input"
|
|
2016
|
+
type="checkbox"
|
|
2017
|
+
aria-describedby="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-description"
|
|
2018
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
2019
|
+
name="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-input"
|
|
2020
|
+
/>
|
|
2021
|
+
<span class="pf-v6-c-check__label">Canceled</span>
|
|
2022
|
+
<span
|
|
2023
|
+
class="pf-v6-c-check__description"
|
|
2024
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-canceled-description"
|
|
2025
|
+
>This is a really long description that describes the menu item. This is a really long description that describes the menu item.</span>
|
|
2026
|
+
</label>
|
|
2027
|
+
<label
|
|
2028
|
+
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2029
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-paused"
|
|
2030
|
+
for="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2031
|
+
>
|
|
2032
|
+
<input
|
|
2033
|
+
class="pf-v6-c-check__input"
|
|
2034
|
+
type="checkbox"
|
|
2035
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2036
|
+
name="table-tabs-example-tabs-toolbar-select-checkbox-status-paused-input"
|
|
2037
|
+
/>
|
|
2038
|
+
<span class="pf-v6-c-check__label">Paused</span>
|
|
2039
|
+
</label>
|
|
2040
|
+
<label
|
|
2041
|
+
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2042
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-warning"
|
|
2043
|
+
for="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2044
|
+
>
|
|
2045
|
+
<input
|
|
2046
|
+
class="pf-v6-c-check__input"
|
|
2047
|
+
type="checkbox"
|
|
2048
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2049
|
+
name="table-tabs-example-tabs-toolbar-select-checkbox-status-warning-input"
|
|
2050
|
+
/>
|
|
2051
|
+
<span class="pf-v6-c-check__label">Warning</span>
|
|
2052
|
+
</label>
|
|
2053
|
+
<label
|
|
2054
|
+
class="pf-v6-c-check pf-v5-c-select__menu-item"
|
|
2055
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted"
|
|
2056
|
+
for="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted-input"
|
|
2057
|
+
>
|
|
2058
|
+
<input
|
|
2059
|
+
class="pf-v6-c-check__input"
|
|
2060
|
+
type="checkbox"
|
|
2061
|
+
id="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted-input"
|
|
2062
|
+
name="table-tabs-example-tabs-toolbar-select-checkbox-status-restarted-input"
|
|
2063
|
+
/>
|
|
2064
|
+
<span class="pf-v6-c-check__label">Restarted</span>
|
|
2065
|
+
</label>
|
|
2066
|
+
</fieldset>
|
|
2067
|
+
</div>
|
|
2039
2068
|
</div>
|
|
2040
2069
|
</div>
|
|
2041
2070
|
</div>
|
|
2042
|
-
</div>
|
|
2043
2071
|
|
|
2044
|
-
|
|
2045
|
-
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
|
|
2055
|
-
|
|
2072
|
+
<div class="pf-v6-c-toolbar__item">
|
|
2073
|
+
<button
|
|
2074
|
+
class="pf-v6-c-button pf-m-plain"
|
|
2075
|
+
type="button"
|
|
2076
|
+
aria-label="Sort"
|
|
2077
|
+
>
|
|
2078
|
+
<i
|
|
2079
|
+
class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
|
|
2080
|
+
aria-hidden="true"
|
|
2081
|
+
></i>
|
|
2082
|
+
</button>
|
|
2083
|
+
</div>
|
|
2056
2084
|
|
|
2057
|
-
<div
|
|
2058
|
-
class="pf-v6-c-overflow-menu"
|
|
2059
|
-
id="table-tabs-example-tabs-toolbar-overflow-menu"
|
|
2060
|
-
>
|
|
2061
2085
|
<div
|
|
2062
|
-
class="pf-v6-c-overflow-
|
|
2086
|
+
class="pf-v6-c-overflow-menu"
|
|
2087
|
+
id="table-tabs-example-tabs-toolbar-overflow-menu"
|
|
2063
2088
|
>
|
|
2064
|
-
<div
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2089
|
+
<div
|
|
2090
|
+
class="pf-v6-c-overflow-menu__content pf-v5-u-display-none pf-v5-u-display-flex-on-lg"
|
|
2091
|
+
>
|
|
2092
|
+
<div class="pf-v6-c-overflow-menu__group pf-m-button-group">
|
|
2093
|
+
<div class="pf-v6-c-overflow-menu__item">
|
|
2094
|
+
<button
|
|
2095
|
+
class="pf-v6-c-button pf-m-primary"
|
|
2096
|
+
type="button"
|
|
2097
|
+
>Generate</button>
|
|
2098
|
+
</div>
|
|
2071
2099
|
|
|
2072
|
-
|
|
2100
|
+
<div class="pf-v6-c-overflow-menu__item">
|
|
2101
|
+
<button
|
|
2102
|
+
class="pf-v6-c-button pf-m-secondary"
|
|
2103
|
+
type="button"
|
|
2104
|
+
>Deploy</button>
|
|
2105
|
+
</div>
|
|
2106
|
+
</div>
|
|
2107
|
+
</div>
|
|
2108
|
+
<div class="pf-v6-c-overflow-menu__control">
|
|
2109
|
+
<div class="pf-v6-c-dropdown">
|
|
2073
2110
|
<button
|
|
2074
|
-
class="pf-v6-c-button pf-m-
|
|
2111
|
+
class="pf-v6-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2075
2112
|
type="button"
|
|
2076
|
-
|
|
2113
|
+
id="table-tabs-example-tabs-toolbar-overflow-menu-dropdown-toggle"
|
|
2114
|
+
aria-label="Dropdown with additional options"
|
|
2115
|
+
aria-expanded="false"
|
|
2116
|
+
>
|
|
2117
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2118
|
+
</button>
|
|
2119
|
+
<ul
|
|
2120
|
+
class="pf-v6-c-dropdown__menu"
|
|
2121
|
+
role="menu"
|
|
2122
|
+
aria-labelledby="table-tabs-example-tabs-toolbar-overflow-menu-dropdown-toggle"
|
|
2123
|
+
hidden
|
|
2124
|
+
>
|
|
2125
|
+
<li role="none">
|
|
2126
|
+
<button
|
|
2127
|
+
role="menuitem"
|
|
2128
|
+
class="pf-v6-c-dropdown__menu-item"
|
|
2129
|
+
>Action 7</button>
|
|
2130
|
+
</li>
|
|
2131
|
+
</ul>
|
|
2077
2132
|
</div>
|
|
2078
2133
|
</div>
|
|
2079
2134
|
</div>
|
|
2080
|
-
<div class="pf-v6-c-overflow-menu__control">
|
|
2081
|
-
<div class="pf-v6-c-dropdown">
|
|
2082
|
-
<button
|
|
2083
|
-
class="pf-v6-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2084
|
-
type="button"
|
|
2085
|
-
id="table-tabs-example-tabs-toolbar-overflow-menu-dropdown-toggle"
|
|
2086
|
-
aria-label="Dropdown with additional options"
|
|
2087
|
-
aria-expanded="false"
|
|
2088
|
-
>
|
|
2089
|
-
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2090
|
-
</button>
|
|
2091
|
-
<ul
|
|
2092
|
-
class="pf-v6-c-dropdown__menu"
|
|
2093
|
-
role="menu"
|
|
2094
|
-
aria-labelledby="table-tabs-example-tabs-toolbar-overflow-menu-dropdown-toggle"
|
|
2095
|
-
hidden
|
|
2096
|
-
>
|
|
2097
|
-
<li role="none">
|
|
2098
|
-
<button
|
|
2099
|
-
role="menuitem"
|
|
2100
|
-
class="pf-v6-c-dropdown__menu-item"
|
|
2101
|
-
>Action 7</button>
|
|
2102
|
-
</li>
|
|
2103
|
-
</ul>
|
|
2104
|
-
</div>
|
|
2105
|
-
</div>
|
|
2106
2135
|
</div>
|
|
2107
|
-
</div>
|
|
2108
2136
|
|
|
2109
|
-
|
|
2110
|
-
|
|
2111
|
-
|
|
2112
|
-
|
|
2113
|
-
|
|
2137
|
+
<div
|
|
2138
|
+
class="pf-v6-c-toolbar__expandable-content pf-m-hidden"
|
|
2139
|
+
id="table-tabs-example-tabs-toolbar-expandable-content"
|
|
2140
|
+
hidden
|
|
2141
|
+
></div>
|
|
2142
|
+
</div>
|
|
2114
2143
|
</div>
|
|
2115
|
-
|
|
2116
|
-
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2123
|
-
|
|
2124
|
-
|
|
2125
|
-
|
|
2126
|
-
|
|
2127
|
-
|
|
2128
|
-
|
|
2129
|
-
|
|
2130
|
-
|
|
2131
|
-
|
|
2132
|
-
role="cell"
|
|
2133
|
-
>
|
|
2134
|
-
<label
|
|
2135
|
-
class="pf-v6-c-check pf-m-standalone"
|
|
2136
|
-
id="table-tabs-example-tablecheckrowcheck"
|
|
2137
|
-
for="table-tabs-example-tablecheckrowcheck-input"
|
|
2144
|
+
<hr class="pf-v6-c-divider" />
|
|
2145
|
+
<div class="pf-v6-c-drawer pf-m-expanded pf-m-inline">
|
|
2146
|
+
<div class="pf-v6-c-drawer__main">
|
|
2147
|
+
<!-- Content -->
|
|
2148
|
+
<div class="pf-v6-c-drawer__content">
|
|
2149
|
+
<div class="pf-v6-c-drawer__body">
|
|
2150
|
+
<table
|
|
2151
|
+
class="pf-v6-c-table pf-m-grid-md"
|
|
2152
|
+
role="grid"
|
|
2153
|
+
aria-label="This is a table with checkboxes"
|
|
2154
|
+
id="table-tabs-example-table"
|
|
2155
|
+
>
|
|
2156
|
+
<thead class="pf-v6-c-table__thead">
|
|
2157
|
+
<tr class="pf-v6-c-table__tr" role="row">
|
|
2158
|
+
<td
|
|
2159
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2160
|
+
role="cell"
|
|
2138
2161
|
>
|
|
2139
|
-
<
|
|
2140
|
-
class="pf-v6-c-
|
|
2141
|
-
|
|
2142
|
-
|
|
2143
|
-
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
|
|
2174
|
-
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
|
|
2181
|
-
|
|
2182
|
-
|
|
2183
|
-
|
|
2184
|
-
|
|
2185
|
-
|
|
2186
|
-
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
|
|
2162
|
+
<label
|
|
2163
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2164
|
+
id="table-tabs-example-tablecheckrowcheck"
|
|
2165
|
+
for="table-tabs-example-tablecheckrowcheck-input"
|
|
2166
|
+
>
|
|
2167
|
+
<input
|
|
2168
|
+
class="pf-v6-c-check__input"
|
|
2169
|
+
type="checkbox"
|
|
2170
|
+
id="table-tabs-example-tablecheckrowcheck-input"
|
|
2171
|
+
name="table-tabs-example-tablecheckrowcheck-input"
|
|
2172
|
+
aria-label="Standalone check"
|
|
2173
|
+
/>
|
|
2174
|
+
</label>
|
|
2175
|
+
</td>
|
|
2176
|
+
|
|
2177
|
+
<th
|
|
2178
|
+
class="pf-v6-c-table__th"
|
|
2179
|
+
role="columnheader"
|
|
2180
|
+
scope="col"
|
|
2181
|
+
>Repositories</th>
|
|
2182
|
+
|
|
2183
|
+
<th
|
|
2184
|
+
class="pf-v6-c-table__th"
|
|
2185
|
+
role="columnheader"
|
|
2186
|
+
scope="col"
|
|
2187
|
+
>Branches</th>
|
|
2188
|
+
|
|
2189
|
+
<th
|
|
2190
|
+
class="pf-v6-c-table__th"
|
|
2191
|
+
role="columnheader"
|
|
2192
|
+
scope="col"
|
|
2193
|
+
>Pull requests</th>
|
|
2194
|
+
|
|
2195
|
+
<th
|
|
2196
|
+
class="pf-v6-c-table__th"
|
|
2197
|
+
role="columnheader"
|
|
2198
|
+
scope="col"
|
|
2199
|
+
>Workspaces</th>
|
|
2200
|
+
|
|
2201
|
+
<th
|
|
2202
|
+
class="pf-v6-c-table__th"
|
|
2203
|
+
role="columnheader"
|
|
2204
|
+
scope="col"
|
|
2205
|
+
>Last commit</th>
|
|
2206
|
+
|
|
2207
|
+
<td class="pf-v6-c-table__td"></td>
|
|
2208
|
+
</tr>
|
|
2209
|
+
</thead>
|
|
2210
|
+
|
|
2211
|
+
<tbody class="pf-v6-c-table__tbody" role="rowgroup">
|
|
2212
|
+
<tr class="pf-v6-c-table__tr" role="row">
|
|
2213
|
+
<td
|
|
2214
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2215
|
+
role="cell"
|
|
2193
2216
|
>
|
|
2194
|
-
<
|
|
2195
|
-
class="pf-v6-c-
|
|
2196
|
-
|
|
2197
|
-
|
|
2198
|
-
|
|
2199
|
-
|
|
2200
|
-
|
|
2201
|
-
|
|
2202
|
-
|
|
2203
|
-
|
|
2204
|
-
|
|
2205
|
-
|
|
2206
|
-
|
|
2207
|
-
|
|
2208
|
-
|
|
2209
|
-
<
|
|
2210
|
-
|
|
2211
|
-
|
|
2212
|
-
|
|
2213
|
-
|
|
2217
|
+
<label
|
|
2218
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2219
|
+
id="table-tabs-example-tablecheckrow1check"
|
|
2220
|
+
for="table-tabs-example-tablecheckrow1check-input"
|
|
2221
|
+
>
|
|
2222
|
+
<input
|
|
2223
|
+
class="pf-v6-c-check__input"
|
|
2224
|
+
type="checkbox"
|
|
2225
|
+
id="table-tabs-example-tablecheckrow1check-input"
|
|
2226
|
+
name="table-tabs-example-tablecheckrow1check-input"
|
|
2227
|
+
aria-label="Standalone check"
|
|
2228
|
+
/>
|
|
2229
|
+
</label>
|
|
2230
|
+
</td>
|
|
2231
|
+
|
|
2232
|
+
<th
|
|
2233
|
+
class="pf-v6-c-table__th"
|
|
2234
|
+
role="columnheader"
|
|
2235
|
+
data-label="Repository name"
|
|
2236
|
+
>
|
|
2237
|
+
<div>
|
|
2238
|
+
<div id="table-tabs-example-table-node1">Node 1</div>
|
|
2239
|
+
<a href="#">siemur/test-space</a>
|
|
2240
|
+
</div>
|
|
2241
|
+
</th>
|
|
2214
2242
|
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
<
|
|
2243
|
+
<td
|
|
2244
|
+
class="pf-v6-c-table__td"
|
|
2245
|
+
role="cell"
|
|
2246
|
+
data-label="Branches"
|
|
2247
|
+
>
|
|
2248
|
+
<div
|
|
2249
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2250
|
+
>
|
|
2251
|
+
<div class="pf-v6-l-flex__item">10</div>
|
|
2252
|
+
<div class="pf-v6-l-flex__item">
|
|
2253
|
+
<i class="fas fa-code-branch"></i>
|
|
2254
|
+
</div>
|
|
2224
2255
|
</div>
|
|
2225
|
-
</
|
|
2226
|
-
|
|
2227
|
-
|
|
2228
|
-
|
|
2229
|
-
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
|
|
2233
|
-
|
|
2234
|
-
|
|
2235
|
-
<
|
|
2256
|
+
</td>
|
|
2257
|
+
<td
|
|
2258
|
+
class="pf-v6-c-table__td"
|
|
2259
|
+
role="cell"
|
|
2260
|
+
data-label="Pull requests"
|
|
2261
|
+
>
|
|
2262
|
+
<div
|
|
2263
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2264
|
+
>
|
|
2265
|
+
<div class="pf-v6-l-flex__item">25</div>
|
|
2266
|
+
<div class="pf-v6-l-flex__item">
|
|
2267
|
+
<i class="fas fa-code"></i>
|
|
2268
|
+
</div>
|
|
2236
2269
|
</div>
|
|
2237
|
-
</
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
<
|
|
2270
|
+
</td>
|
|
2271
|
+
<td
|
|
2272
|
+
class="pf-v6-c-table__td"
|
|
2273
|
+
role="cell"
|
|
2274
|
+
data-label="Workspaces"
|
|
2275
|
+
>
|
|
2276
|
+
<div
|
|
2277
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2278
|
+
>
|
|
2279
|
+
<div class="pf-v6-l-flex__item">5</div>
|
|
2280
|
+
<div class="pf-v6-l-flex__item">
|
|
2281
|
+
<i class="fas fa-cube"></i>
|
|
2282
|
+
</div>
|
|
2248
2283
|
</div>
|
|
2249
|
-
</
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
2257
|
-
|
|
2258
|
-
|
|
2259
|
-
role="cell"
|
|
2260
|
-
>
|
|
2261
|
-
<button
|
|
2262
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2263
|
-
type="button"
|
|
2264
|
-
aria-expanded="false"
|
|
2265
|
-
aria-label="Table actions"
|
|
2284
|
+
</td>
|
|
2285
|
+
<td
|
|
2286
|
+
class="pf-v6-c-table__td"
|
|
2287
|
+
role="cell"
|
|
2288
|
+
data-label="Last commit"
|
|
2289
|
+
>2 days ago</td>
|
|
2290
|
+
|
|
2291
|
+
<td
|
|
2292
|
+
class="pf-v6-c-table__td pf-v6-c-table__action"
|
|
2293
|
+
role="cell"
|
|
2266
2294
|
>
|
|
2267
|
-
<
|
|
2268
|
-
|
|
2269
|
-
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
|
|
2273
|
-
|
|
2274
|
-
|
|
2275
|
-
|
|
2276
|
-
|
|
2277
|
-
|
|
2278
|
-
>
|
|
2279
|
-
|
|
2280
|
-
|
|
2281
|
-
|
|
2282
|
-
|
|
2295
|
+
<button
|
|
2296
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2297
|
+
type="button"
|
|
2298
|
+
aria-expanded="false"
|
|
2299
|
+
aria-label="Table actions"
|
|
2300
|
+
>
|
|
2301
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
2302
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2303
|
+
</span>
|
|
2304
|
+
</button>
|
|
2305
|
+
</td>
|
|
2306
|
+
</tr>
|
|
2307
|
+
|
|
2308
|
+
<tr class="pf-v6-c-table__tr pf-m-selected" role="row">
|
|
2309
|
+
<td
|
|
2310
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2311
|
+
role="cell"
|
|
2283
2312
|
>
|
|
2284
|
-
<
|
|
2285
|
-
class="pf-v6-c-
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
|
|
2289
|
-
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2298
|
-
|
|
2299
|
-
<
|
|
2300
|
-
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
|
|
2313
|
+
<label
|
|
2314
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2315
|
+
id="table-tabs-example-tablecheckrow2check"
|
|
2316
|
+
for="table-tabs-example-tablecheckrow2check-input"
|
|
2317
|
+
>
|
|
2318
|
+
<input
|
|
2319
|
+
class="pf-v6-c-check__input"
|
|
2320
|
+
type="checkbox"
|
|
2321
|
+
id="table-tabs-example-tablecheckrow2check-input"
|
|
2322
|
+
name="table-tabs-example-tablecheckrow2check-input"
|
|
2323
|
+
aria-label="Standalone check"
|
|
2324
|
+
/>
|
|
2325
|
+
</label>
|
|
2326
|
+
</td>
|
|
2327
|
+
|
|
2328
|
+
<th
|
|
2329
|
+
class="pf-v6-c-table__th"
|
|
2330
|
+
role="columnheader"
|
|
2331
|
+
data-label="Repository name"
|
|
2332
|
+
>
|
|
2333
|
+
<div>
|
|
2334
|
+
<div id="table-tabs-example-table-node2">Node 2</div>
|
|
2335
|
+
<a href="#">siemur/test-space</a>
|
|
2336
|
+
</div>
|
|
2337
|
+
</th>
|
|
2304
2338
|
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2313
|
-
<
|
|
2339
|
+
<td
|
|
2340
|
+
class="pf-v6-c-table__td"
|
|
2341
|
+
role="cell"
|
|
2342
|
+
data-label="Branches"
|
|
2343
|
+
>
|
|
2344
|
+
<div
|
|
2345
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2346
|
+
>
|
|
2347
|
+
<div class="pf-v6-l-flex__item">8</div>
|
|
2348
|
+
<div class="pf-v6-l-flex__item">
|
|
2349
|
+
<i class="fas fa-code-branch"></i>
|
|
2350
|
+
</div>
|
|
2314
2351
|
</div>
|
|
2315
|
-
</
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
<
|
|
2352
|
+
</td>
|
|
2353
|
+
<td
|
|
2354
|
+
class="pf-v6-c-table__td"
|
|
2355
|
+
role="cell"
|
|
2356
|
+
data-label="Pull requests"
|
|
2357
|
+
>
|
|
2358
|
+
<div
|
|
2359
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2360
|
+
>
|
|
2361
|
+
<div class="pf-v6-l-flex__item">30</div>
|
|
2362
|
+
<div class="pf-v6-l-flex__item">
|
|
2363
|
+
<i class="fas fa-code"></i>
|
|
2364
|
+
</div>
|
|
2326
2365
|
</div>
|
|
2327
|
-
</
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
<
|
|
2366
|
+
</td>
|
|
2367
|
+
<td
|
|
2368
|
+
class="pf-v6-c-table__td"
|
|
2369
|
+
role="cell"
|
|
2370
|
+
data-label="Workspaces"
|
|
2371
|
+
>
|
|
2372
|
+
<div
|
|
2373
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2374
|
+
>
|
|
2375
|
+
<div class="pf-v6-l-flex__item">2</div>
|
|
2376
|
+
<div class="pf-v6-l-flex__item">
|
|
2377
|
+
<i class="fas fa-cube"></i>
|
|
2378
|
+
</div>
|
|
2338
2379
|
</div>
|
|
2339
|
-
</
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
2348
|
-
|
|
2349
|
-
role="cell"
|
|
2350
|
-
>
|
|
2351
|
-
<button
|
|
2352
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2353
|
-
type="button"
|
|
2354
|
-
aria-expanded="false"
|
|
2355
|
-
aria-label="Table actions"
|
|
2380
|
+
</td>
|
|
2381
|
+
<td
|
|
2382
|
+
class="pf-v6-c-table__td"
|
|
2383
|
+
role="cell"
|
|
2384
|
+
data-label="Last commit"
|
|
2385
|
+
>2 days ago</td>
|
|
2386
|
+
|
|
2387
|
+
<td
|
|
2388
|
+
class="pf-v6-c-table__td pf-v6-c-table__action"
|
|
2389
|
+
role="cell"
|
|
2356
2390
|
>
|
|
2357
|
-
<
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2365
|
-
|
|
2366
|
-
|
|
2367
|
-
|
|
2368
|
-
>
|
|
2369
|
-
|
|
2370
|
-
|
|
2371
|
-
|
|
2372
|
-
|
|
2391
|
+
<button
|
|
2392
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2393
|
+
type="button"
|
|
2394
|
+
aria-expanded="false"
|
|
2395
|
+
aria-label="Table actions"
|
|
2396
|
+
>
|
|
2397
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
2398
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2399
|
+
</span>
|
|
2400
|
+
</button>
|
|
2401
|
+
</td>
|
|
2402
|
+
</tr>
|
|
2403
|
+
|
|
2404
|
+
<tr class="pf-v6-c-table__tr" role="row">
|
|
2405
|
+
<td
|
|
2406
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2407
|
+
role="cell"
|
|
2373
2408
|
>
|
|
2374
|
-
<
|
|
2375
|
-
class="pf-v6-c-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
|
|
2387
|
-
|
|
2388
|
-
|
|
2389
|
-
<
|
|
2390
|
-
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2409
|
+
<label
|
|
2410
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2411
|
+
id="table-tabs-example-tablecheckrow3check"
|
|
2412
|
+
for="table-tabs-example-tablecheckrow3check-input"
|
|
2413
|
+
>
|
|
2414
|
+
<input
|
|
2415
|
+
class="pf-v6-c-check__input"
|
|
2416
|
+
type="checkbox"
|
|
2417
|
+
id="table-tabs-example-tablecheckrow3check-input"
|
|
2418
|
+
name="table-tabs-example-tablecheckrow3check-input"
|
|
2419
|
+
aria-label="Standalone check"
|
|
2420
|
+
/>
|
|
2421
|
+
</label>
|
|
2422
|
+
</td>
|
|
2423
|
+
|
|
2424
|
+
<th
|
|
2425
|
+
class="pf-v6-c-table__th"
|
|
2426
|
+
role="columnheader"
|
|
2427
|
+
data-label="Repository name"
|
|
2428
|
+
>
|
|
2429
|
+
<div>
|
|
2430
|
+
<div id="table-tabs-example-table-node3">Node 3</div>
|
|
2431
|
+
<a href="#">siemur/test-space</a>
|
|
2432
|
+
</div>
|
|
2433
|
+
</th>
|
|
2394
2434
|
|
|
2395
|
-
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
|
|
2400
|
-
|
|
2401
|
-
|
|
2402
|
-
|
|
2403
|
-
<
|
|
2435
|
+
<td
|
|
2436
|
+
class="pf-v6-c-table__td"
|
|
2437
|
+
role="cell"
|
|
2438
|
+
data-label="Branches"
|
|
2439
|
+
>
|
|
2440
|
+
<div
|
|
2441
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2442
|
+
>
|
|
2443
|
+
<div class="pf-v6-l-flex__item">12</div>
|
|
2444
|
+
<div class="pf-v6-l-flex__item">
|
|
2445
|
+
<i class="fas fa-code-branch"></i>
|
|
2446
|
+
</div>
|
|
2404
2447
|
</div>
|
|
2405
|
-
</
|
|
2406
|
-
|
|
2407
|
-
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
|
|
2413
|
-
|
|
2414
|
-
|
|
2415
|
-
<
|
|
2448
|
+
</td>
|
|
2449
|
+
<td
|
|
2450
|
+
class="pf-v6-c-table__td"
|
|
2451
|
+
role="cell"
|
|
2452
|
+
data-label="Pull requests"
|
|
2453
|
+
>
|
|
2454
|
+
<div
|
|
2455
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2456
|
+
>
|
|
2457
|
+
<div class="pf-v6-l-flex__item">48</div>
|
|
2458
|
+
<div class="pf-v6-l-flex__item">
|
|
2459
|
+
<i class="fas fa-code"></i>
|
|
2460
|
+
</div>
|
|
2416
2461
|
</div>
|
|
2417
|
-
</
|
|
2418
|
-
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
<
|
|
2462
|
+
</td>
|
|
2463
|
+
<td
|
|
2464
|
+
class="pf-v6-c-table__td"
|
|
2465
|
+
role="cell"
|
|
2466
|
+
data-label="Workspaces"
|
|
2467
|
+
>
|
|
2468
|
+
<div
|
|
2469
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2470
|
+
>
|
|
2471
|
+
<div class="pf-v6-l-flex__item">13</div>
|
|
2472
|
+
<div class="pf-v6-l-flex__item">
|
|
2473
|
+
<i class="fas fa-cube"></i>
|
|
2474
|
+
</div>
|
|
2428
2475
|
</div>
|
|
2429
|
-
</
|
|
2430
|
-
|
|
2431
|
-
|
|
2432
|
-
|
|
2433
|
-
|
|
2434
|
-
|
|
2435
|
-
|
|
2436
|
-
|
|
2437
|
-
|
|
2438
|
-
|
|
2439
|
-
role="cell"
|
|
2440
|
-
>
|
|
2441
|
-
<button
|
|
2442
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2443
|
-
type="button"
|
|
2444
|
-
aria-expanded="false"
|
|
2445
|
-
aria-label="Table actions"
|
|
2476
|
+
</td>
|
|
2477
|
+
<td
|
|
2478
|
+
class="pf-v6-c-table__td"
|
|
2479
|
+
role="cell"
|
|
2480
|
+
data-label="Last commit"
|
|
2481
|
+
>30 days ago</td>
|
|
2482
|
+
|
|
2483
|
+
<td
|
|
2484
|
+
class="pf-v6-c-table__td pf-v6-c-table__action"
|
|
2485
|
+
role="cell"
|
|
2446
2486
|
>
|
|
2447
|
-
<
|
|
2448
|
-
|
|
2449
|
-
|
|
2450
|
-
|
|
2451
|
-
|
|
2452
|
-
|
|
2453
|
-
|
|
2454
|
-
|
|
2455
|
-
|
|
2456
|
-
|
|
2457
|
-
|
|
2458
|
-
>
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2462
|
-
|
|
2487
|
+
<button
|
|
2488
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2489
|
+
type="button"
|
|
2490
|
+
aria-expanded="false"
|
|
2491
|
+
aria-label="Table actions"
|
|
2492
|
+
>
|
|
2493
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
2494
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2495
|
+
</span>
|
|
2496
|
+
</button>
|
|
2497
|
+
</td>
|
|
2498
|
+
</tr>
|
|
2499
|
+
|
|
2500
|
+
<tr class="pf-v6-c-table__tr" role="row">
|
|
2501
|
+
<td
|
|
2502
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2503
|
+
role="cell"
|
|
2463
2504
|
>
|
|
2464
|
-
<
|
|
2465
|
-
class="pf-v6-c-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
|
|
2469
|
-
|
|
2470
|
-
|
|
2471
|
-
|
|
2472
|
-
|
|
2473
|
-
|
|
2474
|
-
|
|
2475
|
-
|
|
2476
|
-
|
|
2477
|
-
|
|
2478
|
-
|
|
2479
|
-
<
|
|
2480
|
-
|
|
2481
|
-
|
|
2482
|
-
|
|
2483
|
-
|
|
2505
|
+
<label
|
|
2506
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2507
|
+
id="table-tabs-example-tablecheckrow4check"
|
|
2508
|
+
for="table-tabs-example-tablecheckrow4check-input"
|
|
2509
|
+
>
|
|
2510
|
+
<input
|
|
2511
|
+
class="pf-v6-c-check__input"
|
|
2512
|
+
type="checkbox"
|
|
2513
|
+
id="table-tabs-example-tablecheckrow4check-input"
|
|
2514
|
+
name="table-tabs-example-tablecheckrow4check-input"
|
|
2515
|
+
aria-label="Standalone check"
|
|
2516
|
+
/>
|
|
2517
|
+
</label>
|
|
2518
|
+
</td>
|
|
2519
|
+
|
|
2520
|
+
<th
|
|
2521
|
+
class="pf-v6-c-table__th"
|
|
2522
|
+
role="columnheader"
|
|
2523
|
+
data-label="Repository name"
|
|
2524
|
+
>
|
|
2525
|
+
<div>
|
|
2526
|
+
<div id="table-tabs-example-table-node4">Node 4</div>
|
|
2527
|
+
<a href="#">siemur/test-space</a>
|
|
2528
|
+
</div>
|
|
2529
|
+
</th>
|
|
2484
2530
|
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
|
|
2488
|
-
|
|
2489
|
-
|
|
2490
|
-
|
|
2491
|
-
|
|
2492
|
-
|
|
2493
|
-
<
|
|
2531
|
+
<td
|
|
2532
|
+
class="pf-v6-c-table__td"
|
|
2533
|
+
role="cell"
|
|
2534
|
+
data-label="Branches"
|
|
2535
|
+
>
|
|
2536
|
+
<div
|
|
2537
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2538
|
+
>
|
|
2539
|
+
<div class="pf-v6-l-flex__item">3</div>
|
|
2540
|
+
<div class="pf-v6-l-flex__item">
|
|
2541
|
+
<i class="fas fa-code-branch"></i>
|
|
2542
|
+
</div>
|
|
2494
2543
|
</div>
|
|
2495
|
-
</
|
|
2496
|
-
|
|
2497
|
-
|
|
2498
|
-
|
|
2499
|
-
|
|
2500
|
-
|
|
2501
|
-
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2505
|
-
<
|
|
2544
|
+
</td>
|
|
2545
|
+
<td
|
|
2546
|
+
class="pf-v6-c-table__td"
|
|
2547
|
+
role="cell"
|
|
2548
|
+
data-label="Pull requests"
|
|
2549
|
+
>
|
|
2550
|
+
<div
|
|
2551
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2552
|
+
>
|
|
2553
|
+
<div class="pf-v6-l-flex__item">8</div>
|
|
2554
|
+
<div class="pf-v6-l-flex__item">
|
|
2555
|
+
<i class="fas fa-code"></i>
|
|
2556
|
+
</div>
|
|
2506
2557
|
</div>
|
|
2507
|
-
</
|
|
2508
|
-
|
|
2509
|
-
|
|
2510
|
-
|
|
2511
|
-
|
|
2512
|
-
|
|
2513
|
-
|
|
2514
|
-
|
|
2515
|
-
|
|
2516
|
-
|
|
2517
|
-
<
|
|
2558
|
+
</td>
|
|
2559
|
+
<td
|
|
2560
|
+
class="pf-v6-c-table__td"
|
|
2561
|
+
role="cell"
|
|
2562
|
+
data-label="Workspaces"
|
|
2563
|
+
>
|
|
2564
|
+
<div
|
|
2565
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2566
|
+
>
|
|
2567
|
+
<div class="pf-v6-l-flex__item">20</div>
|
|
2568
|
+
<div class="pf-v6-l-flex__item">
|
|
2569
|
+
<i class="fas fa-cube"></i>
|
|
2570
|
+
</div>
|
|
2518
2571
|
</div>
|
|
2519
|
-
</
|
|
2520
|
-
|
|
2521
|
-
|
|
2522
|
-
|
|
2523
|
-
|
|
2524
|
-
|
|
2525
|
-
|
|
2526
|
-
|
|
2527
|
-
|
|
2528
|
-
|
|
2529
|
-
role="cell"
|
|
2530
|
-
>
|
|
2531
|
-
<button
|
|
2532
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2533
|
-
type="button"
|
|
2534
|
-
aria-expanded="false"
|
|
2535
|
-
aria-label="Table actions"
|
|
2572
|
+
</td>
|
|
2573
|
+
<td
|
|
2574
|
+
class="pf-v6-c-table__td"
|
|
2575
|
+
role="cell"
|
|
2576
|
+
data-label="Last commit"
|
|
2577
|
+
>8 days ago</td>
|
|
2578
|
+
|
|
2579
|
+
<td
|
|
2580
|
+
class="pf-v6-c-table__td pf-v6-c-table__action"
|
|
2581
|
+
role="cell"
|
|
2536
2582
|
>
|
|
2537
|
-
<
|
|
2538
|
-
|
|
2539
|
-
|
|
2540
|
-
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2545
|
-
|
|
2546
|
-
|
|
2547
|
-
|
|
2548
|
-
>
|
|
2549
|
-
|
|
2550
|
-
|
|
2551
|
-
|
|
2552
|
-
|
|
2583
|
+
<button
|
|
2584
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2585
|
+
type="button"
|
|
2586
|
+
aria-expanded="false"
|
|
2587
|
+
aria-label="Table actions"
|
|
2588
|
+
>
|
|
2589
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
2590
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2591
|
+
</span>
|
|
2592
|
+
</button>
|
|
2593
|
+
</td>
|
|
2594
|
+
</tr>
|
|
2595
|
+
|
|
2596
|
+
<tr class="pf-v6-c-table__tr" role="row">
|
|
2597
|
+
<td
|
|
2598
|
+
class="pf-v6-c-table__td pf-v6-c-table__check"
|
|
2599
|
+
role="cell"
|
|
2553
2600
|
>
|
|
2554
|
-
<
|
|
2555
|
-
class="pf-v6-c-
|
|
2556
|
-
|
|
2557
|
-
|
|
2558
|
-
|
|
2559
|
-
|
|
2560
|
-
|
|
2561
|
-
|
|
2562
|
-
|
|
2563
|
-
|
|
2564
|
-
|
|
2565
|
-
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
<
|
|
2569
|
-
|
|
2570
|
-
|
|
2571
|
-
|
|
2572
|
-
|
|
2573
|
-
|
|
2574
|
-
|
|
2575
|
-
|
|
2576
|
-
data-label="Branches"
|
|
2577
|
-
>
|
|
2578
|
-
<div class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap">
|
|
2579
|
-
<div class="pf-v6-l-flex__item">34</div>
|
|
2580
|
-
<div class="pf-v6-l-flex__item">
|
|
2581
|
-
<i class="fas fa-code-branch"></i>
|
|
2601
|
+
<label
|
|
2602
|
+
class="pf-v6-c-check pf-m-standalone"
|
|
2603
|
+
id="table-tabs-example-tablecheckrow5check"
|
|
2604
|
+
for="table-tabs-example-tablecheckrow5check-input"
|
|
2605
|
+
>
|
|
2606
|
+
<input
|
|
2607
|
+
class="pf-v6-c-check__input"
|
|
2608
|
+
type="checkbox"
|
|
2609
|
+
id="table-tabs-example-tablecheckrow5check-input"
|
|
2610
|
+
name="table-tabs-example-tablecheckrow5check-input"
|
|
2611
|
+
aria-label="Standalone check"
|
|
2612
|
+
/>
|
|
2613
|
+
</label>
|
|
2614
|
+
</td>
|
|
2615
|
+
<td
|
|
2616
|
+
class="pf-v6-c-table__td"
|
|
2617
|
+
role="cell"
|
|
2618
|
+
data-label="Repository name"
|
|
2619
|
+
>
|
|
2620
|
+
<div>
|
|
2621
|
+
<div id="table-tabs-example-table-node5">Node 5</div>
|
|
2622
|
+
<a href="#">siemur/test-space</a>
|
|
2582
2623
|
</div>
|
|
2583
|
-
</
|
|
2584
|
-
|
|
2585
|
-
|
|
2586
|
-
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
|
|
2590
|
-
|
|
2591
|
-
|
|
2592
|
-
|
|
2593
|
-
<
|
|
2624
|
+
</td>
|
|
2625
|
+
<td
|
|
2626
|
+
class="pf-v6-c-table__td"
|
|
2627
|
+
role="cell"
|
|
2628
|
+
data-label="Branches"
|
|
2629
|
+
>
|
|
2630
|
+
<div
|
|
2631
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2632
|
+
>
|
|
2633
|
+
<div class="pf-v6-l-flex__item">34</div>
|
|
2634
|
+
<div class="pf-v6-l-flex__item">
|
|
2635
|
+
<i class="fas fa-code-branch"></i>
|
|
2636
|
+
</div>
|
|
2594
2637
|
</div>
|
|
2595
|
-
</
|
|
2596
|
-
|
|
2597
|
-
|
|
2598
|
-
|
|
2599
|
-
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
|
|
2603
|
-
|
|
2604
|
-
|
|
2605
|
-
<
|
|
2638
|
+
</td>
|
|
2639
|
+
<td
|
|
2640
|
+
class="pf-v6-c-table__td"
|
|
2641
|
+
role="cell"
|
|
2642
|
+
data-label="Pull requests"
|
|
2643
|
+
>
|
|
2644
|
+
<div
|
|
2645
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2646
|
+
>
|
|
2647
|
+
<div class="pf-v6-l-flex__item">21</div>
|
|
2648
|
+
<div class="pf-v6-l-flex__item">
|
|
2649
|
+
<i class="fas fa-code"></i>
|
|
2650
|
+
</div>
|
|
2606
2651
|
</div>
|
|
2607
|
-
</
|
|
2608
|
-
|
|
2609
|
-
|
|
2610
|
-
|
|
2611
|
-
|
|
2612
|
-
|
|
2613
|
-
|
|
2614
|
-
|
|
2615
|
-
|
|
2616
|
-
|
|
2617
|
-
|
|
2618
|
-
|
|
2652
|
+
</td>
|
|
2653
|
+
<td
|
|
2654
|
+
class="pf-v6-c-table__td"
|
|
2655
|
+
role="cell"
|
|
2656
|
+
data-label="Workspaces"
|
|
2657
|
+
>
|
|
2658
|
+
<div
|
|
2659
|
+
class="pf-v6-l-flex pf-m-space-items-sm pf-m-nowrap"
|
|
2660
|
+
>
|
|
2661
|
+
<div class="pf-v6-l-flex__item">26</div>
|
|
2662
|
+
<div class="pf-v6-l-flex__item">
|
|
2663
|
+
<i class="fas fa-cube"></i>
|
|
2664
|
+
</div>
|
|
2665
|
+
</div>
|
|
2666
|
+
</td>
|
|
2667
|
+
<td
|
|
2668
|
+
class="pf-v6-c-table__td"
|
|
2669
|
+
role="cell"
|
|
2670
|
+
data-label="Last commit"
|
|
2671
|
+
>2 days ago</td>
|
|
2672
|
+
|
|
2673
|
+
<td
|
|
2674
|
+
class="pf-v6-c-table__td pf-v6-c-table__action"
|
|
2675
|
+
role="cell"
|
|
2676
|
+
>
|
|
2677
|
+
<button
|
|
2678
|
+
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
2679
|
+
type="button"
|
|
2680
|
+
aria-expanded="false"
|
|
2681
|
+
aria-label="Table actions"
|
|
2682
|
+
>
|
|
2683
|
+
<span class="pf-v6-c-menu-toggle__icon">
|
|
2684
|
+
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2685
|
+
</span>
|
|
2686
|
+
</button>
|
|
2687
|
+
</td>
|
|
2688
|
+
</tr>
|
|
2689
|
+
</tbody>
|
|
2690
|
+
</table>
|
|
2691
|
+
</div>
|
|
2692
|
+
</div>
|
|
2693
|
+
|
|
2694
|
+
<!-- Panel -->
|
|
2695
|
+
<div
|
|
2696
|
+
class="pf-v6-c-drawer__panel pf-m-width-33 pf-m-width-33-on-xl"
|
|
2697
|
+
>
|
|
2698
|
+
<div class="pf-v6-c-drawer__body">
|
|
2699
|
+
<div class="pf-v6-c-drawer__head">
|
|
2700
|
+
<div class="pf-v6-c-drawer__actions">
|
|
2701
|
+
<div class="pf-v6-c-drawer__close">
|
|
2619
2702
|
<button
|
|
2620
|
-
class="pf-v6-c-
|
|
2703
|
+
class="pf-v6-c-button pf-m-plain"
|
|
2621
2704
|
type="button"
|
|
2622
|
-
aria-
|
|
2623
|
-
aria-label="Table actions"
|
|
2705
|
+
aria-label="Close drawer panel"
|
|
2624
2706
|
>
|
|
2625
|
-
<
|
|
2626
|
-
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
2627
|
-
</span>
|
|
2707
|
+
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2628
2708
|
</button>
|
|
2629
|
-
</
|
|
2630
|
-
</tr>
|
|
2631
|
-
</tbody>
|
|
2632
|
-
</table>
|
|
2633
|
-
</div>
|
|
2634
|
-
</div>
|
|
2635
|
-
|
|
2636
|
-
<!-- Panel -->
|
|
2637
|
-
<div class="pf-v6-c-drawer__panel pf-m-width-33 pf-m-width-33-on-xl">
|
|
2638
|
-
<div class="pf-v6-c-drawer__body">
|
|
2639
|
-
<div class="pf-v6-c-drawer__head">
|
|
2640
|
-
<div class="pf-v6-c-drawer__actions">
|
|
2641
|
-
<div class="pf-v6-c-drawer__close">
|
|
2642
|
-
<button
|
|
2643
|
-
class="pf-v6-c-button pf-m-plain"
|
|
2644
|
-
type="button"
|
|
2645
|
-
aria-label="Close drawer panel"
|
|
2646
|
-
>
|
|
2647
|
-
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2648
|
-
</button>
|
|
2649
|
-
</div>
|
|
2650
|
-
</div>
|
|
2651
|
-
<div class="pf-v6-l-flex pf-m-column pf-m-space-items-sm">
|
|
2652
|
-
<div class="pf-v6-l-flex__item">
|
|
2653
|
-
<h2 class="pf-v6-c-title pf-m-lg" id="-drawer-label">Node 2</h2>
|
|
2709
|
+
</div>
|
|
2654
2710
|
</div>
|
|
2655
|
-
<div class="pf-v6-l-
|
|
2656
|
-
<
|
|
2711
|
+
<div class="pf-v6-l-flex pf-m-column pf-m-space-items-sm">
|
|
2712
|
+
<div class="pf-v6-l-flex__item">
|
|
2713
|
+
<h2
|
|
2714
|
+
class="pf-v6-c-title pf-m-lg"
|
|
2715
|
+
id="-drawer-label"
|
|
2716
|
+
>Node 2</h2>
|
|
2717
|
+
</div>
|
|
2718
|
+
<div class="pf-v6-l-flex__item">
|
|
2719
|
+
<a href="#">siemur/test-space</a>
|
|
2720
|
+
</div>
|
|
2657
2721
|
</div>
|
|
2658
2722
|
</div>
|
|
2659
2723
|
</div>
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
|
|
2664
|
-
|
|
2665
|
-
|
|
2666
|
-
|
|
2667
|
-
<div class="pf-v6-c-tabs__scroll-button">
|
|
2668
|
-
<button
|
|
2669
|
-
class="pf-v6-c-button pf-m-plain"
|
|
2670
|
-
type="button"
|
|
2671
|
-
aria-label="Scroll left"
|
|
2672
|
-
>
|
|
2673
|
-
<i class="fas fa-angle-left" aria-hidden="true"></i>
|
|
2674
|
-
</button>
|
|
2675
|
-
</div>
|
|
2676
|
-
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
2677
|
-
<li
|
|
2678
|
-
class="pf-v6-c-tabs__item pf-m-current"
|
|
2679
|
-
role="presentation"
|
|
2680
|
-
>
|
|
2724
|
+
<div class="pf-v6-c-drawer__body pf-m-no-padding">
|
|
2725
|
+
<div
|
|
2726
|
+
class="pf-v6-c-tabs pf-m-box pf-m-fill"
|
|
2727
|
+
role="region"
|
|
2728
|
+
id="-tabs"
|
|
2729
|
+
>
|
|
2730
|
+
<div class="pf-v6-c-tabs__scroll-button">
|
|
2681
2731
|
<button
|
|
2732
|
+
class="pf-v6-c-button pf-m-plain"
|
|
2682
2733
|
type="button"
|
|
2683
|
-
|
|
2684
|
-
role="tab"
|
|
2685
|
-
aria-controls="-tabs-tab1-panel"
|
|
2686
|
-
id="-tabs-tab1-link"
|
|
2734
|
+
aria-label="Scroll left"
|
|
2687
2735
|
>
|
|
2688
|
-
<
|
|
2736
|
+
<i class="fas fa-angle-left" aria-hidden="true"></i>
|
|
2689
2737
|
</button>
|
|
2690
|
-
</
|
|
2691
|
-
<
|
|
2738
|
+
</div>
|
|
2739
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
2740
|
+
<li
|
|
2741
|
+
class="pf-v6-c-tabs__item pf-m-current"
|
|
2742
|
+
role="presentation"
|
|
2743
|
+
>
|
|
2744
|
+
<button
|
|
2745
|
+
type="button"
|
|
2746
|
+
class="pf-v6-c-tabs__link"
|
|
2747
|
+
role="tab"
|
|
2748
|
+
aria-controls="-tabs-tab1-panel"
|
|
2749
|
+
id="-tabs-tab1-link"
|
|
2750
|
+
>
|
|
2751
|
+
<span class="pf-v6-c-tabs__item-text">Overview</span>
|
|
2752
|
+
</button>
|
|
2753
|
+
</li>
|
|
2754
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
2755
|
+
<button
|
|
2756
|
+
type="button"
|
|
2757
|
+
class="pf-v6-c-tabs__link"
|
|
2758
|
+
role="tab"
|
|
2759
|
+
aria-controls="-tabs-tab2-panel"
|
|
2760
|
+
id="-tabs-tab2-link"
|
|
2761
|
+
>
|
|
2762
|
+
<span class="pf-v6-c-tabs__item-text">Activity</span>
|
|
2763
|
+
</button>
|
|
2764
|
+
</li>
|
|
2765
|
+
</ul>
|
|
2766
|
+
<div class="pf-v6-c-tabs__scroll-button">
|
|
2692
2767
|
<button
|
|
2768
|
+
class="pf-v6-c-button pf-m-plain"
|
|
2693
2769
|
type="button"
|
|
2694
|
-
|
|
2695
|
-
role="tab"
|
|
2696
|
-
aria-controls="-tabs-tab2-panel"
|
|
2697
|
-
id="-tabs-tab2-link"
|
|
2770
|
+
aria-label="Scroll right"
|
|
2698
2771
|
>
|
|
2699
|
-
<
|
|
2772
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
2700
2773
|
</button>
|
|
2701
|
-
</
|
|
2702
|
-
</ul>
|
|
2703
|
-
<div class="pf-v6-c-tabs__scroll-button">
|
|
2704
|
-
<button
|
|
2705
|
-
class="pf-v6-c-button pf-m-plain"
|
|
2706
|
-
type="button"
|
|
2707
|
-
aria-label="Scroll right"
|
|
2708
|
-
>
|
|
2709
|
-
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
2710
|
-
</button>
|
|
2774
|
+
</div>
|
|
2711
2775
|
</div>
|
|
2712
2776
|
</div>
|
|
2713
|
-
|
|
2714
|
-
|
|
2715
|
-
|
|
2716
|
-
|
|
2717
|
-
|
|
2718
|
-
|
|
2719
|
-
|
|
2720
|
-
|
|
2721
|
-
|
|
2722
|
-
|
|
2723
|
-
|
|
2724
|
-
|
|
2725
|
-
|
|
2726
|
-
|
|
2727
|
-
<div class="pf-v6-l-flex__item">
|
|
2728
|
-
<div
|
|
2729
|
-
class="pf-v6-c-progress pf-m-sm"
|
|
2730
|
-
id="-progress-example1"
|
|
2731
|
-
>
|
|
2732
|
-
<div
|
|
2733
|
-
class="pf-v6-c-progress__description"
|
|
2734
|
-
id="-progress-example1-description"
|
|
2735
|
-
>Capacity</div>
|
|
2736
|
-
<div
|
|
2737
|
-
class="pf-v6-c-progress__status"
|
|
2738
|
-
aria-hidden="true"
|
|
2739
|
-
>
|
|
2740
|
-
<span class="pf-v6-c-progress__measure">33%</span>
|
|
2741
|
-
</div>
|
|
2777
|
+
<div class="pf-v6-c-drawer__body">
|
|
2778
|
+
<section
|
|
2779
|
+
class="pf-v6-c-tab-content"
|
|
2780
|
+
id="-tabs-tab1-panel"
|
|
2781
|
+
aria-labelledby="-tabs-tab1-link"
|
|
2782
|
+
role="tabpanel"
|
|
2783
|
+
tabindex="0"
|
|
2784
|
+
>
|
|
2785
|
+
<div class="pf-v6-c-tab-content__body">
|
|
2786
|
+
<div class="pf-v6-l-flex pf-m-column pf-m-space-items-lg">
|
|
2787
|
+
<div class="pf-v6-l-flex__item">
|
|
2788
|
+
<p>The content of the drawer really is up to you. It could have form fields, definition lists, text lists, labels, charts, progress bars, etc. Spacing recommendation is 24px margins. You can put tabs in here, and can also make the drawer scrollable.</p>
|
|
2789
|
+
</div>
|
|
2790
|
+
<div class="pf-v6-l-flex__item">
|
|
2742
2791
|
<div
|
|
2743
|
-
class="pf-v6-c-
|
|
2744
|
-
|
|
2745
|
-
aria-valuemin="0"
|
|
2746
|
-
aria-valuemax="100"
|
|
2747
|
-
aria-valuenow="33"
|
|
2748
|
-
aria-labelledby="-progress-example1-description"
|
|
2749
|
-
aria-label="Progress 1"
|
|
2792
|
+
class="pf-v6-c-progress pf-m-sm"
|
|
2793
|
+
id="-progress-example1"
|
|
2750
2794
|
>
|
|
2751
2795
|
<div
|
|
2752
|
-
class="pf-v6-c-
|
|
2753
|
-
|
|
2754
|
-
|
|
2796
|
+
class="pf-v6-c-progress__description"
|
|
2797
|
+
id="-progress-example1-description"
|
|
2798
|
+
>Capacity</div>
|
|
2799
|
+
<div
|
|
2800
|
+
class="pf-v6-c-progress__status"
|
|
2801
|
+
aria-hidden="true"
|
|
2802
|
+
>
|
|
2803
|
+
<span class="pf-v6-c-progress__measure">33%</span>
|
|
2804
|
+
</div>
|
|
2805
|
+
<div
|
|
2806
|
+
class="pf-v6-c-progress__bar"
|
|
2807
|
+
role="progressbar"
|
|
2808
|
+
aria-valuemin="0"
|
|
2809
|
+
aria-valuemax="100"
|
|
2810
|
+
aria-valuenow="33"
|
|
2811
|
+
aria-labelledby="-progress-example1-description"
|
|
2812
|
+
aria-label="Progress 1"
|
|
2813
|
+
>
|
|
2814
|
+
<div
|
|
2815
|
+
class="pf-v6-c-progress__indicator"
|
|
2816
|
+
style="width:33%;"
|
|
2817
|
+
></div>
|
|
2818
|
+
</div>
|
|
2755
2819
|
</div>
|
|
2756
2820
|
</div>
|
|
2757
|
-
|
|
2758
|
-
<div class="pf-v6-l-flex__item">
|
|
2759
|
-
<div
|
|
2760
|
-
class="pf-v6-c-progress pf-m-sm"
|
|
2761
|
-
id="-progress-example2"
|
|
2762
|
-
>
|
|
2763
|
-
<div
|
|
2764
|
-
class="pf-v6-c-progress__description"
|
|
2765
|
-
id="-progress-example2-description"
|
|
2766
|
-
>Modules</div>
|
|
2767
|
-
<div
|
|
2768
|
-
class="pf-v6-c-progress__status"
|
|
2769
|
-
aria-hidden="true"
|
|
2770
|
-
>
|
|
2771
|
-
<span class="pf-v6-c-progress__measure">66%</span>
|
|
2772
|
-
</div>
|
|
2821
|
+
<div class="pf-v6-l-flex__item">
|
|
2773
2822
|
<div
|
|
2774
|
-
class="pf-v6-c-
|
|
2775
|
-
|
|
2776
|
-
aria-valuemin="0"
|
|
2777
|
-
aria-valuemax="100"
|
|
2778
|
-
aria-valuenow="66"
|
|
2779
|
-
aria-labelledby="-progress-example2-description"
|
|
2780
|
-
aria-label="Progress 2"
|
|
2823
|
+
class="pf-v6-c-progress pf-m-sm"
|
|
2824
|
+
id="-progress-example2"
|
|
2781
2825
|
>
|
|
2782
2826
|
<div
|
|
2783
|
-
class="pf-v6-c-
|
|
2784
|
-
|
|
2785
|
-
|
|
2827
|
+
class="pf-v6-c-progress__description"
|
|
2828
|
+
id="-progress-example2-description"
|
|
2829
|
+
>Modules</div>
|
|
2830
|
+
<div
|
|
2831
|
+
class="pf-v6-c-progress__status"
|
|
2832
|
+
aria-hidden="true"
|
|
2833
|
+
>
|
|
2834
|
+
<span class="pf-v6-c-progress__measure">66%</span>
|
|
2835
|
+
</div>
|
|
2836
|
+
<div
|
|
2837
|
+
class="pf-v6-c-progress__bar"
|
|
2838
|
+
role="progressbar"
|
|
2839
|
+
aria-valuemin="0"
|
|
2840
|
+
aria-valuemax="100"
|
|
2841
|
+
aria-valuenow="66"
|
|
2842
|
+
aria-labelledby="-progress-example2-description"
|
|
2843
|
+
aria-label="Progress 2"
|
|
2844
|
+
>
|
|
2845
|
+
<div
|
|
2846
|
+
class="pf-v6-c-progress__indicator"
|
|
2847
|
+
style="width:66%;"
|
|
2848
|
+
></div>
|
|
2849
|
+
</div>
|
|
2786
2850
|
</div>
|
|
2787
2851
|
</div>
|
|
2788
|
-
|
|
2789
|
-
|
|
2790
|
-
|
|
2791
|
-
|
|
2792
|
-
|
|
2793
|
-
|
|
2794
|
-
|
|
2795
|
-
|
|
2796
|
-
|
|
2797
|
-
|
|
2798
|
-
|
|
2799
|
-
|
|
2800
|
-
|
|
2801
|
-
|
|
2802
|
-
|
|
2803
|
-
|
|
2804
|
-
|
|
2805
|
-
</span>
|
|
2806
|
-
</span>
|
|
2807
|
-
</li>
|
|
2808
|
-
<li class="pf-v6-c-label-group__list-item">
|
|
2809
|
-
<span class="pf-v6-c-label pf-m-outline">
|
|
2810
|
-
<span class="pf-v6-c-label__content">
|
|
2811
|
-
<span class="pf-v6-c-label__text">Tag 2</span>
|
|
2852
|
+
<div class="pf-v6-l-flex pf-m-column">
|
|
2853
|
+
<div class="pf-v6-l-flex__item">
|
|
2854
|
+
<h3 class="pf-v6-c-title" id="-title">Tags</h3>
|
|
2855
|
+
</div>
|
|
2856
|
+
<div class="pf-v6-l-flex__item">
|
|
2857
|
+
<div class="pf-v6-c-label-group">
|
|
2858
|
+
<div class="pf-v6-c-label-group__main">
|
|
2859
|
+
<ul
|
|
2860
|
+
class="pf-v6-c-label-group__list"
|
|
2861
|
+
role="list"
|
|
2862
|
+
aria-label="Group of labels"
|
|
2863
|
+
>
|
|
2864
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
2865
|
+
<span class="pf-v6-c-label pf-m-outline">
|
|
2866
|
+
<span class="pf-v6-c-label__content">
|
|
2867
|
+
<span class="pf-v6-c-label__text">Tag 1</span>
|
|
2868
|
+
</span>
|
|
2812
2869
|
</span>
|
|
2813
|
-
</
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2870
|
+
</li>
|
|
2871
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
2872
|
+
<span class="pf-v6-c-label pf-m-outline">
|
|
2873
|
+
<span class="pf-v6-c-label__content">
|
|
2874
|
+
<span class="pf-v6-c-label__text">Tag 2</span>
|
|
2875
|
+
</span>
|
|
2819
2876
|
</span>
|
|
2820
|
-
</
|
|
2821
|
-
|
|
2822
|
-
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
>
|
|
2827
|
-
<span class="pf-v6-c-label__content">
|
|
2828
|
-
<span class="pf-v6-c-label__text">2 more</span>
|
|
2877
|
+
</li>
|
|
2878
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
2879
|
+
<span class="pf-v6-c-label pf-m-outline">
|
|
2880
|
+
<span class="pf-v6-c-label__content">
|
|
2881
|
+
<span class="pf-v6-c-label__text">Tag 3</span>
|
|
2882
|
+
</span>
|
|
2829
2883
|
</span>
|
|
2830
|
-
</
|
|
2831
|
-
|
|
2832
|
-
|
|
2884
|
+
</li>
|
|
2885
|
+
<li class="pf-v6-c-label-group__list-item">
|
|
2886
|
+
<button
|
|
2887
|
+
class="pf-v6-c-label pf-m-overflow"
|
|
2888
|
+
type="button"
|
|
2889
|
+
>
|
|
2890
|
+
<span class="pf-v6-c-label__content">
|
|
2891
|
+
<span class="pf-v6-c-label__text">2 more</span>
|
|
2892
|
+
</span>
|
|
2893
|
+
</button>
|
|
2894
|
+
</li>
|
|
2895
|
+
</ul>
|
|
2896
|
+
</div>
|
|
2833
2897
|
</div>
|
|
2834
2898
|
</div>
|
|
2835
2899
|
</div>
|
|
2836
2900
|
</div>
|
|
2837
2901
|
</div>
|
|
2838
|
-
</
|
|
2839
|
-
|
|
2840
|
-
|
|
2841
|
-
|
|
2842
|
-
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
|
|
2849
|
-
</
|
|
2902
|
+
</section>
|
|
2903
|
+
<section
|
|
2904
|
+
class="pf-v6-c-tab-content"
|
|
2905
|
+
id="-tabs-tab2-panel"
|
|
2906
|
+
aria-labelledby="-tabs-tab2-link"
|
|
2907
|
+
role="tabpanel"
|
|
2908
|
+
tabindex="0"
|
|
2909
|
+
hidden
|
|
2910
|
+
>
|
|
2911
|
+
<div class="pf-v6-c-tab-content__body">Panel 2</div>
|
|
2912
|
+
</section>
|
|
2913
|
+
</div>
|
|
2850
2914
|
</div>
|
|
2851
2915
|
</div>
|
|
2852
2916
|
</div>
|
|
2853
|
-
</
|
|
2854
|
-
</
|
|
2855
|
-
</
|
|
2917
|
+
</section>
|
|
2918
|
+
</main>
|
|
2919
|
+
</div>
|
|
2856
2920
|
</div>
|
|
2857
2921
|
|
|
2858
2922
|
```
|
|
@@ -3182,93 +3246,95 @@ section: components
|
|
|
3182
3246
|
</nav>
|
|
3183
3247
|
</div>
|
|
3184
3248
|
</div>
|
|
3185
|
-
<
|
|
3186
|
-
|
|
3187
|
-
|
|
3188
|
-
|
|
3189
|
-
|
|
3190
|
-
|
|
3191
|
-
<
|
|
3192
|
-
<
|
|
3193
|
-
<
|
|
3194
|
-
<
|
|
3195
|
-
<
|
|
3196
|
-
|
|
3197
|
-
|
|
3198
|
-
<
|
|
3199
|
-
<
|
|
3200
|
-
|
|
3201
|
-
|
|
3202
|
-
|
|
3203
|
-
|
|
3204
|
-
|
|
3205
|
-
<
|
|
3206
|
-
<
|
|
3207
|
-
|
|
3208
|
-
|
|
3209
|
-
|
|
3210
|
-
|
|
3211
|
-
|
|
3212
|
-
<
|
|
3213
|
-
<
|
|
3214
|
-
|
|
3215
|
-
|
|
3216
|
-
|
|
3217
|
-
|
|
3218
|
-
|
|
3219
|
-
|
|
3220
|
-
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
</section>
|
|
3226
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
3227
|
-
<div class="pf-v6-c-page__main-body">
|
|
3228
|
-
<div class="pf-v6-c-content">
|
|
3229
|
-
<h1>Main title</h1>
|
|
3230
|
-
<p>This is a full page demo.</p>
|
|
3249
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
3250
|
+
<main
|
|
3251
|
+
class="pf-v6-c-page__main"
|
|
3252
|
+
tabindex="-1"
|
|
3253
|
+
id="main-content-modal-tabs-example"
|
|
3254
|
+
>
|
|
3255
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
3256
|
+
<div class="pf-v6-c-page__main-body">
|
|
3257
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
3258
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
3259
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3260
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
3261
|
+
</li>
|
|
3262
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3263
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3264
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3265
|
+
</span>
|
|
3266
|
+
|
|
3267
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
3268
|
+
</li>
|
|
3269
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3270
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3271
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3272
|
+
</span>
|
|
3273
|
+
|
|
3274
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
3275
|
+
</li>
|
|
3276
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3277
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3278
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3279
|
+
</span>
|
|
3280
|
+
|
|
3281
|
+
<a
|
|
3282
|
+
href="#"
|
|
3283
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
3284
|
+
aria-current="page"
|
|
3285
|
+
>Section landing</a>
|
|
3286
|
+
</li>
|
|
3287
|
+
</ol>
|
|
3288
|
+
</nav>
|
|
3231
3289
|
</div>
|
|
3232
|
-
</
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
|
|
3237
|
-
|
|
3238
|
-
id="modal-tabs-example-card-1"
|
|
3239
|
-
>
|
|
3240
|
-
<div class="pf-v6-c-card__title">
|
|
3241
|
-
<h2 class="pf-v6-c-card__title-text">PatternFly</h2>
|
|
3290
|
+
</section>
|
|
3291
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
3292
|
+
<div class="pf-v6-c-page__main-body">
|
|
3293
|
+
<div class="pf-v6-c-content">
|
|
3294
|
+
<h1>Main title</h1>
|
|
3295
|
+
<p>This is a full page demo.</p>
|
|
3242
3296
|
</div>
|
|
3243
|
-
<div
|
|
3244
|
-
class="pf-v6-c-card__body"
|
|
3245
|
-
>PatternFly is a community project that promotes design commonality and improves user experience.</div>
|
|
3246
3297
|
</div>
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3250
|
-
|
|
3251
|
-
|
|
3252
|
-
|
|
3298
|
+
</section>
|
|
3299
|
+
<section class="pf-v6-c-page__main-section">
|
|
3300
|
+
<div class="pf-v6-l-gallery pf-m-gutter">
|
|
3301
|
+
<div
|
|
3302
|
+
class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
|
|
3303
|
+
id="modal-tabs-example-card-1"
|
|
3304
|
+
>
|
|
3305
|
+
<div class="pf-v6-c-card__title">
|
|
3306
|
+
<h2 class="pf-v6-c-card__title-text">PatternFly</h2>
|
|
3307
|
+
</div>
|
|
3308
|
+
<div
|
|
3309
|
+
class="pf-v6-c-card__body"
|
|
3310
|
+
>PatternFly is a community project that promotes design commonality and improves user experience.</div>
|
|
3253
3311
|
</div>
|
|
3254
3312
|
<div
|
|
3255
|
-
class="pf-v6-c-
|
|
3256
|
-
|
|
3257
|
-
|
|
3258
|
-
|
|
3259
|
-
|
|
3260
|
-
|
|
3261
|
-
|
|
3262
|
-
|
|
3263
|
-
|
|
3313
|
+
class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
|
|
3314
|
+
id="modal-tabs-example-card-2"
|
|
3315
|
+
>
|
|
3316
|
+
<div class="pf-v6-c-card__title">
|
|
3317
|
+
<h2 class="pf-v6-c-card__title-text">ActiveMQ</h2>
|
|
3318
|
+
</div>
|
|
3319
|
+
<div
|
|
3320
|
+
class="pf-v6-c-card__body"
|
|
3321
|
+
>The ActiveMQ component allows messages to be sent to a JMS Queue or Topic; or messages to be consumed from a JMS Queue or Topic using Apache ActiveMQ.</div>
|
|
3264
3322
|
</div>
|
|
3265
3323
|
<div
|
|
3266
|
-
class="pf-v6-c-
|
|
3267
|
-
|
|
3324
|
+
class="pf-v6-c-card pf-m-selectable-raised pf-m-compact"
|
|
3325
|
+
id="modal-tabs-example-card-3"
|
|
3326
|
+
>
|
|
3327
|
+
<div class="pf-v6-c-card__title">
|
|
3328
|
+
<h2 class="pf-v6-c-card__title-text">Apache Spark</h2>
|
|
3329
|
+
</div>
|
|
3330
|
+
<div
|
|
3331
|
+
class="pf-v6-c-card__body"
|
|
3332
|
+
>This documentation page covers the Apache Spark component for the Apache Camel.</div>
|
|
3333
|
+
</div>
|
|
3268
3334
|
</div>
|
|
3269
|
-
</
|
|
3270
|
-
</
|
|
3271
|
-
</
|
|
3335
|
+
</section>
|
|
3336
|
+
</main>
|
|
3337
|
+
</div>
|
|
3272
3338
|
</div>
|
|
3273
3339
|
|
|
3274
3340
|
```
|
|
@@ -3496,280 +3562,282 @@ section: components
|
|
|
3496
3562
|
</nav>
|
|
3497
3563
|
</div>
|
|
3498
3564
|
</div>
|
|
3499
|
-
<
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
<
|
|
3506
|
-
<
|
|
3507
|
-
<
|
|
3508
|
-
<
|
|
3509
|
-
<
|
|
3510
|
-
|
|
3511
|
-
|
|
3512
|
-
<
|
|
3513
|
-
<
|
|
3514
|
-
|
|
3515
|
-
|
|
3516
|
-
|
|
3517
|
-
|
|
3518
|
-
|
|
3519
|
-
<
|
|
3520
|
-
<
|
|
3521
|
-
|
|
3522
|
-
|
|
3523
|
-
|
|
3524
|
-
|
|
3525
|
-
|
|
3526
|
-
<
|
|
3527
|
-
<
|
|
3528
|
-
|
|
3529
|
-
|
|
3530
|
-
|
|
3531
|
-
|
|
3532
|
-
|
|
3533
|
-
|
|
3534
|
-
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3538
|
-
|
|
3539
|
-
</section>
|
|
3540
|
-
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
3541
|
-
<div class="pf-v6-c-page__main-body">
|
|
3542
|
-
<div class="pf-v6-c-content">
|
|
3543
|
-
<h1>Main title</h1>
|
|
3544
|
-
<p>This is a full page demo.</p>
|
|
3565
|
+
<div class="pf-v6-c-page__main-container" tabindex="-1">
|
|
3566
|
+
<main
|
|
3567
|
+
class="pf-v6-c-page__main"
|
|
3568
|
+
tabindex="-1"
|
|
3569
|
+
id="main-content-gray-tabs-example"
|
|
3570
|
+
>
|
|
3571
|
+
<section class="pf-v6-c-page__main-breadcrumb pf-m-limit-width">
|
|
3572
|
+
<div class="pf-v6-c-page__main-body">
|
|
3573
|
+
<nav class="pf-v6-c-breadcrumb" aria-label="breadcrumb">
|
|
3574
|
+
<ol class="pf-v6-c-breadcrumb__list" role="list">
|
|
3575
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3576
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section home</a>
|
|
3577
|
+
</li>
|
|
3578
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3579
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3580
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3581
|
+
</span>
|
|
3582
|
+
|
|
3583
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
3584
|
+
</li>
|
|
3585
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3586
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3587
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3588
|
+
</span>
|
|
3589
|
+
|
|
3590
|
+
<a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
|
|
3591
|
+
</li>
|
|
3592
|
+
<li class="pf-v6-c-breadcrumb__item">
|
|
3593
|
+
<span class="pf-v6-c-breadcrumb__item-divider">
|
|
3594
|
+
<i class="fas fa-angle-right" aria-hidden="true"></i>
|
|
3595
|
+
</span>
|
|
3596
|
+
|
|
3597
|
+
<a
|
|
3598
|
+
href="#"
|
|
3599
|
+
class="pf-v6-c-breadcrumb__link pf-m-current"
|
|
3600
|
+
aria-current="page"
|
|
3601
|
+
>Section landing</a>
|
|
3602
|
+
</li>
|
|
3603
|
+
</ol>
|
|
3604
|
+
</nav>
|
|
3545
3605
|
</div>
|
|
3546
|
-
</
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
id="gray-tabs-example-tabs-tabs"
|
|
3554
|
-
>
|
|
3555
|
-
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
3556
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3557
|
-
<button
|
|
3558
|
-
type="button"
|
|
3559
|
-
class="pf-v6-c-tabs__link"
|
|
3560
|
-
role="tab"
|
|
3561
|
-
aria-controls="gray-tabs-example-tabs-tabs-new-panel"
|
|
3562
|
-
id="gray-tabs-example-tabs-tabs-new-link"
|
|
3563
|
-
>
|
|
3564
|
-
<span class="pf-v6-c-tabs__item-text">What's new</span>
|
|
3565
|
-
</button>
|
|
3566
|
-
</li>
|
|
3567
|
-
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
3568
|
-
<button
|
|
3569
|
-
type="button"
|
|
3570
|
-
class="pf-v6-c-tabs__link"
|
|
3571
|
-
role="tab"
|
|
3572
|
-
aria-controls="gray-tabs-example-tabs-tabs-get-started-panel"
|
|
3573
|
-
id="gray-tabs-example-tabs-tabs-get-started-link"
|
|
3574
|
-
>
|
|
3575
|
-
<span class="pf-v6-c-tabs__item-text">Get started</span>
|
|
3576
|
-
</button>
|
|
3577
|
-
</li>
|
|
3578
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3579
|
-
<button
|
|
3580
|
-
type="button"
|
|
3581
|
-
class="pf-v6-c-tabs__link"
|
|
3582
|
-
role="tab"
|
|
3583
|
-
aria-controls="gray-tabs-example-tabs-tabs-knowledge-panel"
|
|
3584
|
-
id="gray-tabs-example-tabs-tabs-knowledge-link"
|
|
3585
|
-
>
|
|
3586
|
-
<span class="pf-v6-c-tabs__item-text">Knowledge</span>
|
|
3587
|
-
</button>
|
|
3588
|
-
</li>
|
|
3589
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3590
|
-
<button
|
|
3591
|
-
type="button"
|
|
3592
|
-
class="pf-v6-c-tabs__link"
|
|
3593
|
-
role="tab"
|
|
3594
|
-
aria-controls="gray-tabs-example-tabs-tabs-support-panel"
|
|
3595
|
-
id="gray-tabs-example-tabs-tabs-support-link"
|
|
3596
|
-
>
|
|
3597
|
-
<span class="pf-v6-c-tabs__item-text">Support</span>
|
|
3598
|
-
</button>
|
|
3599
|
-
</li>
|
|
3600
|
-
</ul>
|
|
3606
|
+
</section>
|
|
3607
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
3608
|
+
<div class="pf-v6-c-page__main-body">
|
|
3609
|
+
<div class="pf-v6-c-content">
|
|
3610
|
+
<h1>Main title</h1>
|
|
3611
|
+
<p>This is a full page demo.</p>
|
|
3612
|
+
</div>
|
|
3601
3613
|
</div>
|
|
3602
|
-
</
|
|
3603
|
-
|
|
3604
|
-
|
|
3605
|
-
|
|
3606
|
-
|
|
3607
|
-
|
|
3608
|
-
|
|
3609
|
-
|
|
3610
|
-
|
|
3611
|
-
|
|
3612
|
-
|
|
3613
|
-
|
|
3614
|
-
|
|
3615
|
-
|
|
3616
|
-
|
|
3617
|
-
|
|
3618
|
-
aria-labelledby="gray-tabs-example-tabs-tabs-get-started-link"
|
|
3619
|
-
id="gray-tabs-example-tabs-tabs-get-started-panel"
|
|
3620
|
-
role="tabpanel"
|
|
3621
|
-
tabindex="0"
|
|
3622
|
-
>
|
|
3623
|
-
<div class="pf-v6-c-tab-content__body">
|
|
3624
|
-
<div class="pf-v6-l-grid pf-m-gutter">
|
|
3625
|
-
<div class="pf-v6-l-grid__item">
|
|
3626
|
-
<h1
|
|
3627
|
-
class="pf-v6-c-title pf-m-lg"
|
|
3628
|
-
>Get started with Red Hat Enterprise Linux</h1>
|
|
3629
|
-
</div>
|
|
3630
|
-
<div class="pf-v6-l-grid__item">
|
|
3631
|
-
<div
|
|
3632
|
-
class="pf-v6-c-tabs pf-m-inset-none"
|
|
3633
|
-
role="region"
|
|
3634
|
-
id="gray-tabs-example-tabs-subtabs"
|
|
3614
|
+
</section>
|
|
3615
|
+
<section class="pf-v6-c-page__main-tabs pf-m-limit-width">
|
|
3616
|
+
<div class="pf-v6-c-page__main-body">
|
|
3617
|
+
<div
|
|
3618
|
+
class="pf-v6-c-tabs pf-m-page-insets"
|
|
3619
|
+
role="region"
|
|
3620
|
+
id="gray-tabs-example-tabs-tabs"
|
|
3621
|
+
>
|
|
3622
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
3623
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3624
|
+
<button
|
|
3625
|
+
type="button"
|
|
3626
|
+
class="pf-v6-c-tabs__link"
|
|
3627
|
+
role="tab"
|
|
3628
|
+
aria-controls="gray-tabs-example-tabs-tabs-new-panel"
|
|
3629
|
+
id="gray-tabs-example-tabs-tabs-new-link"
|
|
3635
3630
|
>
|
|
3636
|
-
<
|
|
3637
|
-
|
|
3638
|
-
|
|
3639
|
-
|
|
3640
|
-
|
|
3641
|
-
|
|
3642
|
-
|
|
3643
|
-
|
|
3644
|
-
|
|
3645
|
-
|
|
3646
|
-
id="gray-tabs-example-tabs-subtabs-x86-link"
|
|
3647
|
-
>
|
|
3648
|
-
<span class="pf-v6-c-tabs__item-text">x86 architecture</span>
|
|
3649
|
-
</button>
|
|
3650
|
-
</li>
|
|
3651
|
-
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3652
|
-
<button
|
|
3653
|
-
type="button"
|
|
3654
|
-
class="pf-v6-c-tabs__link"
|
|
3655
|
-
role="tab"
|
|
3656
|
-
aria-controls="gray-tabs-example-tabs-subtabs-additional-architectures-panel"
|
|
3657
|
-
id="gray-tabs-example-tabs-subtabs-additional-architectures-link"
|
|
3658
|
-
>
|
|
3659
|
-
<span
|
|
3660
|
-
class="pf-v6-c-tabs__item-text"
|
|
3661
|
-
>Additional Architectures</span>
|
|
3662
|
-
</button>
|
|
3663
|
-
</li>
|
|
3664
|
-
</ul>
|
|
3665
|
-
</div>
|
|
3666
|
-
</div>
|
|
3667
|
-
<div class="pf-v6-l-grid__item">
|
|
3668
|
-
<section
|
|
3669
|
-
class="pf-v6-c-tab-content"
|
|
3670
|
-
aria-labelledby="gray-tabs-example-tabs-subtabs-x86-link"
|
|
3671
|
-
id="gray-tabs-example-tabs-subtabs-x86-panel"
|
|
3672
|
-
role="tabpanel"
|
|
3673
|
-
tabindex="0"
|
|
3631
|
+
<span class="pf-v6-c-tabs__item-text">What's new</span>
|
|
3632
|
+
</button>
|
|
3633
|
+
</li>
|
|
3634
|
+
<li class="pf-v6-c-tabs__item pf-m-current" role="presentation">
|
|
3635
|
+
<button
|
|
3636
|
+
type="button"
|
|
3637
|
+
class="pf-v6-c-tabs__link"
|
|
3638
|
+
role="tab"
|
|
3639
|
+
aria-controls="gray-tabs-example-tabs-tabs-get-started-panel"
|
|
3640
|
+
id="gray-tabs-example-tabs-tabs-get-started-link"
|
|
3674
3641
|
>
|
|
3675
|
-
<
|
|
3676
|
-
|
|
3677
|
-
|
|
3678
|
-
|
|
3679
|
-
|
|
3680
|
-
|
|
3681
|
-
|
|
3682
|
-
|
|
3683
|
-
|
|
3642
|
+
<span class="pf-v6-c-tabs__item-text">Get started</span>
|
|
3643
|
+
</button>
|
|
3644
|
+
</li>
|
|
3645
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3646
|
+
<button
|
|
3647
|
+
type="button"
|
|
3648
|
+
class="pf-v6-c-tabs__link"
|
|
3649
|
+
role="tab"
|
|
3650
|
+
aria-controls="gray-tabs-example-tabs-tabs-knowledge-panel"
|
|
3651
|
+
id="gray-tabs-example-tabs-tabs-knowledge-link"
|
|
3652
|
+
>
|
|
3653
|
+
<span class="pf-v6-c-tabs__item-text">Knowledge</span>
|
|
3654
|
+
</button>
|
|
3655
|
+
</li>
|
|
3656
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3657
|
+
<button
|
|
3658
|
+
type="button"
|
|
3659
|
+
class="pf-v6-c-tabs__link"
|
|
3660
|
+
role="tab"
|
|
3661
|
+
aria-controls="gray-tabs-example-tabs-tabs-support-panel"
|
|
3662
|
+
id="gray-tabs-example-tabs-tabs-support-link"
|
|
3663
|
+
>
|
|
3664
|
+
<span class="pf-v6-c-tabs__item-text">Support</span>
|
|
3665
|
+
</button>
|
|
3666
|
+
</li>
|
|
3667
|
+
</ul>
|
|
3668
|
+
</div>
|
|
3669
|
+
</div>
|
|
3670
|
+
</section>
|
|
3671
|
+
<section class="pf-v6-c-page__main-section pf-m-limit-width pf-m-light">
|
|
3672
|
+
<div class="pf-v6-c-page__main-body">
|
|
3673
|
+
<section
|
|
3674
|
+
class="pf-v6-c-tab-content"
|
|
3675
|
+
aria-labelledby="gray-tabs-example-tabs-tabs-new-link"
|
|
3676
|
+
id="gray-tabs-example-tabs-tabs-new-panel"
|
|
3677
|
+
role="tabpanel"
|
|
3678
|
+
tabindex="0"
|
|
3679
|
+
hidden
|
|
3680
|
+
>
|
|
3681
|
+
<div class="pf-v6-c-tab-content__body">What's new content</div>
|
|
3682
|
+
</section>
|
|
3683
|
+
<section
|
|
3684
|
+
class="pf-v6-c-tab-content"
|
|
3685
|
+
aria-labelledby="gray-tabs-example-tabs-tabs-get-started-link"
|
|
3686
|
+
id="gray-tabs-example-tabs-tabs-get-started-panel"
|
|
3687
|
+
role="tabpanel"
|
|
3688
|
+
tabindex="0"
|
|
3689
|
+
>
|
|
3690
|
+
<div class="pf-v6-c-tab-content__body">
|
|
3691
|
+
<div class="pf-v6-l-grid pf-m-gutter">
|
|
3692
|
+
<div class="pf-v6-l-grid__item">
|
|
3693
|
+
<h1
|
|
3694
|
+
class="pf-v6-c-title pf-m-lg"
|
|
3695
|
+
>Get started with Red Hat Enterprise Linux</h1>
|
|
3696
|
+
</div>
|
|
3697
|
+
<div class="pf-v6-l-grid__item">
|
|
3698
|
+
<div
|
|
3699
|
+
class="pf-v6-c-tabs pf-m-inset-none"
|
|
3700
|
+
role="region"
|
|
3701
|
+
id="gray-tabs-example-tabs-subtabs"
|
|
3702
|
+
>
|
|
3703
|
+
<ul class="pf-v6-c-tabs__list" role="tablist">
|
|
3704
|
+
<li
|
|
3705
|
+
class="pf-v6-c-tabs__item pf-m-current"
|
|
3706
|
+
role="presentation"
|
|
3684
3707
|
>
|
|
3685
|
-
<
|
|
3686
|
-
|
|
3687
|
-
|
|
3688
|
-
|
|
3689
|
-
|
|
3690
|
-
|
|
3691
|
-
|
|
3692
|
-
|
|
3693
|
-
|
|
3694
|
-
|
|
3695
|
-
|
|
3708
|
+
<button
|
|
3709
|
+
type="button"
|
|
3710
|
+
class="pf-v6-c-tabs__link"
|
|
3711
|
+
role="tab"
|
|
3712
|
+
aria-controls="gray-tabs-example-tabs-subtabs-x86-panel"
|
|
3713
|
+
id="gray-tabs-example-tabs-subtabs-x86-link"
|
|
3714
|
+
>
|
|
3715
|
+
<span class="pf-v6-c-tabs__item-text">x86 architecture</span>
|
|
3716
|
+
</button>
|
|
3717
|
+
</li>
|
|
3718
|
+
<li class="pf-v6-c-tabs__item" role="presentation">
|
|
3719
|
+
<button
|
|
3720
|
+
type="button"
|
|
3721
|
+
class="pf-v6-c-tabs__link"
|
|
3722
|
+
role="tab"
|
|
3723
|
+
aria-controls="gray-tabs-example-tabs-subtabs-additional-architectures-panel"
|
|
3724
|
+
id="gray-tabs-example-tabs-subtabs-additional-architectures-link"
|
|
3725
|
+
>
|
|
3726
|
+
<span
|
|
3727
|
+
class="pf-v6-c-tabs__item-text"
|
|
3728
|
+
>Additional Architectures</span>
|
|
3729
|
+
</button>
|
|
3730
|
+
</li>
|
|
3731
|
+
</ul>
|
|
3732
|
+
</div>
|
|
3733
|
+
</div>
|
|
3734
|
+
<div class="pf-v6-l-grid__item">
|
|
3735
|
+
<section
|
|
3736
|
+
class="pf-v6-c-tab-content"
|
|
3737
|
+
aria-labelledby="gray-tabs-example-tabs-subtabs-x86-link"
|
|
3738
|
+
id="gray-tabs-example-tabs-subtabs-x86-panel"
|
|
3739
|
+
role="tabpanel"
|
|
3740
|
+
tabindex="0"
|
|
3741
|
+
>
|
|
3742
|
+
<div class="pf-v6-c-tab-content__body">
|
|
3743
|
+
<div class="pf-v6-l-grid pf-m-gutter">
|
|
3744
|
+
<div class="pf-v6-l-grid__item">
|
|
3745
|
+
<div class="pf-v6-c-content">
|
|
3746
|
+
<p>To perform a standard x86_64 installation using the GUI, you'll need to:</p>
|
|
3696
3747
|
</div>
|
|
3697
3748
|
</div>
|
|
3698
|
-
<div
|
|
3699
|
-
|
|
3700
|
-
|
|
3701
|
-
|
|
3702
|
-
|
|
3703
|
-
|
|
3704
|
-
|
|
3705
|
-
|
|
3706
|
-
|
|
3707
|
-
|
|
3749
|
+
<div
|
|
3750
|
+
class="pf-v6-l-grid pf-m-all-6-col-on-md pf-m-all-3-col-on-2xl pf-m-gutter"
|
|
3751
|
+
>
|
|
3752
|
+
<div class="pf-v6-c-card pf-m-flat">
|
|
3753
|
+
<div class="pf-v6-c-card__title">
|
|
3754
|
+
<h2
|
|
3755
|
+
class="pf-v6-c-card__title-text"
|
|
3756
|
+
>Check system requirements</h2>
|
|
3757
|
+
</div>
|
|
3758
|
+
<div class="pf-v6-c-card__body">
|
|
3759
|
+
<p>
|
|
3760
|
+
Your physical or virtual machine should meet the
|
|
3761
|
+
<a href="#">system requirement</a>.
|
|
3762
|
+
</p>
|
|
3763
|
+
</div>
|
|
3708
3764
|
</div>
|
|
3709
|
-
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3765
|
+
<div class="pf-v6-c-card pf-m-flat">
|
|
3766
|
+
<div class="pf-v6-c-card__title">
|
|
3767
|
+
<h2
|
|
3768
|
+
class="pf-v6-c-card__title-text"
|
|
3769
|
+
>Download an installation ISO image</h2>
|
|
3770
|
+
</div>
|
|
3771
|
+
<div class="pf-v6-c-card__body">
|
|
3772
|
+
<p>
|
|
3773
|
+
<a href="#">Download</a> the binary DVD ISO.
|
|
3774
|
+
</p>
|
|
3775
|
+
</div>
|
|
3715
3776
|
</div>
|
|
3716
|
-
<div class="pf-v6-c-
|
|
3717
|
-
<
|
|
3718
|
-
<
|
|
3719
|
-
|
|
3777
|
+
<div class="pf-v6-c-card pf-m-flat">
|
|
3778
|
+
<div class="pf-v6-c-card__title">
|
|
3779
|
+
<h2
|
|
3780
|
+
class="pf-v6-c-card__title-text"
|
|
3781
|
+
>Create a bootable installation media</h2>
|
|
3782
|
+
</div>
|
|
3783
|
+
<div class="pf-v6-c-card__body">
|
|
3784
|
+
<p>
|
|
3785
|
+
<a href="#">Create</a> a bootable installation media, for example a USB flash drive.
|
|
3786
|
+
</p>
|
|
3787
|
+
</div>
|
|
3720
3788
|
</div>
|
|
3721
3789
|
</div>
|
|
3722
3790
|
</div>
|
|
3723
3791
|
</div>
|
|
3724
|
-
</
|
|
3725
|
-
|
|
3726
|
-
|
|
3727
|
-
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
|
|
3731
|
-
|
|
3732
|
-
|
|
3733
|
-
|
|
3734
|
-
|
|
3735
|
-
|
|
3736
|
-
</
|
|
3737
|
-
</
|
|
3792
|
+
</section>
|
|
3793
|
+
<section
|
|
3794
|
+
class="pf-v6-c-tab-content"
|
|
3795
|
+
aria-labelledby="gray-tabs-example-tabs-subtabs-additional-architectures-link"
|
|
3796
|
+
id="gray-tabs-example-tabs-subtabs-additional-architectures-panel"
|
|
3797
|
+
role="tabpanel"
|
|
3798
|
+
tabindex="0"
|
|
3799
|
+
hidden
|
|
3800
|
+
>
|
|
3801
|
+
<div class="pf-v6-c-tab-content__body">
|
|
3802
|
+
<p>Additional architectural content</p>
|
|
3803
|
+
</div>
|
|
3804
|
+
</section>
|
|
3805
|
+
</div>
|
|
3738
3806
|
</div>
|
|
3739
3807
|
</div>
|
|
3740
|
-
</
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
|
|
3745
|
-
|
|
3746
|
-
|
|
3747
|
-
|
|
3748
|
-
|
|
3749
|
-
|
|
3750
|
-
|
|
3751
|
-
|
|
3752
|
-
|
|
3808
|
+
</section>
|
|
3809
|
+
<section
|
|
3810
|
+
class="pf-v6-c-tab-content"
|
|
3811
|
+
aria-labelledby="gray-tabs-example-tabs-tabs-knowledge-link"
|
|
3812
|
+
id="gray-tabs-example-tabs-tabs-knowledge-panel"
|
|
3813
|
+
role="tabpanel"
|
|
3814
|
+
tabindex="0"
|
|
3815
|
+
hidden
|
|
3816
|
+
>
|
|
3817
|
+
<div class="pf-v6-c-tab-content__body">
|
|
3818
|
+
<div class="pf-v6-c-content">
|
|
3819
|
+
<p>Knowledge content</p>
|
|
3820
|
+
</div>
|
|
3753
3821
|
</div>
|
|
3754
|
-
</
|
|
3755
|
-
|
|
3756
|
-
|
|
3757
|
-
|
|
3758
|
-
|
|
3759
|
-
|
|
3760
|
-
|
|
3761
|
-
|
|
3762
|
-
|
|
3763
|
-
|
|
3764
|
-
|
|
3765
|
-
|
|
3766
|
-
|
|
3822
|
+
</section>
|
|
3823
|
+
<section
|
|
3824
|
+
class="pf-v6-c-tab-content"
|
|
3825
|
+
aria-labelledby="gray-tabs-example-tabs-tabs-support-link"
|
|
3826
|
+
id="gray-tabs-example-tabs-tabs-support-panel"
|
|
3827
|
+
role="tabpanel"
|
|
3828
|
+
tabindex="0"
|
|
3829
|
+
hidden
|
|
3830
|
+
>
|
|
3831
|
+
<div class="pf-v6-c-tab-content__body">
|
|
3832
|
+
<div class="pf-v6-c-content">
|
|
3833
|
+
<p>Support content</p>
|
|
3834
|
+
</div>
|
|
3767
3835
|
</div>
|
|
3768
|
-
</
|
|
3769
|
-
</
|
|
3770
|
-
</
|
|
3771
|
-
</
|
|
3772
|
-
</
|
|
3836
|
+
</section>
|
|
3837
|
+
</div>
|
|
3838
|
+
</section>
|
|
3839
|
+
</main>
|
|
3840
|
+
</div>
|
|
3773
3841
|
</div>
|
|
3774
3842
|
|
|
3775
3843
|
```
|