@patternfly/react-styles 5.0.0-alpha.17 → 5.0.0-alpha.18

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,12 @@
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-alpha.18 (2023-06-01)
7
+
8
+ ### Bug Fixes
9
+
10
+ - **react-styles:** updated class names to include versions ([#9173](https://github.com/patternfly/patternfly-react/issues/9173)) ([ae05e89](https://github.com/patternfly/patternfly-react/commit/ae05e89a361773223c3804fa352ea7eefab01c8a))
11
+
6
12
  # 5.0.0-alpha.17 (2023-05-31)
7
13
 
8
14
  **Note:** Version bump only for package @patternfly/react-styles
@@ -1,14 +1,14 @@
1
- .pf-c-console {
1
+ .pf-v5-c-console {
2
2
  display: grid;
3
3
  grid-template-areas:
4
4
  'actions-main actions-extra'
5
5
  'main main';
6
6
  row-gap: var(--pf-v5-global--spacer--md);
7
7
  }
8
- .pf-c-console__actions {
8
+ .pf-v5-c-console__actions {
9
9
  grid-area: actions-main;
10
10
  display: flex;
11
11
  }
12
- .pf-c-console__actions > div {
12
+ .pf-v5-c-console__actions > div {
13
13
  margin-right: var(--pf-v5-global--spacer--sm);
14
14
  }
@@ -1,6 +1,6 @@
1
1
  import './AccessConsoles.css';
2
2
  declare const _default: {
3
- "console": "pf-c-console",
4
- "consoleActions": "pf-c-console__actions"
3
+ "console": "pf-v5-c-console",
4
+ "consoleActions": "pf-v5-c-console__actions"
5
5
  };
6
6
  export default _default;
@@ -2,6 +2,6 @@
2
2
  exports.__esModule = true;
3
3
  require('./AccessConsoles.css');
4
4
  exports.default = {
5
- "console": "pf-c-console",
6
- "consoleActions": "pf-c-console__actions"
5
+ "console": "pf-v5-c-console",
6
+ "consoleActions": "pf-v5-c-console__actions"
7
7
  };
@@ -1,5 +1,5 @@
1
1
  import './AccessConsoles.css';
2
2
  export default {
3
- "console": "pf-c-console",
4
- "consoleActions": "pf-c-console__actions"
3
+ "console": "pf-v5-c-console",
4
+ "consoleActions": "pf-v5-c-console__actions"
5
5
  };
@@ -1,4 +1,4 @@
1
- .pf-c-console__desktop-viewer {
1
+ .pf-v5-c-console__desktop-viewer {
2
2
  grid-area: main;
3
3
  display: grid;
4
4
  gap: var(--pf-v5-global--spacer--md);
@@ -1,5 +1,5 @@
1
1
  import './DesktopViewer.css';
2
2
  declare const _default: {
3
- "consoleDesktopViewer": "pf-c-console__desktop-viewer"
3
+ "consoleDesktopViewer": "pf-v5-c-console__desktop-viewer"
4
4
  };
5
5
  export default _default;
@@ -2,5 +2,5 @@
2
2
  exports.__esModule = true;
3
3
  require('./DesktopViewer.css');
4
4
  exports.default = {
5
- "consoleDesktopViewer": "pf-c-console__desktop-viewer"
5
+ "consoleDesktopViewer": "pf-v5-c-console__desktop-viewer"
6
6
  };
@@ -1,4 +1,4 @@
1
1
  import './DesktopViewer.css';
2
2
  export default {
3
- "consoleDesktopViewer": "pf-c-console__desktop-viewer"
3
+ "consoleDesktopViewer": "pf-v5-c-console__desktop-viewer"
4
4
  };
@@ -1,11 +1,11 @@
1
- .pf-c-console__serial {
1
+ .pf-v5-c-console__serial {
2
2
  grid-area: main;
3
3
  }
4
- .pf-c-console__actions-serial {
4
+ .pf-v5-c-console__actions-serial {
5
5
  grid-area: actions-extra;
6
6
  display: flex;
7
7
  justify-content: flex-end;
8
8
  }
9
- .pf-c-console__actions-serial > button {
9
+ .pf-v5-c-console__actions-serial > button {
10
10
  margin-right: var(--pf-v5-global--spacer--sm);
11
11
  }
@@ -1,6 +1,6 @@
1
1
  import './SerialConsole.css';
2
2
  declare const _default: {
3
- "consoleActionsSerial": "pf-c-console__actions-serial",
4
- "consoleSerial": "pf-c-console__serial"
3
+ "consoleActionsSerial": "pf-v5-c-console__actions-serial",
4
+ "consoleSerial": "pf-v5-c-console__serial"
5
5
  };
6
6
  export default _default;
@@ -2,6 +2,6 @@
2
2
  exports.__esModule = true;
3
3
  require('./SerialConsole.css');
4
4
  exports.default = {
5
- "consoleActionsSerial": "pf-c-console__actions-serial",
6
- "consoleSerial": "pf-c-console__serial"
5
+ "consoleActionsSerial": "pf-v5-c-console__actions-serial",
6
+ "consoleSerial": "pf-v5-c-console__serial"
7
7
  };
@@ -1,5 +1,5 @@
1
1
  import './SerialConsole.css';
2
2
  export default {
3
- "consoleActionsSerial": "pf-c-console__actions-serial",
4
- "consoleSerial": "pf-c-console__serial"
3
+ "consoleActionsSerial": "pf-v5-c-console__actions-serial",
4
+ "consoleSerial": "pf-v5-c-console__serial"
5
5
  };
@@ -1,7 +1,7 @@
1
- .pf-c-console__vnc {
1
+ .pf-v5-c-console__vnc {
2
2
  grid-area: main;
3
3
  }
4
- .pf-c-console__actions-vnc {
4
+ .pf-v5-c-console__actions-vnc {
5
5
  grid-area: actions-extra;
6
6
  display: flex;
7
7
  flex-wrap: wrap;
@@ -1,6 +1,6 @@
1
1
  import './VncConsole.css';
2
2
  declare const _default: {
3
- "consoleActionsVnc": "pf-c-console__actions-vnc",
4
- "consoleVnc": "pf-c-console__vnc"
3
+ "consoleActionsVnc": "pf-v5-c-console__actions-vnc",
4
+ "consoleVnc": "pf-v5-c-console__vnc"
5
5
  };
6
6
  export default _default;
@@ -2,6 +2,6 @@
2
2
  exports.__esModule = true;
3
3
  require('./VncConsole.css');
4
4
  exports.default = {
5
- "consoleActionsVnc": "pf-c-console__actions-vnc",
6
- "consoleVnc": "pf-c-console__vnc"
5
+ "consoleActionsVnc": "pf-v5-c-console__actions-vnc",
6
+ "consoleVnc": "pf-v5-c-console__vnc"
7
7
  };
@@ -1,5 +1,5 @@
1
1
  import './VncConsole.css';
2
2
  export default {
3
- "consoleActionsVnc": "pf-c-console__actions-vnc",
4
- "consoleVnc": "pf-c-console__vnc"
3
+ "consoleActionsVnc": "pf-v5-c-console__actions-vnc",
4
+ "consoleVnc": "pf-v5-c-console__vnc"
5
5
  };
@@ -1,60 +1,60 @@
1
1
  :root {
2
- --pf-v5-global--Blue--50: #def3ff;
3
- --pf-v5-global--Blue--200: #7dc3e8;
2
+ --pf-v5-global--palette--blue-50: #def3ff;
3
+ --pf-v5-global--palette--blue-200: #7dc3e8;
4
4
  }
5
5
 
6
- tr.pf-c-table__editable-row:hover,
7
- tr.pf-c-table__editable-row.pf-m-editing {
8
- background: var(--pf-v5-global--Blue--50) !important;
6
+ tr.pf-v5-c-table__editable-row:hover,
7
+ tr.pf-v5-c-table__editable-row.pf-m-editing {
8
+ background: var(--pf-v5-global--palette--blue-50) !important;
9
9
  }
10
- tr.pf-c-table__editable-row:hover td,
11
- tr.pf-c-table__editable-row.pf-m-editing td {
12
- border-bottom: 1px solid var(--pf-v5-global--Blue--200) !important;
13
- border-top: 1px solid var(--pf-v5-global--Blue--200) !important;
10
+ tr.pf-v5-c-table__editable-row:hover td,
11
+ tr.pf-v5-c-table__editable-row.pf-m-editing td {
12
+ border-bottom: 1px solid var(--pf-v5-global--palette--blue-200) !important;
13
+ border-top: 1px solid var(--pf-v5-global--palette--blue-200) !important;
14
14
  }
15
- tr.pf-c-table__editable-row:hover td:first-child,
16
- tr.pf-c-table__editable-row.pf-m-editing td:first-child {
17
- border-left: 1px solid var(--pf-v5-global--Blue--200) !important;
15
+ tr.pf-v5-c-table__editable-row:hover td:first-child,
16
+ tr.pf-v5-c-table__editable-row.pf-m-editing td:first-child {
17
+ border-left: 1px solid var(--pf-v5-global--palette--blue-200) !important;
18
18
  }
19
- tr.pf-c-table__editable-row:hover td:last-child,
20
- tr.pf-c-table__editable-row.pf-m-editing td:last-child {
21
- border-right: 1px solid var(--pf-v5-global--Blue--200) !important;
19
+ tr.pf-v5-c-table__editable-row:hover td:last-child,
20
+ tr.pf-v5-c-table__editable-row.pf-m-editing td:last-child {
21
+ border-right: 1px solid var(--pf-v5-global--palette--blue-200) !important;
22
22
  }
23
- tr.pf-c-table__editable-row.pf-m-table-editing-first-row {
24
- border-top: 3px solid var(--pf-v5-global--Blue--200) !important;
23
+ tr.pf-v5-c-table__editable-row.pf-m-table-editing-first-row {
24
+ border-top: 3px solid var(--pf-v5-global--palette--blue-200) !important;
25
25
  }
26
- tr.pf-c-table__editable-row.pf-m-table-editing-last-row {
27
- border-bottom: 3px solid var(--pf-v5-global--Blue--200) !important;
26
+ tr.pf-v5-c-table__editable-row.pf-m-table-editing-last-row {
27
+ border-bottom: 3px solid var(--pf-v5-global--palette--blue-200) !important;
28
28
  }
29
- tr.pf-c-table__editable-row input {
29
+ tr.pf-v5-c-table__editable-row input {
30
30
  display: block;
31
31
  background: var(--pf-v5-global--BackgroundColor--100);
32
- border: 1px solid var(--pf-v5-global--BorderColor);
32
+ border: 1px solid var(--pf-v5-global--BorderColor--100);
33
33
  }
34
- tr.pf-c-table__editable-row input:hover {
34
+ tr.pf-v5-c-table__editable-row input:hover {
35
35
  cursor: text;
36
36
  }
37
37
 
38
- .pf-c-table__inline-edit-buttons {
38
+ .pf-v5-c-table__inline-edit-buttons {
39
39
  position: fixed;
40
40
  z-index: 1000;
41
41
  padding: 4px;
42
42
  margin: 0;
43
- background: var(--pf-v5-global--Blue--50);
44
- border: 1px solid var(--pf-v5-global--Blue--200);
43
+ background: var(--pf-v5-global--palette--blue-50);
44
+ border: 1px solid var(--pf-v5-global--palette--blue-200);
45
45
  }
46
- .pf-c-table__inline-edit-buttons.pf-m-top {
46
+ .pf-v5-c-table__inline-edit-buttons.pf-m-top {
47
47
  border-bottom: 0;
48
48
  }
49
- .pf-c-table__inline-edit-buttons.pf-m-bottom {
49
+ .pf-v5-c-table__inline-edit-buttons.pf-m-bottom {
50
50
  border-top: 0;
51
51
  }
52
- .pf-c-table__inline-edit-buttons.pf-m-bold {
52
+ .pf-v5-c-table__inline-edit-buttons.pf-m-bold {
53
53
  border-width: 3px;
54
54
  }
55
- .pf-c-table__inline-edit-buttons button {
55
+ .pf-v5-c-table__inline-edit-buttons button {
56
56
  margin-left: 4px;
57
57
  }
58
- .pf-c-table__inline-edit-buttons button:first-child {
58
+ .pf-v5-c-table__inline-edit-buttons button:first-child {
59
59
  margin-left: 0;
60
60
  }
@@ -8,7 +8,7 @@ declare const _default: {
8
8
  "bottom": "pf-m-bottom",
9
9
  "bold": "pf-m-bold"
10
10
  },
11
- "tableEditableRow": "pf-c-table__editable-row",
12
- "tableInlineEditButtons": "pf-c-table__inline-edit-buttons"
11
+ "tableEditableRow": "pf-v5-c-table__editable-row",
12
+ "tableInlineEditButtons": "pf-v5-c-table__inline-edit-buttons"
13
13
  };
14
14
  export default _default;
@@ -10,6 +10,6 @@ exports.default = {
10
10
  "bottom": "pf-m-bottom",
11
11
  "bold": "pf-m-bold"
12
12
  },
13
- "tableEditableRow": "pf-c-table__editable-row",
14
- "tableInlineEditButtons": "pf-c-table__inline-edit-buttons"
13
+ "tableEditableRow": "pf-v5-c-table__editable-row",
14
+ "tableInlineEditButtons": "pf-v5-c-table__inline-edit-buttons"
15
15
  };
@@ -8,6 +8,6 @@ export default {
8
8
  "bottom": "pf-m-bottom",
9
9
  "bold": "pf-m-bold"
10
10
  },
11
- "tableEditableRow": "pf-c-table__editable-row",
12
- "tableInlineEditButtons": "pf-c-table__inline-edit-buttons"
11
+ "tableEditableRow": "pf-v5-c-table__editable-row",
12
+ "tableInlineEditButtons": "pf-v5-c-table__inline-edit-buttons"
13
13
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-styles",
3
- "version": "5.0.0-alpha.17",
3
+ "version": "5.0.0-alpha.18",
4
4
  "main": "dist/js/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/esm/index.d.ts",
@@ -29,5 +29,5 @@
29
29
  "typescript": "^4.7.4"
30
30
  },
31
31
  "license": "MIT",
32
- "gitHead": "0f4a1d04e19c94a00f2174fb5e063e4cc516819f"
32
+ "gitHead": "026c5f69bb0f7280c796d28f2d3fd52891793229"
33
33
  }
@@ -1,14 +1,14 @@
1
- .pf-c-console {
1
+ .pf-v5-c-console {
2
2
  display: grid;
3
3
  grid-template-areas:
4
4
  'actions-main actions-extra'
5
5
  'main main';
6
6
  row-gap: var(--pf-v5-global--spacer--md);
7
7
  }
8
- .pf-c-console__actions {
8
+ .pf-v5-c-console__actions {
9
9
  grid-area: actions-main;
10
10
  display: flex;
11
11
  }
12
- .pf-c-console__actions > div {
12
+ .pf-v5-c-console__actions > div {
13
13
  margin-right: var(--pf-v5-global--spacer--sm);
14
14
  }
@@ -1,4 +1,4 @@
1
- .pf-c-console__desktop-viewer {
1
+ .pf-v5-c-console__desktop-viewer {
2
2
  grid-area: main;
3
3
  display: grid;
4
4
  gap: var(--pf-v5-global--spacer--md);
@@ -1,11 +1,11 @@
1
- .pf-c-console__serial {
1
+ .pf-v5-c-console__serial {
2
2
  grid-area: main;
3
3
  }
4
- .pf-c-console__actions-serial {
4
+ .pf-v5-c-console__actions-serial {
5
5
  grid-area: actions-extra;
6
6
  display: flex;
7
7
  justify-content: flex-end;
8
8
  }
9
- .pf-c-console__actions-serial > button {
9
+ .pf-v5-c-console__actions-serial > button {
10
10
  margin-right: var(--pf-v5-global--spacer--sm);
11
11
  }
@@ -1,7 +1,7 @@
1
- .pf-c-console__vnc {
1
+ .pf-v5-c-console__vnc {
2
2
  grid-area: main;
3
3
  }
4
- .pf-c-console__actions-vnc {
4
+ .pf-v5-c-console__actions-vnc {
5
5
  grid-area: actions-extra;
6
6
  display: flex;
7
7
  flex-wrap: wrap;
@@ -1,60 +1,60 @@
1
1
  :root {
2
- --pf-v5-global--Blue--50: #def3ff;
3
- --pf-v5-global--Blue--200: #7dc3e8;
2
+ --pf-v5-global--palette--blue-50: #def3ff;
3
+ --pf-v5-global--palette--blue-200: #7dc3e8;
4
4
  }
5
5
 
6
- tr.pf-c-table__editable-row:hover,
7
- tr.pf-c-table__editable-row.pf-m-editing {
8
- background: var(--pf-v5-global--Blue--50) !important;
6
+ tr.pf-v5-c-table__editable-row:hover,
7
+ tr.pf-v5-c-table__editable-row.pf-m-editing {
8
+ background: var(--pf-v5-global--palette--blue-50) !important;
9
9
  }
10
- tr.pf-c-table__editable-row:hover td,
11
- tr.pf-c-table__editable-row.pf-m-editing td {
12
- border-bottom: 1px solid var(--pf-v5-global--Blue--200) !important;
13
- border-top: 1px solid var(--pf-v5-global--Blue--200) !important;
10
+ tr.pf-v5-c-table__editable-row:hover td,
11
+ tr.pf-v5-c-table__editable-row.pf-m-editing td {
12
+ border-bottom: 1px solid var(--pf-v5-global--palette--blue-200) !important;
13
+ border-top: 1px solid var(--pf-v5-global--palette--blue-200) !important;
14
14
  }
15
- tr.pf-c-table__editable-row:hover td:first-child,
16
- tr.pf-c-table__editable-row.pf-m-editing td:first-child {
17
- border-left: 1px solid var(--pf-v5-global--Blue--200) !important;
15
+ tr.pf-v5-c-table__editable-row:hover td:first-child,
16
+ tr.pf-v5-c-table__editable-row.pf-m-editing td:first-child {
17
+ border-left: 1px solid var(--pf-v5-global--palette--blue-200) !important;
18
18
  }
19
- tr.pf-c-table__editable-row:hover td:last-child,
20
- tr.pf-c-table__editable-row.pf-m-editing td:last-child {
21
- border-right: 1px solid var(--pf-v5-global--Blue--200) !important;
19
+ tr.pf-v5-c-table__editable-row:hover td:last-child,
20
+ tr.pf-v5-c-table__editable-row.pf-m-editing td:last-child {
21
+ border-right: 1px solid var(--pf-v5-global--palette--blue-200) !important;
22
22
  }
23
- tr.pf-c-table__editable-row.pf-m-table-editing-first-row {
24
- border-top: 3px solid var(--pf-v5-global--Blue--200) !important;
23
+ tr.pf-v5-c-table__editable-row.pf-m-table-editing-first-row {
24
+ border-top: 3px solid var(--pf-v5-global--palette--blue-200) !important;
25
25
  }
26
- tr.pf-c-table__editable-row.pf-m-table-editing-last-row {
27
- border-bottom: 3px solid var(--pf-v5-global--Blue--200) !important;
26
+ tr.pf-v5-c-table__editable-row.pf-m-table-editing-last-row {
27
+ border-bottom: 3px solid var(--pf-v5-global--palette--blue-200) !important;
28
28
  }
29
- tr.pf-c-table__editable-row input {
29
+ tr.pf-v5-c-table__editable-row input {
30
30
  display: block;
31
31
  background: var(--pf-v5-global--BackgroundColor--100);
32
- border: 1px solid var(--pf-v5-global--BorderColor);
32
+ border: 1px solid var(--pf-v5-global--BorderColor--100);
33
33
  }
34
- tr.pf-c-table__editable-row input:hover {
34
+ tr.pf-v5-c-table__editable-row input:hover {
35
35
  cursor: text;
36
36
  }
37
37
 
38
- .pf-c-table__inline-edit-buttons {
38
+ .pf-v5-c-table__inline-edit-buttons {
39
39
  position: fixed;
40
40
  z-index: 1000;
41
41
  padding: 4px;
42
42
  margin: 0;
43
- background: var(--pf-v5-global--Blue--50);
44
- border: 1px solid var(--pf-v5-global--Blue--200);
43
+ background: var(--pf-v5-global--palette--blue-50);
44
+ border: 1px solid var(--pf-v5-global--palette--blue-200);
45
45
  }
46
- .pf-c-table__inline-edit-buttons.pf-m-top {
46
+ .pf-v5-c-table__inline-edit-buttons.pf-m-top {
47
47
  border-bottom: 0;
48
48
  }
49
- .pf-c-table__inline-edit-buttons.pf-m-bottom {
49
+ .pf-v5-c-table__inline-edit-buttons.pf-m-bottom {
50
50
  border-top: 0;
51
51
  }
52
- .pf-c-table__inline-edit-buttons.pf-m-bold {
52
+ .pf-v5-c-table__inline-edit-buttons.pf-m-bold {
53
53
  border-width: 3px;
54
54
  }
55
- .pf-c-table__inline-edit-buttons button {
55
+ .pf-v5-c-table__inline-edit-buttons button {
56
56
  margin-left: 4px;
57
57
  }
58
- .pf-c-table__inline-edit-buttons button:first-child {
58
+ .pf-v5-c-table__inline-edit-buttons button:first-child {
59
59
  margin-left: 0;
60
60
  }