@patternfly/patternfly 6.0.0-alpha.38 → 6.0.0-alpha.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Divider/divider.css +97 -177
- package/components/Divider/divider.scss +60 -79
- package/components/Masthead/masthead.css +267 -435
- package/components/Masthead/masthead.scss +118 -233
- package/docs/components/Divider/examples/Divider.css +3 -1
- package/docs/components/Divider/examples/Divider.md +4 -5
- package/docs/components/Masthead/examples/masthead.md +441 -16
- package/docs/demos/AboutModal/examples/AboutModal.md +40 -42
- package/docs/demos/Alert/examples/Alert.md +120 -126
- package/docs/demos/BackToTop/examples/BackToTop.md +40 -42
- package/docs/demos/Banner/examples/Banner.md +79 -80
- package/docs/demos/CardView/examples/CardView.md +40 -42
- package/docs/demos/ContextSelector/examples/ContextSelector.md +129 -146
- package/docs/demos/Dashboard/examples/Dashboard.md +40 -42
- package/docs/demos/DataList/examples/DataList.md +160 -279
- package/docs/demos/DescriptionList/examples/DescriptionList.md +120 -126
- package/docs/demos/Drawer/examples/Drawer.md +200 -210
- package/docs/demos/JumpLinks/examples/JumpLinks.md +240 -252
- package/docs/demos/Masthead/examples/Masthead.md +143 -224
- package/docs/demos/Modal/examples/Modal.md +240 -252
- package/docs/demos/Nav/examples/Nav.md +320 -336
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +200 -210
- package/docs/demos/Page/examples/Page.md +360 -378
- package/docs/demos/Page/examples/Penta.md +8 -15
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +280 -294
- package/docs/demos/Skeleton/examples/Skeleton.md +40 -42
- package/docs/demos/Table/examples/Table.md +617 -647
- package/docs/demos/Tabs/examples/Tabs.md +240 -252
- package/docs/demos/Toolbar/examples/Toolbar.md +80 -84
- package/docs/demos/Wizard/examples/Wizard.md +360 -378
- package/package.json +1 -1
- package/patternfly-no-globals.css +363 -611
- package/patternfly-theme-dark-unversioned.css +363 -611
- package/patternfly.css +363 -611
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -26,20 +26,16 @@ This demo implements the about modal, including the backdrop.
|
|
|
26
26
|
</button>
|
|
27
27
|
</span>
|
|
28
28
|
<div class="pf-v5-c-masthead__main">
|
|
29
|
-
<a
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
style="--pf-v5-c-brand--Height: 36px;"
|
|
33
|
-
>
|
|
34
|
-
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
35
|
-
<title>Patternfly logo</title>
|
|
29
|
+
<a class="pf-v5-c-masthead__brand" href="#">
|
|
30
|
+
<svg height="40px" viewBox="0 0 679 158">
|
|
31
|
+
<title>PF-HorizontalLogo-Color</title>
|
|
36
32
|
<defs>
|
|
37
33
|
<linearGradient
|
|
38
34
|
x1="68%"
|
|
39
35
|
y1="2.25860997e-13%"
|
|
40
36
|
x2="32%"
|
|
41
37
|
y2="100%"
|
|
42
|
-
id="linearGradient-
|
|
38
|
+
id="linearGradient-modal-basic-example-masthead"
|
|
43
39
|
>
|
|
44
40
|
<stop stop-color="#2B9AF3" offset="0%" />
|
|
45
41
|
<stop
|
|
@@ -49,13 +45,7 @@ This demo implements the about modal, including the backdrop.
|
|
|
49
45
|
/>
|
|
50
46
|
</linearGradient>
|
|
51
47
|
</defs>
|
|
52
|
-
<g
|
|
53
|
-
id="PF-HorizontalLogo-Color"
|
|
54
|
-
stroke="none"
|
|
55
|
-
stroke-width="1"
|
|
56
|
-
fill="none"
|
|
57
|
-
fill-rule="evenodd"
|
|
58
|
-
>
|
|
48
|
+
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
59
49
|
<g
|
|
60
50
|
transform="translate(206.000000, 45.750000)"
|
|
61
51
|
fill="var(--pf-t--global--text--color--regular)"
|
|
@@ -90,19 +80,18 @@ This demo implements the about modal, including the backdrop.
|
|
|
90
80
|
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
91
81
|
/>
|
|
92
82
|
</g>
|
|
93
|
-
<g
|
|
83
|
+
<g transform="translate(0.000000, 0.000000)">
|
|
94
84
|
<path
|
|
95
85
|
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
96
|
-
|
|
97
|
-
fill="var(--pf-t--global--color--brand--200)"
|
|
86
|
+
fill="#0066CC"
|
|
98
87
|
/>
|
|
99
88
|
<path
|
|
100
89
|
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
101
|
-
fill="url(#linearGradient-
|
|
90
|
+
fill="url(#linearGradient-modal-basic-example-masthead)"
|
|
102
91
|
/>
|
|
103
92
|
<path
|
|
104
93
|
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
105
|
-
fill="url(#linearGradient-
|
|
94
|
+
fill="url(#linearGradient-modal-basic-example-masthead)"
|
|
106
95
|
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
107
96
|
/>
|
|
108
97
|
</g>
|
|
@@ -117,8 +106,38 @@ This demo implements the about modal, including the backdrop.
|
|
|
117
106
|
>
|
|
118
107
|
<div class="pf-v5-c-toolbar__content">
|
|
119
108
|
<div class="pf-v5-c-toolbar__content-section">
|
|
109
|
+
<div class="pf-v5-c-toolbar__item">
|
|
110
|
+
<button
|
|
111
|
+
class="pf-v5-c-menu-toggle"
|
|
112
|
+
type="button"
|
|
113
|
+
aria-expanded="false"
|
|
114
|
+
>
|
|
115
|
+
<span class="pf-v5-c-menu-toggle__text">Overview</span>
|
|
116
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
117
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
118
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
119
|
+
</span>
|
|
120
|
+
</span>
|
|
121
|
+
</button>
|
|
122
|
+
</div>
|
|
123
|
+
|
|
124
|
+
<div class="pf-v5-c-toolbar__item">
|
|
125
|
+
<button
|
|
126
|
+
class="pf-v5-c-menu-toggle"
|
|
127
|
+
type="button"
|
|
128
|
+
aria-expanded="false"
|
|
129
|
+
>
|
|
130
|
+
<span class="pf-v5-c-menu-toggle__text">Services</span>
|
|
131
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
132
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
133
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
134
|
+
</span>
|
|
135
|
+
</span>
|
|
136
|
+
</button>
|
|
137
|
+
</div>
|
|
138
|
+
|
|
120
139
|
<div
|
|
121
|
-
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
140
|
+
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
122
141
|
>
|
|
123
142
|
<div
|
|
124
143
|
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
@@ -165,27 +184,6 @@ This demo implements the about modal, including the backdrop.
|
|
|
165
184
|
</button>
|
|
166
185
|
</div>
|
|
167
186
|
</div>
|
|
168
|
-
<div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
169
|
-
<button
|
|
170
|
-
class="pf-v5-c-menu-toggle pf-m-full-height"
|
|
171
|
-
type="button"
|
|
172
|
-
aria-expanded="false"
|
|
173
|
-
>
|
|
174
|
-
<span class="pf-v5-c-menu-toggle__icon">
|
|
175
|
-
<img
|
|
176
|
-
class="pf-v5-c-avatar"
|
|
177
|
-
alt="Avatar image"
|
|
178
|
-
src="/assets/images/img_avatar-light.svg"
|
|
179
|
-
/>
|
|
180
|
-
</span>
|
|
181
|
-
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
182
|
-
<span class="pf-v5-c-menu-toggle__controls">
|
|
183
|
-
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
184
|
-
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
185
|
-
</span>
|
|
186
|
-
</span>
|
|
187
|
-
</button>
|
|
188
|
-
</div>
|
|
189
187
|
</div>
|
|
190
188
|
</div>
|
|
191
189
|
</div>
|
|
@@ -24,20 +24,16 @@ section: components
|
|
|
24
24
|
</button>
|
|
25
25
|
</span>
|
|
26
26
|
<div class="pf-v5-c-masthead__main">
|
|
27
|
-
<a
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
style="--pf-v5-c-brand--Height: 36px;"
|
|
31
|
-
>
|
|
32
|
-
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
33
|
-
<title>Patternfly logo</title>
|
|
27
|
+
<a class="pf-v5-c-masthead__brand" href="#">
|
|
28
|
+
<svg height="40px" viewBox="0 0 679 158">
|
|
29
|
+
<title>PF-HorizontalLogo-Color</title>
|
|
34
30
|
<defs>
|
|
35
31
|
<linearGradient
|
|
36
32
|
x1="68%"
|
|
37
33
|
y1="2.25860997e-13%"
|
|
38
34
|
x2="32%"
|
|
39
35
|
y2="100%"
|
|
40
|
-
id="linearGradient-
|
|
36
|
+
id="linearGradient-alert-basic-example-masthead"
|
|
41
37
|
>
|
|
42
38
|
<stop stop-color="#2B9AF3" offset="0%" />
|
|
43
39
|
<stop
|
|
@@ -47,13 +43,7 @@ section: components
|
|
|
47
43
|
/>
|
|
48
44
|
</linearGradient>
|
|
49
45
|
</defs>
|
|
50
|
-
<g
|
|
51
|
-
id="PF-HorizontalLogo-Color"
|
|
52
|
-
stroke="none"
|
|
53
|
-
stroke-width="1"
|
|
54
|
-
fill="none"
|
|
55
|
-
fill-rule="evenodd"
|
|
56
|
-
>
|
|
46
|
+
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
57
47
|
<g
|
|
58
48
|
transform="translate(206.000000, 45.750000)"
|
|
59
49
|
fill="var(--pf-t--global--text--color--regular)"
|
|
@@ -88,19 +78,18 @@ section: components
|
|
|
88
78
|
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
89
79
|
/>
|
|
90
80
|
</g>
|
|
91
|
-
<g
|
|
81
|
+
<g transform="translate(0.000000, 0.000000)">
|
|
92
82
|
<path
|
|
93
83
|
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
94
|
-
|
|
95
|
-
fill="var(--pf-t--global--color--brand--200)"
|
|
84
|
+
fill="#0066CC"
|
|
96
85
|
/>
|
|
97
86
|
<path
|
|
98
87
|
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
99
|
-
fill="url(#linearGradient-
|
|
88
|
+
fill="url(#linearGradient-alert-basic-example-masthead)"
|
|
100
89
|
/>
|
|
101
90
|
<path
|
|
102
91
|
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
103
|
-
fill="url(#linearGradient-
|
|
92
|
+
fill="url(#linearGradient-alert-basic-example-masthead)"
|
|
104
93
|
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
105
94
|
/>
|
|
106
95
|
</g>
|
|
@@ -115,8 +104,38 @@ section: components
|
|
|
115
104
|
>
|
|
116
105
|
<div class="pf-v5-c-toolbar__content">
|
|
117
106
|
<div class="pf-v5-c-toolbar__content-section">
|
|
107
|
+
<div class="pf-v5-c-toolbar__item">
|
|
108
|
+
<button
|
|
109
|
+
class="pf-v5-c-menu-toggle"
|
|
110
|
+
type="button"
|
|
111
|
+
aria-expanded="false"
|
|
112
|
+
>
|
|
113
|
+
<span class="pf-v5-c-menu-toggle__text">Overview</span>
|
|
114
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
115
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
116
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
117
|
+
</span>
|
|
118
|
+
</span>
|
|
119
|
+
</button>
|
|
120
|
+
</div>
|
|
121
|
+
|
|
122
|
+
<div class="pf-v5-c-toolbar__item">
|
|
123
|
+
<button
|
|
124
|
+
class="pf-v5-c-menu-toggle"
|
|
125
|
+
type="button"
|
|
126
|
+
aria-expanded="false"
|
|
127
|
+
>
|
|
128
|
+
<span class="pf-v5-c-menu-toggle__text">Services</span>
|
|
129
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
130
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
131
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
132
|
+
</span>
|
|
133
|
+
</span>
|
|
134
|
+
</button>
|
|
135
|
+
</div>
|
|
136
|
+
|
|
118
137
|
<div
|
|
119
|
-
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
138
|
+
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
120
139
|
>
|
|
121
140
|
<div
|
|
122
141
|
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
@@ -163,27 +182,6 @@ section: components
|
|
|
163
182
|
</button>
|
|
164
183
|
</div>
|
|
165
184
|
</div>
|
|
166
|
-
<div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
167
|
-
<button
|
|
168
|
-
class="pf-v5-c-menu-toggle pf-m-full-height"
|
|
169
|
-
type="button"
|
|
170
|
-
aria-expanded="false"
|
|
171
|
-
>
|
|
172
|
-
<span class="pf-v5-c-menu-toggle__icon">
|
|
173
|
-
<img
|
|
174
|
-
class="pf-v5-c-avatar"
|
|
175
|
-
alt="Avatar image"
|
|
176
|
-
src="/assets/images/img_avatar-light.svg"
|
|
177
|
-
/>
|
|
178
|
-
</span>
|
|
179
|
-
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
180
|
-
<span class="pf-v5-c-menu-toggle__controls">
|
|
181
|
-
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
182
|
-
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
183
|
-
</span>
|
|
184
|
-
</span>
|
|
185
|
-
</button>
|
|
186
|
-
</div>
|
|
187
185
|
</div>
|
|
188
186
|
</div>
|
|
189
187
|
</div>
|
|
@@ -402,20 +400,16 @@ section: components
|
|
|
402
400
|
</button>
|
|
403
401
|
</span>
|
|
404
402
|
<div class="pf-v5-c-masthead__main">
|
|
405
|
-
<a
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
style="--pf-v5-c-brand--Height: 36px;"
|
|
409
|
-
>
|
|
410
|
-
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
411
|
-
<title>Patternfly logo</title>
|
|
403
|
+
<a class="pf-v5-c-masthead__brand" href="#">
|
|
404
|
+
<svg height="40px" viewBox="0 0 679 158">
|
|
405
|
+
<title>PF-HorizontalLogo-Color</title>
|
|
412
406
|
<defs>
|
|
413
407
|
<linearGradient
|
|
414
408
|
x1="68%"
|
|
415
409
|
y1="2.25860997e-13%"
|
|
416
410
|
x2="32%"
|
|
417
411
|
y2="100%"
|
|
418
|
-
id="linearGradient-
|
|
412
|
+
id="linearGradient-alert-horizontal-example-masthead"
|
|
419
413
|
>
|
|
420
414
|
<stop stop-color="#2B9AF3" offset="0%" />
|
|
421
415
|
<stop
|
|
@@ -425,13 +419,7 @@ section: components
|
|
|
425
419
|
/>
|
|
426
420
|
</linearGradient>
|
|
427
421
|
</defs>
|
|
428
|
-
<g
|
|
429
|
-
id="PF-HorizontalLogo-Color"
|
|
430
|
-
stroke="none"
|
|
431
|
-
stroke-width="1"
|
|
432
|
-
fill="none"
|
|
433
|
-
fill-rule="evenodd"
|
|
434
|
-
>
|
|
422
|
+
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
435
423
|
<g
|
|
436
424
|
transform="translate(206.000000, 45.750000)"
|
|
437
425
|
fill="var(--pf-t--global--text--color--regular)"
|
|
@@ -466,19 +454,18 @@ section: components
|
|
|
466
454
|
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
467
455
|
/>
|
|
468
456
|
</g>
|
|
469
|
-
<g
|
|
457
|
+
<g transform="translate(0.000000, 0.000000)">
|
|
470
458
|
<path
|
|
471
459
|
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
472
|
-
|
|
473
|
-
fill="var(--pf-t--global--color--brand--200)"
|
|
460
|
+
fill="#0066CC"
|
|
474
461
|
/>
|
|
475
462
|
<path
|
|
476
463
|
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
477
|
-
fill="url(#linearGradient-
|
|
464
|
+
fill="url(#linearGradient-alert-horizontal-example-masthead)"
|
|
478
465
|
/>
|
|
479
466
|
<path
|
|
480
467
|
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
481
|
-
fill="url(#linearGradient-
|
|
468
|
+
fill="url(#linearGradient-alert-horizontal-example-masthead)"
|
|
482
469
|
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
483
470
|
/>
|
|
484
471
|
</g>
|
|
@@ -493,8 +480,38 @@ section: components
|
|
|
493
480
|
>
|
|
494
481
|
<div class="pf-v5-c-toolbar__content">
|
|
495
482
|
<div class="pf-v5-c-toolbar__content-section">
|
|
483
|
+
<div class="pf-v5-c-toolbar__item">
|
|
484
|
+
<button
|
|
485
|
+
class="pf-v5-c-menu-toggle"
|
|
486
|
+
type="button"
|
|
487
|
+
aria-expanded="false"
|
|
488
|
+
>
|
|
489
|
+
<span class="pf-v5-c-menu-toggle__text">Overview</span>
|
|
490
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
491
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
492
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
493
|
+
</span>
|
|
494
|
+
</span>
|
|
495
|
+
</button>
|
|
496
|
+
</div>
|
|
497
|
+
|
|
498
|
+
<div class="pf-v5-c-toolbar__item">
|
|
499
|
+
<button
|
|
500
|
+
class="pf-v5-c-menu-toggle"
|
|
501
|
+
type="button"
|
|
502
|
+
aria-expanded="false"
|
|
503
|
+
>
|
|
504
|
+
<span class="pf-v5-c-menu-toggle__text">Services</span>
|
|
505
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
506
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
507
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
508
|
+
</span>
|
|
509
|
+
</span>
|
|
510
|
+
</button>
|
|
511
|
+
</div>
|
|
512
|
+
|
|
496
513
|
<div
|
|
497
|
-
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
514
|
+
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
498
515
|
>
|
|
499
516
|
<div
|
|
500
517
|
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
@@ -541,27 +558,6 @@ section: components
|
|
|
541
558
|
</button>
|
|
542
559
|
</div>
|
|
543
560
|
</div>
|
|
544
|
-
<div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
545
|
-
<button
|
|
546
|
-
class="pf-v5-c-menu-toggle pf-m-full-height"
|
|
547
|
-
type="button"
|
|
548
|
-
aria-expanded="false"
|
|
549
|
-
>
|
|
550
|
-
<span class="pf-v5-c-menu-toggle__icon">
|
|
551
|
-
<img
|
|
552
|
-
class="pf-v5-c-avatar"
|
|
553
|
-
alt="Avatar image"
|
|
554
|
-
src="/assets/images/img_avatar-light.svg"
|
|
555
|
-
/>
|
|
556
|
-
</span>
|
|
557
|
-
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
558
|
-
<span class="pf-v5-c-menu-toggle__controls">
|
|
559
|
-
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
560
|
-
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
561
|
-
</span>
|
|
562
|
-
</span>
|
|
563
|
-
</button>
|
|
564
|
-
</div>
|
|
565
561
|
</div>
|
|
566
562
|
</div>
|
|
567
563
|
</div>
|
|
@@ -861,20 +857,16 @@ section: components
|
|
|
861
857
|
</button>
|
|
862
858
|
</span>
|
|
863
859
|
<div class="pf-v5-c-masthead__main">
|
|
864
|
-
<a
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
style="--pf-v5-c-brand--Height: 36px;"
|
|
868
|
-
>
|
|
869
|
-
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
870
|
-
<title>Patternfly logo</title>
|
|
860
|
+
<a class="pf-v5-c-masthead__brand" href="#">
|
|
861
|
+
<svg height="40px" viewBox="0 0 679 158">
|
|
862
|
+
<title>PF-HorizontalLogo-Color</title>
|
|
871
863
|
<defs>
|
|
872
864
|
<linearGradient
|
|
873
865
|
x1="68%"
|
|
874
866
|
y1="2.25860997e-13%"
|
|
875
867
|
x2="32%"
|
|
876
868
|
y2="100%"
|
|
877
|
-
id="linearGradient-
|
|
869
|
+
id="linearGradient-alert-stacked-example-masthead"
|
|
878
870
|
>
|
|
879
871
|
<stop stop-color="#2B9AF3" offset="0%" />
|
|
880
872
|
<stop
|
|
@@ -884,13 +876,7 @@ section: components
|
|
|
884
876
|
/>
|
|
885
877
|
</linearGradient>
|
|
886
878
|
</defs>
|
|
887
|
-
<g
|
|
888
|
-
id="PF-HorizontalLogo-Color"
|
|
889
|
-
stroke="none"
|
|
890
|
-
stroke-width="1"
|
|
891
|
-
fill="none"
|
|
892
|
-
fill-rule="evenodd"
|
|
893
|
-
>
|
|
879
|
+
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
894
880
|
<g
|
|
895
881
|
transform="translate(206.000000, 45.750000)"
|
|
896
882
|
fill="var(--pf-t--global--text--color--regular)"
|
|
@@ -925,19 +911,18 @@ section: components
|
|
|
925
911
|
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
926
912
|
/>
|
|
927
913
|
</g>
|
|
928
|
-
<g
|
|
914
|
+
<g transform="translate(0.000000, 0.000000)">
|
|
929
915
|
<path
|
|
930
916
|
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
931
|
-
|
|
932
|
-
fill="var(--pf-t--global--color--brand--200)"
|
|
917
|
+
fill="#0066CC"
|
|
933
918
|
/>
|
|
934
919
|
<path
|
|
935
920
|
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
936
|
-
fill="url(#linearGradient-
|
|
921
|
+
fill="url(#linearGradient-alert-stacked-example-masthead)"
|
|
937
922
|
/>
|
|
938
923
|
<path
|
|
939
924
|
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
940
|
-
fill="url(#linearGradient-
|
|
925
|
+
fill="url(#linearGradient-alert-stacked-example-masthead)"
|
|
941
926
|
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
942
927
|
/>
|
|
943
928
|
</g>
|
|
@@ -952,8 +937,38 @@ section: components
|
|
|
952
937
|
>
|
|
953
938
|
<div class="pf-v5-c-toolbar__content">
|
|
954
939
|
<div class="pf-v5-c-toolbar__content-section">
|
|
940
|
+
<div class="pf-v5-c-toolbar__item">
|
|
941
|
+
<button
|
|
942
|
+
class="pf-v5-c-menu-toggle"
|
|
943
|
+
type="button"
|
|
944
|
+
aria-expanded="false"
|
|
945
|
+
>
|
|
946
|
+
<span class="pf-v5-c-menu-toggle__text">Overview</span>
|
|
947
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
948
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
949
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
950
|
+
</span>
|
|
951
|
+
</span>
|
|
952
|
+
</button>
|
|
953
|
+
</div>
|
|
954
|
+
|
|
955
|
+
<div class="pf-v5-c-toolbar__item">
|
|
956
|
+
<button
|
|
957
|
+
class="pf-v5-c-menu-toggle"
|
|
958
|
+
type="button"
|
|
959
|
+
aria-expanded="false"
|
|
960
|
+
>
|
|
961
|
+
<span class="pf-v5-c-menu-toggle__text">Services</span>
|
|
962
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
963
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
964
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
965
|
+
</span>
|
|
966
|
+
</span>
|
|
967
|
+
</button>
|
|
968
|
+
</div>
|
|
969
|
+
|
|
955
970
|
<div
|
|
956
|
-
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
971
|
+
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
957
972
|
>
|
|
958
973
|
<div
|
|
959
974
|
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
@@ -1000,27 +1015,6 @@ section: components
|
|
|
1000
1015
|
</button>
|
|
1001
1016
|
</div>
|
|
1002
1017
|
</div>
|
|
1003
|
-
<div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
1004
|
-
<button
|
|
1005
|
-
class="pf-v5-c-menu-toggle pf-m-full-height"
|
|
1006
|
-
type="button"
|
|
1007
|
-
aria-expanded="false"
|
|
1008
|
-
>
|
|
1009
|
-
<span class="pf-v5-c-menu-toggle__icon">
|
|
1010
|
-
<img
|
|
1011
|
-
class="pf-v5-c-avatar"
|
|
1012
|
-
alt="Avatar image"
|
|
1013
|
-
src="/assets/images/img_avatar-light.svg"
|
|
1014
|
-
/>
|
|
1015
|
-
</span>
|
|
1016
|
-
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
1017
|
-
<span class="pf-v5-c-menu-toggle__controls">
|
|
1018
|
-
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1019
|
-
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
1020
|
-
</span>
|
|
1021
|
-
</span>
|
|
1022
|
-
</button>
|
|
1023
|
-
</div>
|
|
1024
1018
|
</div>
|
|
1025
1019
|
</div>
|
|
1026
1020
|
</div>
|
|
@@ -25,20 +25,16 @@ cssPrefix: pf-d-back-to-top
|
|
|
25
25
|
</button>
|
|
26
26
|
</span>
|
|
27
27
|
<div class="pf-v5-c-masthead__main">
|
|
28
|
-
<a
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
style="--pf-v5-c-brand--Height: 36px;"
|
|
32
|
-
>
|
|
33
|
-
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
34
|
-
<title>Patternfly logo</title>
|
|
28
|
+
<a class="pf-v5-c-masthead__brand" href="#">
|
|
29
|
+
<svg height="40px" viewBox="0 0 679 158">
|
|
30
|
+
<title>PF-HorizontalLogo-Color</title>
|
|
35
31
|
<defs>
|
|
36
32
|
<linearGradient
|
|
37
33
|
x1="68%"
|
|
38
34
|
y1="2.25860997e-13%"
|
|
39
35
|
x2="32%"
|
|
40
36
|
y2="100%"
|
|
41
|
-
id="linearGradient-
|
|
37
|
+
id="linearGradient-back-to-top-basic-example-masthead"
|
|
42
38
|
>
|
|
43
39
|
<stop stop-color="#2B9AF3" offset="0%" />
|
|
44
40
|
<stop
|
|
@@ -48,13 +44,7 @@ cssPrefix: pf-d-back-to-top
|
|
|
48
44
|
/>
|
|
49
45
|
</linearGradient>
|
|
50
46
|
</defs>
|
|
51
|
-
<g
|
|
52
|
-
id="PF-HorizontalLogo-Color"
|
|
53
|
-
stroke="none"
|
|
54
|
-
stroke-width="1"
|
|
55
|
-
fill="none"
|
|
56
|
-
fill-rule="evenodd"
|
|
57
|
-
>
|
|
47
|
+
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
58
48
|
<g
|
|
59
49
|
transform="translate(206.000000, 45.750000)"
|
|
60
50
|
fill="var(--pf-t--global--text--color--regular)"
|
|
@@ -89,19 +79,18 @@ cssPrefix: pf-d-back-to-top
|
|
|
89
79
|
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
90
80
|
/>
|
|
91
81
|
</g>
|
|
92
|
-
<g
|
|
82
|
+
<g transform="translate(0.000000, 0.000000)">
|
|
93
83
|
<path
|
|
94
84
|
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
95
|
-
|
|
96
|
-
fill="var(--pf-t--global--color--brand--200)"
|
|
85
|
+
fill="#0066CC"
|
|
97
86
|
/>
|
|
98
87
|
<path
|
|
99
88
|
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
100
|
-
fill="url(#linearGradient-
|
|
89
|
+
fill="url(#linearGradient-back-to-top-basic-example-masthead)"
|
|
101
90
|
/>
|
|
102
91
|
<path
|
|
103
92
|
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
104
|
-
fill="url(#linearGradient-
|
|
93
|
+
fill="url(#linearGradient-back-to-top-basic-example-masthead)"
|
|
105
94
|
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
106
95
|
/>
|
|
107
96
|
</g>
|
|
@@ -116,8 +105,38 @@ cssPrefix: pf-d-back-to-top
|
|
|
116
105
|
>
|
|
117
106
|
<div class="pf-v5-c-toolbar__content">
|
|
118
107
|
<div class="pf-v5-c-toolbar__content-section">
|
|
108
|
+
<div class="pf-v5-c-toolbar__item">
|
|
109
|
+
<button
|
|
110
|
+
class="pf-v5-c-menu-toggle"
|
|
111
|
+
type="button"
|
|
112
|
+
aria-expanded="false"
|
|
113
|
+
>
|
|
114
|
+
<span class="pf-v5-c-menu-toggle__text">Overview</span>
|
|
115
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
116
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
117
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
118
|
+
</span>
|
|
119
|
+
</span>
|
|
120
|
+
</button>
|
|
121
|
+
</div>
|
|
122
|
+
|
|
123
|
+
<div class="pf-v5-c-toolbar__item">
|
|
124
|
+
<button
|
|
125
|
+
class="pf-v5-c-menu-toggle"
|
|
126
|
+
type="button"
|
|
127
|
+
aria-expanded="false"
|
|
128
|
+
>
|
|
129
|
+
<span class="pf-v5-c-menu-toggle__text">Services</span>
|
|
130
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
131
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
132
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
133
|
+
</span>
|
|
134
|
+
</span>
|
|
135
|
+
</button>
|
|
136
|
+
</div>
|
|
137
|
+
|
|
119
138
|
<div
|
|
120
|
-
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
139
|
+
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
|
|
121
140
|
>
|
|
122
141
|
<div
|
|
123
142
|
class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
|
|
@@ -164,27 +183,6 @@ cssPrefix: pf-d-back-to-top
|
|
|
164
183
|
</button>
|
|
165
184
|
</div>
|
|
166
185
|
</div>
|
|
167
|
-
<div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
|
|
168
|
-
<button
|
|
169
|
-
class="pf-v5-c-menu-toggle pf-m-full-height"
|
|
170
|
-
type="button"
|
|
171
|
-
aria-expanded="false"
|
|
172
|
-
>
|
|
173
|
-
<span class="pf-v5-c-menu-toggle__icon">
|
|
174
|
-
<img
|
|
175
|
-
class="pf-v5-c-avatar"
|
|
176
|
-
alt="Avatar image"
|
|
177
|
-
src="/assets/images/img_avatar-light.svg"
|
|
178
|
-
/>
|
|
179
|
-
</span>
|
|
180
|
-
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
181
|
-
<span class="pf-v5-c-menu-toggle__controls">
|
|
182
|
-
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
183
|
-
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
184
|
-
</span>
|
|
185
|
-
</span>
|
|
186
|
-
</button>
|
|
187
|
-
</div>
|
|
188
186
|
</div>
|
|
189
187
|
</div>
|
|
190
188
|
</div>
|