@patternfly/react-styles 4.42.19 → 4.44.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/CHANGELOG.md +41 -0
  2. package/css/components/AlertGroup/alert-group.css +36 -0
  3. package/css/components/AlertGroup/alert-group.d.ts +1 -0
  4. package/css/components/AlertGroup/alert-group.js +1 -0
  5. package/css/components/NumberInput/number-input.css +9 -6
  6. package/css/components/Pagination/pagination.css +9 -1
  7. package/css/components/ProgressStepper/progress-stepper.css +3 -0
  8. package/css/components/Table/table-tree-view.css +7 -0
  9. package/css/components/TextInputGroup/text-input-group.css +4 -0
  10. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,47 @@
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
+ # 4.44.0 (2022-02-08)
7
+
8
+
9
+ ### Features
10
+
11
+ * **MenuToggle:** add full height variation ([#6869](https://github.com/patternfly/patternfly-react/issues/6869)) ([415e02f](https://github.com/patternfly/patternfly-react/commit/415e02f5e5617367db717cd5120df04ec1a208eb))
12
+
13
+
14
+
15
+
16
+
17
+ # 4.43.0 (2022-02-08)
18
+
19
+
20
+ ### Features
21
+
22
+ * **Table:** add striping ([#6886](https://github.com/patternfly/patternfly-react/issues/6886)) ([47abda7](https://github.com/patternfly/patternfly-react/commit/47abda7831e21c58051b90982f02cb48f7a22a22))
23
+
24
+
25
+
26
+
27
+
28
+ ## 4.42.21 (2022-02-07)
29
+
30
+
31
+ ### Bug Fixes
32
+
33
+ * **TimePicker:** apply includeSeconds when making options ([#6865](https://github.com/patternfly/patternfly-react/issues/6865)) ([5b6d6c9](https://github.com/patternfly/patternfly-react/commit/5b6d6c9979046c111b00456622758f542627ac11))
34
+
35
+
36
+
37
+
38
+
39
+ ## 4.42.20 (2022-02-07)
40
+
41
+ **Note:** Version bump only for package @patternfly/react-styles
42
+
43
+
44
+
45
+
46
+
6
47
  ## 4.42.19 (2022-02-07)
7
48
 
8
49
 
package/css/components/AlertGroup/alert-group.css CHANGED
@@ -4,6 +4,20 @@
4
4
  --pf-c-alert-group--m-toast--Right: var(--pf-global--spacer--xl);
5
5
  --pf-c-alert-group--m-toast--MaxWidth: 37.5rem;
6
6
  --pf-c-alert-group--m-toast--ZIndex: var(--pf-global--ZIndex--2xl);
7
+ --pf-c-alert-group__overflow-button--BorderWidth: 0;
8
+ --pf-c-alert-group__overflow-button--PaddingTop: var(--pf-global--spacer--lg);
9
+ --pf-c-alert-group__overflow-button--PaddingRight: var(--pf-global--spacer--md);
10
+ --pf-c-alert-group__overflow-button--PaddingBottom: var(--pf-global--spacer--lg);
11
+ --pf-c-alert-group__overflow-button--PaddingLeft: var(--pf-global--spacer--md);
12
+ --pf-c-alert-group__overflow-button--Color: var(--pf-global--link--Color);
13
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-global--BoxShadow--lg);
14
+ --pf-c-alert-group__overflow-button--BackgroundColor: var(--pf-global--BackgroundColor--100);
15
+ --pf-c-alert-group__overflow-button--hover--Color: var(--pf-global--link--Color--hover);
16
+ --pf-c-alert-group__overflow-button--hover--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
17
+ --pf-c-alert-group__overflow-button--focus--Color: var(--pf-global--link--Color--hover);
18
+ --pf-c-alert-group__overflow-button--focus--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
19
+ --pf-c-alert-group__overflow-button--active--Color: var(--pf-global--link--Color--hover);
20
+ --pf-c-alert-group__overflow-button--active--BoxShadow: var(--pf-global--BoxShadow--lg), var(--pf-global--BoxShadow--lg-bottom);
7
21
  }
8
22
  .pf-c-alert-group > * + * {
9
23
  margin-top: var(--pf-c-alert-group__item--MarginTop);
@@ -15,4 +29,26 @@
15
29
  z-index: var(--pf-c-alert-group--m-toast--ZIndex);
16
30
  width: calc(100% - calc(var(--pf-c-alert-group--m-toast--Right) * 2));
17
31
  max-width: var(--pf-c-alert-group--m-toast--MaxWidth);
32
+ }
33
+
34
+ .pf-c-alert-group__overflow-button {
35
+ position: relative;
36
+ width: 100%;
37
+ padding: var(--pf-c-alert-group__overflow-button--PaddingTop) var(--pf-c-alert-group__overflow-button--PaddingRight) var(--pf-c-alert-group__overflow-button--PaddingBottom) var(--pf-c-alert-group__overflow-button--PaddingLeft);
38
+ color: var(--pf-c-alert-group__overflow-button--Color);
39
+ background-color: var(--pf-c-alert-group__overflow-button--BackgroundColor);
40
+ border-width: var(--pf-c-alert-group__overflow-button--BorderWidth);
41
+ box-shadow: var(--pf-c-alert-group__overflow-button--BoxShadow);
42
+ }
43
+ .pf-c-alert-group__overflow-button:hover {
44
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--hover--Color);
45
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--hover--BoxShadow);
46
+ }
47
+ .pf-c-alert-group__overflow-button:focus {
48
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--focus--Color);
49
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--focus--BoxShadow);
50
+ }
51
+ .pf-c-alert-group__overflow-button:active {
52
+ --pf-c-alert-group__overflow-button--Color: var(--pf-c-alert-group__overflow-button--active--Color);
53
+ --pf-c-alert-group__overflow-button--BoxShadow: var(--pf-c-alert-group__overflow-button--active--BoxShadow);
18
54
  }
package/css/components/AlertGroup/alert-group.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import './alert-group.css';
2
2
  declare const _default: {
3
3
  "alertGroup": "pf-c-alert-group",
4
+ "alertGroupOverflowButton": "pf-c-alert-group__overflow-button",
4
5
  "modifiers": {
5
6
  "toast": "pf-m-toast"
6
7
  }
package/css/components/AlertGroup/alert-group.js CHANGED
@@ -3,6 +3,7 @@ exports.__esModule = true;
3
3
  require('./alert-group.css');
4
4
  exports.default = {
5
5
  "alertGroup": "pf-c-alert-group",
6
+ "alertGroupOverflowButton": "pf-c-alert-group__overflow-button",
6
7
  "modifiers": {
7
8
  "toast": "pf-m-toast"
8
9
  }
package/css/components/NumberInput/number-input.css CHANGED
@@ -1,7 +1,15 @@
1
+ .pf-c-number-input .pf-c-form-control {
2
+ appearance: textfield;
3
+ }
4
+ .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
5
+ appearance: none;
6
+ margin: 0;
7
+ }
8
+
1
9
  .pf-c-number-input {
2
10
  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
3
11
  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
4
- --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2);
12
+ --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
5
13
  --pf-c-number-input--c-form-control--width-chars: 4;
6
14
  --pf-c-number-input--c-form-control--Width: calc(var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch);
7
15
  display: inline-flex;
@@ -11,11 +19,6 @@
11
19
  display: inline-flex;
12
20
  width: var(--pf-c-number-input--c-form-control--Width);
13
21
  text-align: right;
14
- -moz-appearance: textfield;
15
- }
16
- .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button {
17
- -webkit-appearance: none;
18
- margin: 0;
19
22
  }
20
23
 
21
24
  .pf-c-input-group + .pf-c-number-input__unit,
package/css/components/Pagination/pagination.css CHANGED
@@ -1,3 +1,11 @@
1
+ .pf-c-pagination__nav-page-select .pf-c-form-control {
2
+ appearance: textfield;
3
+ }
4
+ .pf-c-pagination__nav-page-select .pf-c-form-control::-webkit-inner-spin-button, .pf-c-pagination__nav-page-select .pf-c-form-control::-webkit-outer-spin-button {
5
+ appearance: none;
6
+ margin: 0;
7
+ }
8
+
1
9
  .pf-c-pagination {
2
10
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
3
11
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
@@ -26,7 +34,7 @@
26
34
  --pf-c-pagination__nav-page-select--PaddingLeft: var(--pf-global--spacer--md);
27
35
  --pf-c-pagination__nav-page-select--PaddingRight: var(--pf-global--spacer--md);
28
36
  --pf-c-pagination__nav-page-select--child--MarginRight: var(--pf-global--spacer--xs);
29
- --pf-c-pagination__nav-page-select--c-form-control--width-base: 3.5ch;
37
+ --pf-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
30
38
  --pf-c-pagination__nav-page-select--c-form-control--width-chars: 2;
31
39
  --pf-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
32
40
  --pf-c-pagination__total-items--Display: block;
package/css/components/ProgressStepper/progress-stepper.css CHANGED
@@ -172,6 +172,9 @@
172
172
  .pf-c-progress-stepper__step.pf-m-info {
173
173
  --pf-c-progress-stepper__step-icon--Color: var(--pf-global--info-color--100);
174
174
  }
175
+ .pf-c-progress-stepper__step:last-child {
176
+ --pf-c-progress-stepper__step-main--MarginBottom: 0;
177
+ }
175
178
 
176
179
  .pf-c-progress-stepper__step-connector {
177
180
  position: relative;
package/css/components/Table/table-tree-view.css CHANGED
@@ -3,6 +3,8 @@
3
3
  --pf-c-table__tree-view-main--nested-indent--base: calc(var(--pf-c-table__tree-view-main--indent--base) - var(--pf-global--spacer--md));
4
4
  --pf-c-table__tree-view-main--PaddingLeft: var(--pf-c-table__tree-view-main--indent--base);
5
5
  --pf-c-table__tree-view-main--MarginLeft: calc(var(--pf-c-table--cell--PaddingLeft) * -1);
6
+ --pf-c-table__tree-view-main--c-table__check--PaddingRight: var(--pf-global--spacer--sm);
7
+ --pf-c-table__tree-view-main--c-table__check--PaddingLeft: var(--pf-global--spacer--sm);
6
8
  --pf-c-table__tree-view-main--c-table__check--MarginRight: var(--pf-global--spacer--sm);
7
9
  --pf-c-table__tree-view-icon--MinWidth: var(--pf-global--FontSize--md);
8
10
  --pf-c-table__tree-view-icon--MarginRight: var(--pf-global--spacer--sm);
@@ -63,6 +65,11 @@
63
65
  .pf-c-table__tree-view-main > .pf-c-table__check {
64
66
  margin-right: var(--pf-c-table__tree-view-main--c-table__check--MarginRight);
65
67
  }
68
+ .pf-c-table__tree-view-main > .pf-c-table__check label {
69
+ padding-right: var(--pf-c-table__tree-view-main--c-table__check--PaddingRight);
70
+ padding-left: var(--pf-c-table__tree-view-main--c-table__check--PaddingLeft);
71
+ margin: 0 calc(var(--pf-c-table__tree-view-main--c-table__check--MarginRight) * -1) 0 0;
72
+ }
66
73
 
67
74
  .pf-c-table__tree-view-text {
68
75
  display: flex;
package/css/components/TextInputGroup/text-input-group.css CHANGED
@@ -15,6 +15,7 @@
15
15
  --pf-c-text-input-group__text-input--PaddingLeft: var(--pf-global--spacer--sm);
16
16
  --pf-c-text-input-group__text-input--MinWidth: 12ch;
17
17
  --pf-c-text-input-group__text-input--m-hint--Color: var(--pf-global--Color--dark-200);
18
+ --pf-c-text-input-group--placeholder--Color: var(--pf-global--Color--dark-200);
18
19
  --pf-c-text-input-group__icon--Left: var(--pf-global--spacer--sm);
19
20
  --pf-c-text-input-group__icon--Color: var(--pf-global--Color--200);
20
21
  --pf-c-text-input-group__text--hover__icon--Color: var(--pf-global--Color--100);
@@ -121,6 +122,9 @@
121
122
  .pf-c-text-input-group__text-input.pf-m-hint {
122
123
  color: var(--pf-c-text-input-group__text-input--m-hint--Color);
123
124
  }
125
+ .pf-c-text-input-group__text-input::placeholder {
126
+ color: var(--pf-c-text-input-group--placeholder--Color);
127
+ }
124
128
 
125
129
  .pf-c-text-input-group__utilities {
126
130
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-styles",
3
- "version": "4.42.19",
3
+ "version": "4.44.0",
4
4
  "main": "dist/js/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/esm/index.d.ts",
@@ -19,7 +19,7 @@
19
19
  "clean": "rimraf dist css"
20
20
  },
21
21
  "devDependencies": {
22
- "@patternfly/patternfly": "4.171.1",
22
+ "@patternfly/patternfly": "4.176.0",
23
23
  "camel-case": "^3.0.0",
24
24
  "css": "^2.2.3",
25
25
  "fs-extra": "^6.0.1",
@@ -29,5 +29,5 @@
29
29
  "typescript": "^4.0.0"
30
30
  },
31
31
  "license": "MIT",
32
- "gitHead": "bc209995e347be2c3b41cd76790f890341b47b45"
32
+ "gitHead": "93fcbc098065425384e6761e8abb6f8ff0cde2af"
33
33
  }