@workday/canvas-kit-css 14.0.0-alpha.1147-next.0 → 14.0.0-alpha.1148-next.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 (8) hide show
  1. package/badge.css +2 -2
  2. package/card.css +16 -5
  3. package/loading-dots.css +2 -2
  4. package/modal.css +3 -4
  5. package/package.json +2 -2
  6. package/popup.css +3 -5
  7. package/skeleton.css +2 -2
  8. package/tooltip.css +2 -2
package/badge.css CHANGED
@@ -1,4 +1,4 @@
1
- @keyframes animation-y2y83q {
1
+ @keyframes animation-fues3s {
2
2
  from {
3
3
  transform: scale(0.85);
4
4
  }
@@ -12,7 +12,7 @@
12
12
  .cnvs-count-badge {
13
13
  box-sizing: border-box;
14
14
  align-items: center;
15
- animation: animation-y2y83q 0.2s ease;
15
+ animation: animation-fues3s 0.2s ease;
16
16
  background: var(--cnvs-sys-color-static-red-default);
17
17
  border-radius: var(--cnvs-sys-shape-round);
18
18
  color: var(--cnvs-sys-color-text-inverse);
package/card.css CHANGED
@@ -1,9 +1,8 @@
1
1
  .cnvs-card-heading {
2
2
  box-sizing: border-box;
3
- color: var(--cnvs-sys-color-text-strong);
3
+ color: var(--cnvs-sys-color-fg-strong);
4
4
  font-weight: var(--cnvs-sys-font-weight-bold);
5
- margin-bottom: var(--cnvs-sys-space-x6);
6
- margin-top: var(--cnvs-sys-space-zero);
5
+ margin-block: var(--cnvs-sys-space-zero);
7
6
  }
8
7
 
9
8
 
@@ -14,10 +13,22 @@
14
13
 
15
14
  .cnvs-card {
16
15
  box-sizing: border-box;
17
- box-shadow: var(--cnvs-sys-depth-1);
16
+ display: flex;
17
+ flex-direction: column;
18
+ gap: var(--cnvs-sys-space-x6);
18
19
  padding: var(--cnvs-sys-space-x8);
19
20
  background-color: var(--cnvs-sys-color-bg-default);
20
- border: 0.0625rem solid var(--cnvs-sys-color-border-container);
21
21
  border-radius: var(--cnvs-sys-shape-x2);
22
+ border: 0.0625rem solid var(--cnvs-sys-color-border-container);
23
+ }
24
+
25
+
26
+ .cnvs-card.variant-borderless {
27
+ border-color: transparent;
28
+ }
29
+
30
+
31
+ .cnvs-card.variant-filled {
32
+ background-color: var(--cnvs-sys-color-bg-alt-soft);
22
33
  }
23
34
 
package/loading-dots.css CHANGED
@@ -1,4 +1,4 @@
1
- @keyframes animation-y2y86c {
1
+ @keyframes animation-fues6e {
2
2
  0%, 80%, 100% {
3
3
  transform: scale(0);
4
4
  }
@@ -26,7 +26,7 @@
26
26
  outline: 0.125rem solid transparent;
27
27
  transform: scale(0);
28
28
  display: inline-block;
29
- animation-name: animation-y2y86c;
29
+ animation-name: animation-fues6e;
30
30
  animation-duration: calc(var(--cnvs-loading-dots-animation-duration-ms) * 35);
31
31
  animation-iteration-count: infinite;
32
32
  animation-timing-function: ease-in-out;
package/modal.css CHANGED
@@ -1,4 +1,4 @@
1
- @keyframes animation-y2y86e {
1
+ @keyframes animation-fues6g {
2
2
  0% {
3
3
  background: none;
4
4
  }
@@ -18,7 +18,7 @@
18
18
  height: 100vh;
19
19
  background: var(--cnvs-sys-color-bg-overlay);
20
20
  animation-duration: 0.3s;
21
- animation-name: animation-y2y86e;
21
+ animation-name: animation-fues6g;
22
22
  }
23
23
 
24
24
  .wd-no-animation .cnvs-modal-overlay-container {
@@ -61,6 +61,7 @@
61
61
 
62
62
  @media screen and (max-width: 768px) {
63
63
  .cnvs-modal-card {
64
+ gap: var(--cnvs-sys-space-zero);
64
65
  margin: var(--cnvs-sys-space-x4);
65
66
  padding: var(--cnvs-sys-space-x4);
66
67
  border-radius: var(--cnvs-sys-space-x6);
@@ -76,7 +77,6 @@
76
77
 
77
78
  @media screen and (max-width: 768px) {
78
79
  .cnvs-modal-heading {
79
- margin-block-end: var(--cnvs-sys-space-zero);
80
80
  padding: var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x1);
81
81
  }
82
82
 
@@ -100,7 +100,6 @@
100
100
 
101
101
  @media screen and (max-width: 768px) {
102
102
  .cnvs-modal-body {
103
- margin-block-end: var(--cnvs-sys-space-zero);
104
103
  padding: var(--cnvs-sys-space-x1) var(--cnvs-sys-space-x2) var(--cnvs-sys-space-x2);
105
104
  }
106
105
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-css",
3
- "version": "14.0.0-alpha.1147-next.0",
3
+ "version": "14.0.0-alpha.1148-next.0",
4
4
  "description": "The parent module that contains all Workday Canvas Kit CSS components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -25,5 +25,5 @@
25
25
  "components",
26
26
  "workday"
27
27
  ],
28
- "gitHead": "de1260613697f1f525bc62614967f81521594356"
28
+ "gitHead": "17badcb6f4a0ecd0faa19e2d8fd7fa6241aa9393"
29
29
  }
package/popup.css CHANGED
@@ -3,7 +3,7 @@
3
3
  }
4
4
 
5
5
 
6
- @keyframes animation-y2y8y {
6
+ @keyframes animation-fues10 {
7
7
  0% {
8
8
  opacity: 1;
9
9
  transform: translate(var(--cnvs-translate-position-x), var(--cnvs-translate-position-y));
@@ -23,16 +23,15 @@
23
23
  line-height: var(--cnvs-sys-line-height-subtext-large);
24
24
  font-size: var(--cnvs-sys-font-size-subtext-large);
25
25
  letter-spacing: var(--cnvs-base-letter-spacing-150);
26
- display: flex;
27
26
  position: relative;
28
27
  max-width: calc(100vw - var(--cnvs-sys-space-x8));
29
- flex-direction: column;
28
+ gap: var(--cnvs-sys-space-x2);
30
29
  box-shadow: var(--cnvs-sys-depth-5);
31
30
  min-height: var(--cnvs-sys-space-zero);
32
31
  padding: var(--cnvs-sys-space-x6);
33
32
  max-height: var(--cnvs-popup-card-max-height);
34
33
  overflow-y: auto;
35
- animation-name: animation-y2y8y;
34
+ animation-name: animation-fues10;
36
35
  animation-duration: 150ms;
37
36
  animation-timing-function: ease-out;
38
37
  transform-origin: var(--cnvs-popup-card-transform-origin-vertical) var(--cnvs-popup-card-transform-origin-horizontal);
@@ -53,7 +52,6 @@
53
52
 
54
53
  .cnvs-popup-heading {
55
54
  box-sizing: border-box;
56
- margin-block-end: var(--cnvs-sys-space-x2);
57
55
  padding: var(--cnvs-sys-space-x2);
58
56
  }
59
57
 
package/skeleton.css CHANGED
@@ -36,7 +36,7 @@
36
36
  }
37
37
 
38
38
 
39
- @keyframes animation-y2y875 {
39
+ @keyframes animation-fues77 {
40
40
  from {
41
41
  opacity: 0.4;
42
42
  }
@@ -49,7 +49,7 @@
49
49
 
50
50
  .cnvs-skeleton {
51
51
  box-sizing: border-box;
52
- animation: animation-y2y875 0.8s linear infinite alternate;
52
+ animation: animation-fues77 0.8s linear infinite alternate;
53
53
  position: relative;
54
54
  overflow: hidden;
55
55
  height: 100%;
package/tooltip.css CHANGED
@@ -1,4 +1,4 @@
1
- @keyframes animation-y2y82v {
1
+ @keyframes animation-fues2x {
2
2
  0% {
3
3
  opacity: 0;
4
4
  transform: translate(var(--cnvs-tooltip-translate-position-x), var(--cnvs-tooltip-translate-position-y));
@@ -22,7 +22,7 @@
22
22
  position: relative;
23
23
  padding: var(--cnvs-sys-space-x3);
24
24
  color: var(--cnvs-sys-color-text-inverse);
25
- animation-name: animation-y2y82v;
25
+ animation-name: animation-fues2x;
26
26
  animation-duration: 150ms;
27
27
  animation-timing-function: ease-out;
28
28
  transform-origin: var(--cnvs-tooltip-container-tooltip-transform-origin-vertical) var(--cnvs-tooltip-container-tooltip-transform-origin-horizontal);