@patternfly/react-styles 5.0.0-alpha.6 → 5.0.0-alpha.8
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +12 -0
- package/css/components/Card/card.css +95 -29
- package/css/components/Card/card.d.ts +8 -1
- package/css/components/Card/card.js +8 -1
- package/css/components/Card/card.mjs +8 -1
- package/css/components/DataList/data-list.css +34 -29
- package/css/components/DataList/data-list.d.ts +1 -1
- package/css/components/DataList/data-list.js +1 -1
- package/css/components/DataList/data-list.mjs +1 -1
- package/css/components/Form/form.css +2 -0
- package/css/components/Spinner/spinner.css +0 -129
- package/css/components/Spinner/spinner.d.ts +1 -4
- package/css/components/Spinner/spinner.js +1 -4
- package/css/components/Spinner/spinner.mjs +1 -4
- package/css/components/Table/table.css +60 -63
- package/css/components/Table/table.d.ts +2 -2
- package/css/components/Table/table.js +2 -2
- package/css/components/Table/table.mjs +2 -2
- package/package.json +3 -3
- package/css/components/Topology/topology-components.css +0 -832
- package/css/components/Topology/topology-components.d.ts +0 -67
- package/css/components/Topology/topology-components.js +0 -68
- package/css/components/Topology/topology-components.mjs +0 -66
- package/css/components/Topology/topology-controlbar.css +0 -22
- package/css/components/Topology/topology-controlbar.d.ts +0 -11
- package/css/components/Topology/topology-controlbar.js +0 -12
- package/css/components/Topology/topology-controlbar.mjs +0 -10
- package/css/components/Topology/topology-pipelines.css +0 -554
- package/css/components/Topology/topology-pipelines.d.ts +0 -30
- package/css/components/Topology/topology-pipelines.js +0 -31
- package/css/components/Topology/topology-pipelines.mjs +0 -29
- package/css/components/Topology/topology-side-bar.css +0 -73
- package/css/components/Topology/topology-side-bar.d.ts +0 -14
- package/css/components/Topology/topology-side-bar.js +0 -15
- package/css/components/Topology/topology-side-bar.mjs +0 -13
- package/css/components/Topology/topology-view.css +0 -13
- package/css/components/Topology/topology-view.d.ts +0 -6
- package/css/components/Topology/topology-view.js +0 -7
- package/css/components/Topology/topology-view.mjs +0 -5
- package/src/css/components/Topology/topology-components.css +0 -832
- package/src/css/components/Topology/topology-controlbar.css +0 -22
- package/src/css/components/Topology/topology-pipelines.css +0 -554
- package/src/css/components/Topology/topology-side-bar.css +0 -73
- package/src/css/components/Topology/topology-view.css +0 -13
@@ -215,43 +215,43 @@
|
|
215
215
|
--pf-c-table--nested--first-last-child--PaddingRight: var(--pf-c-table--m-compact--cell--first-last-child--PaddingLeft);
|
216
216
|
--pf-c-table--nested--first-last-child--PaddingLeft: var(--pf-c-table--m-compact--cell--first-last-child--PaddingRight);
|
217
217
|
--pf-c-table__expandable-row--m-expanded--BorderBottomColor: var(--pf-global--BorderColor--100);
|
218
|
-
--pf-c-table--tr--m-
|
219
|
-
--pf-c-table--tr--m-
|
220
|
-
--pf-c-table--tr--m-
|
221
|
-
--pf-c-table--tr--m-
|
222
|
-
--pf-c-table--tr--m-
|
223
|
-
--pf-c-table--tr--m-
|
224
|
-
--pf-c-table--tr--m-
|
225
|
-
--pf-c-table--tr--m-
|
226
|
-
--pf-c-table--tr--m-
|
227
|
-
--pf-c-table--tr--m-
|
228
|
-
--pf-c-table--tr--m-
|
218
|
+
--pf-c-table--tr--m-clickable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
|
219
|
+
--pf-c-table--tr--m-clickable--BackgroundColor: transparent;
|
220
|
+
--pf-c-table--tr--m-clickable--BoxShadow: none;
|
221
|
+
--pf-c-table--tr--m-clickable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
|
222
|
+
--pf-c-table--tr--m-clickable--hover--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
223
|
+
--pf-c-table--tr--m-clickable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
224
|
+
--pf-c-table--tr--m-clickable--focus--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
225
|
+
--pf-c-table--tr--m-clickable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
226
|
+
--pf-c-table--tr--m-clickable--active--BoxShadow: var(--pf-c-table--tr--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
227
|
+
--pf-c-table--tr--m-clickable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
228
|
+
--pf-c-table--tr--m-clickable--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
|
229
229
|
--pf-c-table--tr--m-selected--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
|
230
230
|
--pf-c-table--tr--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
231
231
|
--pf-c-table--tr--m-selected--BoxShadow: var(--pf-c-table--tr--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
232
232
|
--pf-c-table--tr--m-selected--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
|
233
|
-
--pf-c-table--tr--m-selected--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
|
233
|
+
--pf-c-table--tr--m-selected--after--BorderLeftWidth: calc(2 * var(--pf-c-table__expandable-row--after--border-width--base));
|
234
234
|
--pf-c-table--tr--m-selected--after--BorderLeftColor: var(--pf-global--active-color--100);
|
235
235
|
--pf-c-table--tr--m-selected--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
|
236
236
|
--pf-c-table--tr--m-selected--hover--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
|
237
237
|
--pf-c-table--tr--m-selected--tr--m-selected--hover--BoxShadow: var(--pf-c-table--tr--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
238
|
-
--pf-c-table--tbody--m-
|
239
|
-
--pf-c-table--tbody--m-
|
240
|
-
--pf-c-table--tbody--m-
|
241
|
-
--pf-c-table--tbody--m-
|
242
|
-
--pf-c-table--tbody--m-
|
243
|
-
--pf-c-table--tbody--m-
|
244
|
-
--pf-c-table--tbody--m-
|
245
|
-
--pf-c-table--tbody--m-
|
246
|
-
--pf-c-table--tbody--m-
|
247
|
-
--pf-c-table--tbody--m-
|
248
|
-
--pf-c-table--tbody--m-
|
249
|
-
--pf-c-table--tbody--m-
|
238
|
+
--pf-c-table--tbody--m-clickable--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
|
239
|
+
--pf-c-table--tbody--m-clickable--BoxShadow: none;
|
240
|
+
--pf-c-table--tbody--m-clickable--BackgroundColor: transparent;
|
241
|
+
--pf-c-table--tbody--m-clickable--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
|
242
|
+
--pf-c-table--tbody--m-clickable--hover--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
243
|
+
--pf-c-table--tbody--m-clickable--hover--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
244
|
+
--pf-c-table--tbody--m-clickable--focus--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
245
|
+
--pf-c-table--tbody--m-clickable--focus--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
246
|
+
--pf-c-table--tbody--m-clickable--active--BoxShadow: var(--pf-c-table--tbody--m-clickable--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
247
|
+
--pf-c-table--tbody--m-clickable--active--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
248
|
+
--pf-c-table--tbody--m-clickable--m-expanded--BorderColor: var(--pf-global--active-color--400);
|
249
|
+
--pf-c-table--tbody--m-clickable--m-selected--hover--tr--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
|
250
250
|
--pf-c-table--tbody--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
251
251
|
--pf-c-table--tbody--m-selected--BoxShadow--top: var(--pf-c-table--tr--BoxShadow--top--base);
|
252
252
|
--pf-c-table--tbody--m-selected--BoxShadow: var(--pf-c-table--tbody--m-selected--BoxShadow--top), var(--pf-global--BoxShadow--sm-bottom);
|
253
253
|
--pf-c-table--tbody--m-selected--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
|
254
|
-
--pf-c-table--tbody--m-selected--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
|
254
|
+
--pf-c-table--tbody--m-selected--after--BorderLeftWidth: calc(2 * var(--pf-c-table__expandable-row--after--border-width--base));
|
255
255
|
--pf-c-table--tbody--m-selected--after--BorderLeftColor: var(--pf-global--active-color--100);
|
256
256
|
--pf-c-table--tbody--m-selected--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
|
257
257
|
--pf-c-table--tbody--m-selected--hover--tbody--m-selected--BoxShadow: var(--pf-global--BoxShadow--sm-bottom) inset, var(--pf-global--BoxShadow--sm-bottom);
|
@@ -448,6 +448,9 @@
|
|
448
448
|
margin-top: var(--pf-c-table__check--input--MarginTop);
|
449
449
|
vertical-align: top;
|
450
450
|
}
|
451
|
+
.pf-c-table tbody.pf-m-expanded > :first-child:not(.pf-c-table__control-row) {
|
452
|
+
border-bottom-width: 0;
|
453
|
+
}
|
451
454
|
.pf-c-table .pf-c-table__compound-expansion-toggle, .pf-c-table .pf-c-table__compound-expansion-toggle:first-child, .pf-c-table .pf-c-table__compound-expansion-toggle:last-child {
|
452
455
|
padding: 0;
|
453
456
|
}
|
@@ -507,26 +510,26 @@
|
|
507
510
|
.pf-c-table.pf-m-no-border-rows > tbody .pf-c-table__control-row > .pf-c-table__compound-expansion-toggle:first-child > ::before {
|
508
511
|
border-left-width: 0;
|
509
512
|
}
|
510
|
-
.pf-c-table tr.pf-m-
|
513
|
+
.pf-c-table tr.pf-m-clickable {
|
511
514
|
cursor: pointer;
|
512
|
-
background-color: var(--pf-c-table--tr--m-
|
513
|
-
outline-offset: var(--pf-c-table--tr--m-
|
514
|
-
box-shadow: var(--pf-c-table--tr--m-
|
515
|
+
background-color: var(--pf-c-table--tr--m-clickable--BackgroundColor);
|
516
|
+
outline-offset: var(--pf-c-table--tr--m-clickable--OutlineOffset);
|
517
|
+
box-shadow: var(--pf-c-table--tr--m-clickable--BoxShadow);
|
515
518
|
}
|
516
|
-
.pf-c-table tr.pf-m-
|
517
|
-
box-shadow: var(--pf-c-table--tr--m-
|
519
|
+
.pf-c-table tr.pf-m-clickable:hover:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-clickable:focus:not(.pf-m-selected) + tr.pf-m-selected, .pf-c-table tr.pf-m-clickable:active:not(.pf-m-selected) + tr.pf-m-selected {
|
520
|
+
box-shadow: var(--pf-c-table--tr--m-clickable--m-selected--BoxShadow);
|
518
521
|
}
|
519
|
-
.pf-c-table tr.pf-m-
|
520
|
-
--pf-c-table--tr--m-
|
521
|
-
--pf-c-table--tr--m-
|
522
|
+
.pf-c-table tr.pf-m-clickable:hover {
|
523
|
+
--pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--hover--BoxShadow);
|
524
|
+
--pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--hover--BackgroundColor);
|
522
525
|
}
|
523
|
-
.pf-c-table tr.pf-m-
|
524
|
-
--pf-c-table--tr--m-
|
525
|
-
--pf-c-table--tr--m-
|
526
|
+
.pf-c-table tr.pf-m-clickable:focus {
|
527
|
+
--pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--focus--BoxShadow);
|
528
|
+
--pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--focus--BackgroundColor);
|
526
529
|
}
|
527
|
-
.pf-c-table tr.pf-m-
|
528
|
-
--pf-c-table--tr--m-
|
529
|
-
--pf-c-table--tr--m-
|
530
|
+
.pf-c-table tr.pf-m-clickable:active {
|
531
|
+
--pf-c-table--tr--m-clickable--BoxShadow: var(--pf-c-table--tr--m-clickable--active--BoxShadow);
|
532
|
+
--pf-c-table--tr--m-clickable--BackgroundColor: var(--pf-c-table--tr--m-clickable--active--BackgroundColor);
|
530
533
|
}
|
531
534
|
.pf-c-table tr.pf-m-selected {
|
532
535
|
--pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table--tr--m-selected--after--BorderLeftWidth);
|
@@ -548,29 +551,29 @@
|
|
548
551
|
.pf-c-table tr.pf-m-first-cell-offset-reset {
|
549
552
|
--pf-c-table--cell--first-last-child--PaddingLeft: var(--pf-c-table--tr--m-first-cell-offset-reset--cell--PaddingLeft);
|
550
553
|
}
|
551
|
-
.pf-c-table tbody.pf-m-
|
554
|
+
.pf-c-table tbody.pf-m-clickable {
|
552
555
|
cursor: pointer;
|
553
|
-
background-color: var(--pf-c-table--tbody--m-
|
554
|
-
outline-offset: var(--pf-c-table--tbody--m-
|
555
|
-
box-shadow: var(--pf-c-table--tbody--m-
|
556
|
+
background-color: var(--pf-c-table--tbody--m-clickable--BackgroundColor);
|
557
|
+
outline-offset: var(--pf-c-table--tbody--m-clickable--OutlineOffset);
|
558
|
+
box-shadow: var(--pf-c-table--tbody--m-clickable--BoxShadow);
|
556
559
|
}
|
557
|
-
.pf-c-table tbody.pf-m-
|
558
|
-
--pf-c-table__expandable-row--after--BorderColor: var(--pf-c-table--tbody--m-
|
560
|
+
.pf-c-table tbody.pf-m-clickable.pf-m-expanded:not(.pf-m-selected) {
|
561
|
+
--pf-c-table__expandable-row--after--BorderColor: var(--pf-c-table--tbody--m-clickable--m-expanded--BorderColor);
|
559
562
|
}
|
560
|
-
.pf-c-table tbody.pf-m-
|
561
|
-
box-shadow: var(--pf-c-table--tbody--m-
|
563
|
+
.pf-c-table tbody.pf-m-clickable:hover:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-clickable:focus:not(.pf-m-selected) + tbody.pf-m-selected, .pf-c-table tbody.pf-m-clickable:active:not(.pf-m-selected) + tbody.pf-m-selected {
|
564
|
+
box-shadow: var(--pf-c-table--tbody--m-clickable--m-selected--hover--tr--BoxShadow);
|
562
565
|
}
|
563
|
-
.pf-c-table tbody.pf-m-
|
564
|
-
--pf-c-table--tbody--m-
|
565
|
-
--pf-c-table--tbody--m-
|
566
|
+
.pf-c-table tbody.pf-m-clickable:hover {
|
567
|
+
--pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--hover--BoxShadow);
|
568
|
+
--pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--hover--BackgroundColor);
|
566
569
|
}
|
567
|
-
.pf-c-table tbody.pf-m-
|
568
|
-
--pf-c-table--tbody--m-
|
569
|
-
--pf-c-table--tbody--m-
|
570
|
+
.pf-c-table tbody.pf-m-clickable:focus {
|
571
|
+
--pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--focus--BoxShadow);
|
572
|
+
--pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--focus--BackgroundColor);
|
570
573
|
}
|
571
|
-
.pf-c-table tbody.pf-m-
|
572
|
-
--pf-c-table--tbody--m-
|
573
|
-
--pf-c-table--tbody--m-
|
574
|
+
.pf-c-table tbody.pf-m-clickable:active {
|
575
|
+
--pf-c-table--tbody--m-clickable--BoxShadow: var(--pf-c-table--tbody--m-clickable--active--BoxShadow);
|
576
|
+
--pf-c-table--tbody--m-clickable--BackgroundColor: var(--pf-c-table--tbody--m-clickable--active--BackgroundColor);
|
574
577
|
}
|
575
578
|
.pf-c-table tbody.pf-m-selected {
|
576
579
|
--pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table--tbody--m-selected--after--BorderLeftWidth);
|
@@ -938,12 +941,6 @@
|
|
938
941
|
display: none;
|
939
942
|
}
|
940
943
|
|
941
|
-
.pf-c-table__compound-expansion-toggle.pf-m-expanded:first-child,
|
942
|
-
.pf-c-table__expandable-row.pf-m-expanded > :first-child,
|
943
|
-
.pf-c-table tbody.pf-m-expanded > tr > :not(.pf-c-table__compound-expansion-toggle) {
|
944
|
-
--pf-c-table__expandable-row--after--BorderLeftWidth: var(--pf-c-table__expandable-row--after--border-width--base);
|
945
|
-
}
|
946
|
-
|
947
944
|
.pf-c-table .pf-c-table tr > *:first-child {
|
948
945
|
--pf-c-table--cell--PaddingLeft: var(--pf-c-table--nested--first-last-child--PaddingLeft);
|
949
946
|
}
|
@@ -26,14 +26,14 @@ declare const _default: {
|
|
26
26
|
"favorite": "pf-m-favorite",
|
27
27
|
"borderRight": "pf-m-border-right",
|
28
28
|
"borderLeft": "pf-m-border-left",
|
29
|
+
"expanded": "pf-m-expanded",
|
29
30
|
"truncate": "pf-m-truncate",
|
30
31
|
"wrap": "pf-m-wrap",
|
31
32
|
"nowrap": "pf-m-nowrap",
|
32
33
|
"fitContent": "pf-m-fit-content",
|
33
34
|
"breakWord": "pf-m-break-word",
|
34
35
|
"noBorderRows": "pf-m-no-border-rows",
|
35
|
-
"
|
36
|
-
"hoverable": "pf-m-hoverable",
|
36
|
+
"clickable": "pf-m-clickable",
|
37
37
|
"selected": "pf-m-selected",
|
38
38
|
"firstCellOffsetReset": "pf-m-first-cell-offset-reset",
|
39
39
|
"dragOver": "pf-m-drag-over",
|
@@ -28,14 +28,14 @@ exports.default = {
|
|
28
28
|
"favorite": "pf-m-favorite",
|
29
29
|
"borderRight": "pf-m-border-right",
|
30
30
|
"borderLeft": "pf-m-border-left",
|
31
|
+
"expanded": "pf-m-expanded",
|
31
32
|
"truncate": "pf-m-truncate",
|
32
33
|
"wrap": "pf-m-wrap",
|
33
34
|
"nowrap": "pf-m-nowrap",
|
34
35
|
"fitContent": "pf-m-fit-content",
|
35
36
|
"breakWord": "pf-m-break-word",
|
36
37
|
"noBorderRows": "pf-m-no-border-rows",
|
37
|
-
"
|
38
|
-
"hoverable": "pf-m-hoverable",
|
38
|
+
"clickable": "pf-m-clickable",
|
39
39
|
"selected": "pf-m-selected",
|
40
40
|
"firstCellOffsetReset": "pf-m-first-cell-offset-reset",
|
41
41
|
"dragOver": "pf-m-drag-over",
|
@@ -26,14 +26,14 @@ export default {
|
|
26
26
|
"favorite": "pf-m-favorite",
|
27
27
|
"borderRight": "pf-m-border-right",
|
28
28
|
"borderLeft": "pf-m-border-left",
|
29
|
+
"expanded": "pf-m-expanded",
|
29
30
|
"truncate": "pf-m-truncate",
|
30
31
|
"wrap": "pf-m-wrap",
|
31
32
|
"nowrap": "pf-m-nowrap",
|
32
33
|
"fitContent": "pf-m-fit-content",
|
33
34
|
"breakWord": "pf-m-break-word",
|
34
35
|
"noBorderRows": "pf-m-no-border-rows",
|
35
|
-
"
|
36
|
-
"hoverable": "pf-m-hoverable",
|
36
|
+
"clickable": "pf-m-clickable",
|
37
37
|
"selected": "pf-m-selected",
|
38
38
|
"firstCellOffsetReset": "pf-m-first-cell-offset-reset",
|
39
39
|
"dragOver": "pf-m-drag-over",
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@patternfly/react-styles",
|
3
|
-
"version": "5.0.0-alpha.
|
3
|
+
"version": "5.0.0-alpha.8",
|
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": "5.0.0-alpha.
|
22
|
+
"@patternfly/patternfly": "5.0.0-alpha.41",
|
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.7.4"
|
30
30
|
},
|
31
31
|
"license": "MIT",
|
32
|
-
"gitHead": "
|
32
|
+
"gitHead": "d9ed9a48d6cd077867203e29d39218feb24d6dd2"
|
33
33
|
}
|