@patternfly/react-styles 5.0.0-prerelease.6 → 5.0.0
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +8 -0
- package/css/assets/images/pf-logo.svg +28 -0
- package/css/components/Badge/badge.css +1 -0
- package/css/components/Check/check.css +9 -11
- package/css/components/Dropdown/dropdown.css +14 -5
- package/css/components/Dropdown/dropdown.d.ts +1 -0
- package/css/components/Dropdown/dropdown.js +1 -0
- package/css/components/Dropdown/dropdown.mjs +1 -0
- package/css/components/Menu/menu.css +9 -4
- package/css/components/Menu/menu.d.ts +1 -0
- package/css/components/Menu/menu.js +1 -0
- package/css/components/Menu/menu.mjs +1 -0
- package/css/components/MenuToggle/menu-toggle.css +10 -3
- package/css/components/MenuToggle/menu-toggle.d.ts +1 -0
- package/css/components/MenuToggle/menu-toggle.js +1 -0
- package/css/components/MenuToggle/menu-toggle.mjs +1 -0
- package/css/components/Radio/radio.css +8 -10
- package/css/components/Toolbar/toolbar.css +19 -10
- package/package.json +4 -5
package/CHANGELOG.md
CHANGED
@@ -3,6 +3,14 @@
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
5
5
|
|
6
|
+
# 5.0.0 (2023-07-27)
|
7
|
+
|
8
|
+
**Note:** Version bump only for package @patternfly/react-styles
|
9
|
+
|
10
|
+
# 5.0.0-prerelease.7 (2023-07-20)
|
11
|
+
|
12
|
+
**Note:** Version bump only for package @patternfly/react-styles
|
13
|
+
|
6
14
|
# 5.0.0-prerelease.6 (2023-07-06)
|
7
15
|
|
8
16
|
**Note:** Version bump only for package @patternfly/react-styles
|
@@ -0,0 +1,28 @@
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
2
|
+
<svg width="679px" height="158px" viewBox="0 0 679 158" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
3
|
+
<title>PF-HorizontalLogo-Reverse </title>
|
4
|
+
<defs>
|
5
|
+
<linearGradient x1="100%" y1="1.31838984e-13%" x2="40.4021492%" y2="59.4473677%" id="linearGradient-1">
|
6
|
+
<stop stop-color="#FFFFFF" offset="0%"></stop>
|
7
|
+
<stop stop-color="#FFFFFF" stop-opacity="0.498497596" offset="100%"></stop>
|
8
|
+
</linearGradient>
|
9
|
+
</defs>
|
10
|
+
<g id="PF-HorizontalLogo-Reverse" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
11
|
+
<g id="Group" transform="translate(-0.000000, 0.000000)">
|
12
|
+
<path d="M61.7658863,0 L157.846154,0 L157.846154,96.0802676 C104.782487,96.0802676 61.7658863,53.0636665 61.7658863,0 L61.7658863,0 L61.7658863,0 Z" id="Rectangle-Copy-15" fill="#FFFFFF" opacity="0.401297433"></path>
|
13
|
+
<path d="M158,1.84777167 L158,138 C158,149.045695 149.045695,158 138,158 L66.3656919,158 L158,1.84777167 Z M156.152228,3.55271368e-13 L-9.37916411e-13,91.6343081 L-9.37916411e-13,20 C-9.09494702e-13,8.954305 8.954305,3.55271368e-13 20,3.41060513e-13 L156.152228,3.55271368e-13 Z" id="Combined-Shape-Copy-4" fill="url(#linearGradient-1)"></path>
|
14
|
+
</g>
|
15
|
+
<g id="PatternFly-Copy-11" transform="translate(206.000000, 45.750000)" fill="#FFFFFF" fill-rule="nonzero">
|
16
|
+
<path d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z" id="Shape"></path>
|
17
|
+
<path d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z" id="Shape"></path>
|
18
|
+
<path d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z" id="Path"></path>
|
19
|
+
<path d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z" id="Path"></path>
|
20
|
+
<path d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z" id="Shape"></path>
|
21
|
+
<path d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z" id="Path"></path>
|
22
|
+
<path d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z" id="Path"></path>
|
23
|
+
<polygon id="Path" points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"></polygon>
|
24
|
+
<polygon id="Path" points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25"></polygon>
|
25
|
+
<path 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" id="Path"></path>
|
26
|
+
</g>
|
27
|
+
</g>
|
28
|
+
</svg>
|
@@ -4,9 +4,8 @@
|
|
4
4
|
--pf-v5-c-check__label--Color: var(--pf-v5-global--Color--100);
|
5
5
|
--pf-v5-c-check__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
|
6
6
|
--pf-v5-c-check__label--FontSize: var(--pf-v5-global--FontSize--md);
|
7
|
-
--pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--
|
8
|
-
--pf-v5-c-check__input--
|
9
|
-
--pf-v5-c-check__input--MarginTop: calc(((var(--pf-v5-c-check__label--FontSize) * var(--pf-v5-c-check__label--LineHeight)) - var(--pf-v5-c-check__input--Height)) / 2);
|
7
|
+
--pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--md);
|
8
|
+
--pf-v5-c-check__input--TranslateY--moz: 5px;
|
10
9
|
--pf-v5-c-check__description--FontSize: var(--pf-v5-global--FontSize--sm);
|
11
10
|
--pf-v5-c-check__description--Color: var(--pf-v5-global--Color--200);
|
12
11
|
--pf-v5-c-check__body--MarginTop: var(--pf-v5-global--spacer--sm);
|
@@ -19,24 +18,18 @@
|
|
19
18
|
}
|
20
19
|
.pf-v5-c-check.pf-m-standalone {
|
21
20
|
--pf-v5-c-check--GridGap: 0;
|
22
|
-
--pf-v5-c-check__input--
|
23
|
-
--pf-v5-c-check__input--MarginTop: 0;
|
21
|
+
--pf-v5-c-check__input--TranslateY--moz: 0;
|
24
22
|
display: inline-grid;
|
25
|
-
line-height: 1;
|
26
23
|
}
|
27
24
|
|
28
25
|
.pf-v5-c-check__label {
|
26
|
+
align-self: baseline;
|
29
27
|
font-size: var(--pf-v5-c-check__label--FontSize);
|
30
28
|
font-weight: var(--pf-v5-c-check__label--FontWeight);
|
31
29
|
line-height: var(--pf-v5-c-check__label--LineHeight);
|
32
30
|
color: var(--pf-v5-c-check__label--Color);
|
33
31
|
}
|
34
32
|
|
35
|
-
.pf-v5-c-check__input {
|
36
|
-
height: var(--pf-v5-c-check__input--Height);
|
37
|
-
margin-top: var(--pf-v5-c-check__input--MarginTop);
|
38
|
-
}
|
39
|
-
|
40
33
|
.pf-v5-c-check__description {
|
41
34
|
grid-column: 2;
|
42
35
|
font-size: var(--pf-v5-c-check__description--FontSize);
|
@@ -48,6 +41,11 @@
|
|
48
41
|
margin-top: var(--pf-v5-c-check__body--MarginTop);
|
49
42
|
}
|
50
43
|
|
44
|
+
.pf-v5-c-check__input {
|
45
|
+
align-self: baseline;
|
46
|
+
-moz-transform: translateY(var(--pf-v5-c-check__input--TranslateY--moz));
|
47
|
+
}
|
48
|
+
|
51
49
|
.pf-v5-c-check__label,
|
52
50
|
.pf-v5-c-check__input {
|
53
51
|
justify-self: start;
|
@@ -64,7 +64,6 @@
|
|
64
64
|
--pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingLeft: var(--pf-v5-global--spacer--sm);
|
65
65
|
--pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingRight: var(--pf-v5-global--spacer--sm);
|
66
66
|
--pf-v5-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: calc(-1 * var(--pf-v5-global--BorderWidth--sm));
|
67
|
-
--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY: -0.0625rem;
|
68
67
|
--pf-v5-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft: var(--pf-v5-global--spacer--sm);
|
69
68
|
--pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
|
70
69
|
--pf-v5-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius: var(--pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius);
|
@@ -147,7 +146,8 @@
|
|
147
146
|
--pf-v5-c-dropdown--m-full-height__toggle--PaddingRight: var(--pf-v5-global--spacer--lg);
|
148
147
|
--pf-v5-c-dropdown--m-full-height__toggle--PaddingLeft: var(--pf-v5-global--spacer--lg);
|
149
148
|
position: relative;
|
150
|
-
display: inline-
|
149
|
+
display: inline-flex;
|
150
|
+
align-items: start;
|
151
151
|
max-width: 100%;
|
152
152
|
}
|
153
153
|
.pf-v5-c-dropdown .pf-v5-c-divider {
|
@@ -188,7 +188,7 @@
|
|
188
188
|
|
189
189
|
.pf-v5-c-dropdown__toggle {
|
190
190
|
position: relative;
|
191
|
-
display: flex;
|
191
|
+
display: inline-flex;
|
192
192
|
column-gap: var(--pf-v5-c-dropdown__toggle--ColumnGap);
|
193
193
|
align-items: center;
|
194
194
|
min-width: var(--pf-v5-c-dropdown__toggle--MinWidth);
|
@@ -264,6 +264,7 @@
|
|
264
264
|
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check {
|
265
265
|
display: flex;
|
266
266
|
align-items: center;
|
267
|
+
overflow: hidden;
|
267
268
|
cursor: pointer;
|
268
269
|
}
|
269
270
|
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check.pf-m-in-progress {
|
@@ -272,9 +273,13 @@
|
|
272
273
|
}
|
273
274
|
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check > input,
|
274
275
|
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check {
|
276
|
+
align-self: revert;
|
277
|
+
width: auto;
|
275
278
|
cursor: pointer;
|
276
279
|
visibility: var(--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility, unset);
|
277
|
-
|
280
|
+
}
|
281
|
+
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check__input {
|
282
|
+
-moz-transform: none;
|
278
283
|
}
|
279
284
|
.pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-button {
|
280
285
|
color: var(--pf-v5-c-dropdown__toggle-button--Color);
|
@@ -444,6 +449,10 @@
|
|
444
449
|
white-space: nowrap;
|
445
450
|
}
|
446
451
|
|
452
|
+
.pf-v5-c-dropdown__toggle-button {
|
453
|
+
align-self: baseline;
|
454
|
+
}
|
455
|
+
|
447
456
|
.pf-v5-c-dropdown__toggle-text {
|
448
457
|
flex: 1 1 auto;
|
449
458
|
text-align: left;
|
@@ -463,12 +472,12 @@
|
|
463
472
|
.pf-v5-c-dropdown__toggle-image {
|
464
473
|
display: inline-flex;
|
465
474
|
flex-shrink: 0;
|
466
|
-
align-self: center;
|
467
475
|
line-height: 1;
|
468
476
|
}
|
469
477
|
|
470
478
|
.pf-v5-c-dropdown__toggle-progress {
|
471
479
|
position: absolute;
|
480
|
+
left: var(--pf-v5-c-dropdown__toggle--m-split-button--child--PaddingLeft);
|
472
481
|
visibility: var(--pf-v5-c-dropdown__toggle-progress--Visibility);
|
473
482
|
}
|
474
483
|
.pf-v5-c-dropdown__toggle-progress .pf-v5-c-spinner {
|
@@ -454,13 +454,18 @@
|
|
454
454
|
--pf-v5-c-menu__list-item--BackgroundColor: var(--pf-v5-c-menu__list-item--focus-within--BackgroundColor);
|
455
455
|
--pf-v5-c-menu__list-item--Color: var(--pf-v5-c-menu__list-item--focus-within--Color, inherit);
|
456
456
|
}
|
457
|
-
.pf-v5-c-menu__list-item.pf-m-disabled {
|
457
|
+
.pf-v5-c-menu__list-item.pf-m-disabled, .pf-v5-c-menu__list-item.pf-m-aria-disabled {
|
458
458
|
--pf-v5-c-menu__list-item--hover--BackgroundColor: transparent;
|
459
|
-
--pf-v5-c-menu__list-item--focus-within--BackgroundColor: transparent;
|
460
459
|
--pf-v5-c-menu__item--Color: var(--pf-v5-c-menu__list-item--m-disabled__item--Color);
|
461
460
|
--pf-v5-c-menu__item-toggle-icon: var(--pf-v5-c-menu__list-item--m-disabled__item-toggle-icon--Color);
|
461
|
+
}
|
462
|
+
.pf-v5-c-menu__list-item.pf-m-disabled {
|
463
|
+
--pf-v5-c-menu__list-item--focus-within--BackgroundColor: transparent;
|
462
464
|
pointer-events: none;
|
463
465
|
}
|
466
|
+
.pf-v5-c-menu__list-item.pf-m-aria-disabled .pf-v5-c-menu__item {
|
467
|
+
cursor: default;
|
468
|
+
}
|
464
469
|
.pf-v5-c-menu__list-item.pf-m-load {
|
465
470
|
--pf-v5-c-menu__list-item--hover--BackgroundColor: transparent;
|
466
471
|
--pf-v5-c-menu__list-item--focus-within--BackgroundColor: transparent;
|
@@ -503,7 +508,7 @@
|
|
503
508
|
.pf-v5-c-menu__item.pf-m-selected .pf-v5-c-menu__item-select-icon {
|
504
509
|
opacity: 1;
|
505
510
|
}
|
506
|
-
label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
|
511
|
+
label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disabled)) {
|
507
512
|
cursor: pointer;
|
508
513
|
}
|
509
514
|
|
@@ -597,7 +602,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
|
|
597
602
|
.pf-v5-c-menu__item-action:hover, .pf-v5-c-menu__item-action:focus {
|
598
603
|
--pf-v5-c-menu__item-action--Color: var(--pf-v5-c-menu__item-action--hover--Color);
|
599
604
|
}
|
600
|
-
.pf-v5-c-menu__item-action:disabled {
|
605
|
+
.pf-v5-c-menu__item-action:disabled, .pf-v5-c-menu__item-action.pf-m-disabled, .pf-v5-c-menu__item-action.pf-m-aria-disabled {
|
601
606
|
--pf-v5-c-menu__item-action--Color: var(--pf-v5-c-menu__item-action--disabled--Color);
|
602
607
|
}
|
603
608
|
|
@@ -108,6 +108,7 @@
|
|
108
108
|
--pf-v5-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor: var(--pf-v5-global--primary-color--200);
|
109
109
|
--pf-v5-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-v5-global--primary-color--100);
|
110
110
|
--pf-v5-c-menu-toggle__button--BackgroundColor: transparent;
|
111
|
+
--pf-v5-c-menu-toggle__button--AlignSelf: baseline;
|
111
112
|
--pf-v5-c-menu-toggle__button--PaddingLeft: var(--pf-v5-global--spacer--sm);
|
112
113
|
--pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
|
113
114
|
--pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
|
@@ -115,6 +116,7 @@
|
|
115
116
|
--pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
|
116
117
|
--pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
|
117
118
|
--pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
|
119
|
+
--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: center;
|
118
120
|
position: relative;
|
119
121
|
display: inline-flex;
|
120
122
|
align-items: center;
|
@@ -207,6 +209,7 @@
|
|
207
209
|
--pf-v5-c-menu-toggle--hover--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth);
|
208
210
|
--pf-v5-c-menu-toggle--focus--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--focus--after--BorderBottomWidth);
|
209
211
|
--pf-v5-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
|
212
|
+
align-items: center;
|
210
213
|
height: 100%;
|
211
214
|
}
|
212
215
|
.pf-v5-c-menu-toggle:hover {
|
@@ -250,6 +253,7 @@
|
|
250
253
|
.pf-v5-c-menu-toggle.pf-m-typeahead {
|
251
254
|
--pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight);
|
252
255
|
--pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft);
|
256
|
+
--pf-v5-c-menu-toggle__button--AlignSelf: var(--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf);
|
253
257
|
align-items: stretch;
|
254
258
|
padding: 0;
|
255
259
|
}
|
@@ -273,12 +277,15 @@
|
|
273
277
|
}
|
274
278
|
.pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check {
|
275
279
|
--pf-v5-c-menu-toggle--PaddingRight: 0;
|
276
|
-
--pf-v5-c-check__input--MarginTop: 0;
|
277
280
|
--pf-v5-c-check__label--Color: currentcolor;
|
278
281
|
--pf-v5-c-check__label--disabled--Color: currentcolor;
|
279
282
|
align-items: center;
|
280
283
|
align-self: stretch;
|
281
284
|
}
|
285
|
+
.pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check .pf-v5-c-check__input {
|
286
|
+
align-self: revert;
|
287
|
+
-moz-transform: none;
|
288
|
+
}
|
282
289
|
.pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
|
283
290
|
position: absolute;
|
284
291
|
top: 0;
|
@@ -364,6 +371,7 @@
|
|
364
371
|
--pf-v5-c-menu-toggle__controls--PaddingLeft: 0;
|
365
372
|
--pf-v5-c-menu-toggle__controls--MarginRight: var(--pf-v5-c-menu-toggle__button__controls--MarginRight);
|
366
373
|
--pf-v5-c-menu-toggle__controls--MarginLeft: var(--pf-v5-c-menu-toggle__button__controls--MarginLeft);
|
374
|
+
align-self: var(--pf-v5-c-menu-toggle__button--AlignSelf);
|
367
375
|
padding-right: var(--pf-v5-c-menu-toggle__button--PaddingRight);
|
368
376
|
padding-left: var(--pf-v5-c-menu-toggle__button--PaddingLeft);
|
369
377
|
color: inherit;
|
@@ -372,7 +380,6 @@
|
|
372
380
|
}
|
373
381
|
|
374
382
|
.pf-v5-c-menu-toggle__icon {
|
375
|
-
display: inline-flex;
|
376
383
|
flex-shrink: 0;
|
377
384
|
align-self: center;
|
378
385
|
margin-right: var(--pf-v5-c-menu-toggle__icon--MarginRight);
|
@@ -388,7 +395,7 @@
|
|
388
395
|
|
389
396
|
.pf-v5-c-menu-toggle__count {
|
390
397
|
display: flex;
|
391
|
-
|
398
|
+
flex-wrap: nowrap;
|
392
399
|
margin-left: var(--pf-v5-c-menu-toggle__count--MarginLeft);
|
393
400
|
}
|
394
401
|
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import './menu-toggle.css';
|
2
2
|
declare const _default: {
|
3
3
|
"check": "pf-v5-c-check",
|
4
|
+
"checkInput": "pf-v5-c-check__input",
|
4
5
|
"menuToggle": "pf-v5-c-menu-toggle",
|
5
6
|
"menuToggleButton": "pf-v5-c-menu-toggle__button",
|
6
7
|
"menuToggleControls": "pf-v5-c-menu-toggle__controls",
|
@@ -3,6 +3,7 @@ exports.__esModule = true;
|
|
3
3
|
require('./menu-toggle.css');
|
4
4
|
exports.default = {
|
5
5
|
"check": "pf-v5-c-check",
|
6
|
+
"checkInput": "pf-v5-c-check__input",
|
6
7
|
"menuToggle": "pf-v5-c-menu-toggle",
|
7
8
|
"menuToggleButton": "pf-v5-c-menu-toggle__button",
|
8
9
|
"menuToggleControls": "pf-v5-c-menu-toggle__controls",
|
@@ -4,24 +4,23 @@
|
|
4
4
|
--pf-v5-c-radio__label--Color: var(--pf-v5-global--Color--100);
|
5
5
|
--pf-v5-c-radio__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
|
6
6
|
--pf-v5-c-radio__label--FontSize: var(--pf-v5-global--FontSize--md);
|
7
|
-
--pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--
|
8
|
-
--pf-v5-c-radio__input--
|
9
|
-
--pf-v5-c-radio__input--MarginTop: calc(((var(--pf-v5-c-radio__label--FontSize) * var(--pf-v5-c-radio__label--LineHeight)) - var(--pf-v5-c-radio__input--Height)) / 2);
|
7
|
+
--pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--md);
|
8
|
+
--pf-v5-c-radio__input--TranslateY--moz: 5px;
|
10
9
|
--pf-v5-c-radio__input--first-child--MarginLeft: 0.0625rem;
|
11
10
|
--pf-v5-c-radio__input--last-child--MarginRight: 0.0625rem;
|
12
11
|
--pf-v5-c-radio__description--FontSize: var(--pf-v5-global--FontSize--sm);
|
13
12
|
--pf-v5-c-radio__description--Color: var(--pf-v5-global--Color--200);
|
14
13
|
--pf-v5-c-radio__body--MarginTop: var(--pf-v5-global--spacer--sm);
|
15
|
-
display: grid;
|
14
|
+
display: inline-grid;
|
16
15
|
grid-template-columns: auto 1fr;
|
17
16
|
grid-gap: var(--pf-v5-c-radio--GridGap);
|
17
|
+
align-items: baseline;
|
18
|
+
width: 100%;
|
18
19
|
}
|
19
20
|
.pf-v5-c-radio.pf-m-standalone {
|
20
21
|
--pf-v5-c-radio--GridGap: 0;
|
21
|
-
--pf-v5-c-radio__input--
|
22
|
-
|
23
|
-
display: inline-grid;
|
24
|
-
line-height: 1;
|
22
|
+
--pf-v5-c-radio__input--TranslateY--moz: 0;
|
23
|
+
width: auto;
|
25
24
|
}
|
26
25
|
|
27
26
|
.pf-v5-c-radio__label {
|
@@ -32,8 +31,7 @@
|
|
32
31
|
}
|
33
32
|
|
34
33
|
.pf-v5-c-radio__input {
|
35
|
-
|
36
|
-
margin-top: var(--pf-v5-c-radio__input--MarginTop);
|
34
|
+
-moz-transform: translateY(var(--pf-v5-c-radio__input--TranslateY--moz));
|
37
35
|
}
|
38
36
|
.pf-v5-c-radio__input:first-child {
|
39
37
|
margin-left: var(--pf-v5-c-radio__input--first-child--MarginLeft);
|
@@ -55,16 +55,20 @@
|
|
55
55
|
--pf-v5-c-toolbar--PaddingTop: var(--pf-v5-global--spacer--md);
|
56
56
|
--pf-v5-c-toolbar--PaddingBottom: var(--pf-v5-global--spacer--md);
|
57
57
|
--pf-v5-c-toolbar--item--RowGap--base: var(--pf-v5-global--spacer--xs);
|
58
|
-
--pf-v5-c-toolbar__item--Display:
|
58
|
+
--pf-v5-c-toolbar__item--Display: flex;
|
59
59
|
--pf-v5-c-toolbar__item--MinWidth--base: auto;
|
60
|
-
--pf-v5-c-toolbar__item--AlignSelf: auto;
|
61
60
|
--pf-v5-c-toolbar__item--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
|
61
|
+
--pf-v5-c-toolbar__item--AlignSelf: var(--pf-v5-c-toolbar--AlignItems--base);
|
62
62
|
--pf-v5-c-toolbar__group--Display: flex;
|
63
|
+
--pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
|
63
64
|
--pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
|
64
65
|
--pf-v5-c-toolbar__group--AlignSelf: auto;
|
65
|
-
--pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
|
66
66
|
--pf-v5-c-toolbar--m-sticky--ZIndex: var(--pf-v5-global--ZIndex--xs);
|
67
67
|
--pf-v5-c-toolbar--m-sticky--BoxShadow: var(--pf-v5-global--BoxShadow--sm-bottom);
|
68
|
+
--pf-v5-c-toolbar--m-align-items-center--AlignItems: center;
|
69
|
+
--pf-v5-c-toolbar--m-align-items-baseline--AlignItems: baseline;
|
70
|
+
--pf-v5-c-toolbar--m-align-self-center--AlignSelf: center;
|
71
|
+
--pf-v5-c-toolbar--m-align-self-baseline--AlignSelf: baseline;
|
68
72
|
--pf-v5-c-toolbar__content--Display: flex;
|
69
73
|
--pf-v5-c-toolbar__content--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
|
70
74
|
--pf-v5-c-toolbar__content--RowGap: var(--pf-v5-c-toolbar--RowGap--base);
|
@@ -109,7 +113,9 @@
|
|
109
113
|
--pf-v5-c-toolbar__item--m-search-filter--spacer: var(--pf-v5-global--spacer--sm);
|
110
114
|
--pf-v5-c-toolbar__item--m-chip-group--spacer: var(--pf-v5-global--spacer--sm);
|
111
115
|
--pf-v5-c-toolbar__item--m-label--spacer: var(--pf-v5-c-toolbar__item--spacer);
|
116
|
+
--pf-v5-c-toolbar__item--m-label--TranslateY: var(--pf-v5-global--spacer--form-element);
|
112
117
|
--pf-v5-c-toolbar__item--m-label--FontWeight: var(--pf-v5-global--FontWeight--bold);
|
118
|
+
--pf-v5-c-toolbar__item--m-form-control--TranslateY: var(--pf-v5-global--spacer--form-element);
|
113
119
|
--pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom: calc(-1 * var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap) + var(--pf-v5-global--spacer--sm));
|
114
120
|
--pf-v5-c-toolbar__expandable-content__item--m-label--FontSize: var(--pf-v5-global--FontSize--sm);
|
115
121
|
--pf-v5-c-toolbar__toggle--m-expanded__c-button--m-plain--Color: var(--pf-v5-global--Color--100);
|
@@ -117,7 +123,7 @@
|
|
117
123
|
--pf-v5-c-toolbar--m-full-height--PaddingTop: 0;
|
118
124
|
--pf-v5-c-toolbar--m-full-height--PaddingBottom: 0;
|
119
125
|
--pf-v5-c-toolbar--m-full-height__item--Display: flex;
|
120
|
-
--pf-v5-c-toolbar--m-full-height__item--AlignItems:
|
126
|
+
--pf-v5-c-toolbar--m-full-height__item--AlignItems: center;
|
121
127
|
position: relative;
|
122
128
|
display: grid;
|
123
129
|
row-gap: var(--pf-v5-c-toolbar--RowGap);
|
@@ -196,11 +202,11 @@
|
|
196
202
|
}
|
197
203
|
.pf-v5-c-toolbar__content-section.pf-m-align-items-center,
|
198
204
|
.pf-v5-c-toolbar__group.pf-m-align-items-center {
|
199
|
-
align-items
|
205
|
+
--pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
|
200
206
|
}
|
201
207
|
.pf-v5-c-toolbar__content-section.pf-m-align-items-baseline,
|
202
208
|
.pf-v5-c-toolbar__group.pf-m-align-items-baseline {
|
203
|
-
align-items
|
209
|
+
--pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-baseline--AlignItems);
|
204
210
|
}
|
205
211
|
.pf-v5-c-toolbar__content-section.pf-m-align-self-start,
|
206
212
|
.pf-v5-c-toolbar__group.pf-m-align-self-start {
|
@@ -208,11 +214,11 @@
|
|
208
214
|
}
|
209
215
|
.pf-v5-c-toolbar__content-section.pf-m-align-self-center,
|
210
216
|
.pf-v5-c-toolbar__group.pf-m-align-self-center {
|
211
|
-
align-self
|
217
|
+
--pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-center--AlignItems);
|
212
218
|
}
|
213
219
|
.pf-v5-c-toolbar__content-section.pf-m-align-self-baseline,
|
214
220
|
.pf-v5-c-toolbar__group.pf-m-align-self-baseline {
|
215
|
-
align-self
|
221
|
+
--pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-baseline--AlignItems);
|
216
222
|
}
|
217
223
|
|
218
224
|
.pf-v5-c-toolbar__group {
|
@@ -355,6 +361,7 @@
|
|
355
361
|
.pf-v5-c-toolbar__item.pf-m-label {
|
356
362
|
--pf-v5-c-toolbar--spacer: var(--pf-v5-c-toolbar__item--m-label--spacer);
|
357
363
|
font-weight: var(--pf-v5-c-toolbar__item--m-label--FontWeight);
|
364
|
+
transform: translateY(var(--pf-v5-global--spacer--form-element));
|
358
365
|
}
|
359
366
|
.pf-v5-c-toolbar__item.pf-m-pagination {
|
360
367
|
margin-left: auto;
|
@@ -402,7 +409,7 @@
|
|
402
409
|
align-items: flex-start;
|
403
410
|
}
|
404
411
|
.pf-v5-c-toolbar__content-section.pf-m-align-items-center {
|
405
|
-
align-items
|
412
|
+
--pf-v5-c-toolbar__content-section--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
|
406
413
|
}
|
407
414
|
.pf-v5-c-toolbar__content-section.pf-m-align-items-baseline {
|
408
415
|
align-items: baseline;
|
@@ -438,7 +445,7 @@
|
|
438
445
|
display: grid;
|
439
446
|
grid-row-gap: var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap);
|
440
447
|
}
|
441
|
-
.pf-v5-c-toolbar__expandable-content .pf-m-label {
|
448
|
+
.pf-v5-c-toolbar__expandable-content .pf-v5-c-toolbar__item.pf-m-label {
|
442
449
|
margin-bottom: var(--pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom);
|
443
450
|
font-size: var(--pf-v5-c-toolbar__expandable-content__item--m-label--FontSize);
|
444
451
|
}
|
@@ -454,10 +461,12 @@
|
|
454
461
|
.pf-v5-c-toolbar__content.pf-m-chip-container .pf-v5-c-toolbar__item,
|
455
462
|
.pf-v5-c-toolbar__group.pf-m-chip-container .pf-v5-c-toolbar__item {
|
456
463
|
--pf-v5-c-toolbar--spacer: var(--pf-v5-c-toolbar__item--spacer);
|
464
|
+
--pf-v5-c-toolbar__item--AlignSelf: auto;
|
457
465
|
margin-top: var(--pf-v5-c-toolbar__group--m-chip-container__item--MarginTop);
|
458
466
|
}
|
459
467
|
.pf-v5-c-toolbar__content.pf-m-chip-container .pf-v5-c-toolbar__group,
|
460
468
|
.pf-v5-c-toolbar__group.pf-m-chip-container .pf-v5-c-toolbar__group {
|
469
|
+
--pf-v5-c-toolbar__group--AlignItems: center;
|
461
470
|
--pf-v5-c-toolbar--spacer: var(--pf-v5-c-toolbar__group--spacer);
|
462
471
|
display: flex;
|
463
472
|
flex-wrap: wrap;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@patternfly/react-styles",
|
3
|
-
"version": "5.0.0
|
3
|
+
"version": "5.0.0",
|
4
4
|
"main": "dist/js/index.js",
|
5
5
|
"module": "dist/esm/index.js",
|
6
6
|
"types": "dist/esm/index.d.ts",
|
@@ -11,15 +11,14 @@
|
|
11
11
|
"description": "CSS-in-JS class maps and utilities for PatternFly.",
|
12
12
|
"author": "Red Hat",
|
13
13
|
"publishConfig": {
|
14
|
-
"access": "public"
|
15
|
-
"tag": "alpha"
|
14
|
+
"access": "public"
|
16
15
|
},
|
17
16
|
"scripts": {
|
18
17
|
"generate": "rimraf css && node scripts/writeClassMaps.js && node scripts/copyStyles.js",
|
19
18
|
"clean": "rimraf dist css"
|
20
19
|
},
|
21
20
|
"devDependencies": {
|
22
|
-
"@patternfly/patternfly": "5.0.
|
21
|
+
"@patternfly/patternfly": "5.0.2",
|
23
22
|
"camel-case": "^3.0.0",
|
24
23
|
"css": "^2.2.3",
|
25
24
|
"fs-extra": "^11.1.1",
|
@@ -29,5 +28,5 @@
|
|
29
28
|
"typescript": "^4.7.4"
|
30
29
|
},
|
31
30
|
"license": "MIT",
|
32
|
-
"gitHead": "
|
31
|
+
"gitHead": "c0f47f037259cf954b2829ea08636bf02afc31db"
|
33
32
|
}
|