@workday/canvas-kit-labs-css 14.0.0-alpha.1171-next.0 → 14.0.0-alpha.1176-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 (2) hide show
  1. package/ai-assistant-ingress-button.css +52 -37
  2. package/package.json +2 -2
package/ai-assistant-ingress-button.css CHANGED
@@ -1,4 +1,4 @@
1
- .cnvs-labs-ai-assistant-ingress-button {
1
+ .cnvs-labs-a-i-assistant-ingress-button {
2
2
  box-sizing: border-box;
3
3
  --cnvs-button-background: var(--cnvs-sys-color-bg-ai-strongest);
4
4
  border-radius: var(--cnvs-sys-shape-round);
@@ -7,114 +7,129 @@
7
7
  transition: box-shadow 300ms ease-out,background 300ms ease-out;
8
8
  }
9
9
 
10
- .cnvs-labs-ai-assistant-ingress-button .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
10
+ .cnvs-labs-a-i-assistant-ingress-button .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
11
11
  transition: fill 300ms ease-out;
12
12
  }
13
13
 
14
- .cnvs-labs-ai-assistant-ingress-button .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
14
+ .cnvs-labs-a-i-assistant-ingress-button .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
15
15
  transition: 300ms ease-out;
16
16
  stop-color: var(--cnvs-sys-color-fg-inverse);
17
17
  }
18
18
 
19
- .cnvs-labs-ai-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:first-child {
20
- stop-color: #FFA198;
19
+ .cnvs-labs-a-i-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:first-child {
20
+ stop-color: var(--cnvs-base-palette-red-200);
21
21
  }
22
22
 
23
- .cnvs-labs-ai-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(2) {
24
- stop-color: #FFCAA0;
23
+ .cnvs-labs-a-i-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(2) {
24
+ stop-color: var(--cnvs-base-palette-orange-200);
25
25
  }
26
26
 
27
- .cnvs-labs-ai-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(3) {
28
- stop-color: #FFCA79;
27
+ .cnvs-labs-a-i-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(3) {
28
+ stop-color: var(--cnvs-base-palette-orange-200);
29
29
  }
30
30
 
31
- .cnvs-labs-ai-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(4) {
32
- stop-color: #FDCA44;
31
+ .cnvs-labs-a-i-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(4) {
32
+ stop-color: var(--cnvs-base-palette-amber-200);
33
33
  }
34
34
 
35
- .cnvs-labs-ai-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(5) {
36
- stop-color: #FFB74D;
35
+ .cnvs-labs-a-i-assistant-ingress-button:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(5) {
36
+ stop-color: var(--cnvs-base-palette-amber-300);
37
37
  }
38
38
 
39
- .cnvs-labs-ai-assistant-ingress-button:disabled, .cnvs-labs-ai-assistant-ingress-button:disabled:active, .cnvs-labs-ai-assistant-ingress-button.disabled {
39
+ .cnvs-labs-a-i-assistant-ingress-button:disabled, .cnvs-labs-a-i-assistant-ingress-button:disabled:active, .cnvs-labs-a-i-assistant-ingress-button.disabled {
40
40
  opacity: var(--cnvs-sys-opacity-disabled);
41
41
  }
42
42
 
43
- .cnvs-labs-ai-assistant-ingress-button:is(:focus-visible, .focus):not(:disabled, .disabled) {
43
+ .cnvs-labs-a-i-assistant-ingress-button:is(:focus-visible, .focus):not(:disabled, .disabled) {
44
44
  box-shadow: 0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)),0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));
45
45
  }
46
46
 
47
47
 
48
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse {
48
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse {
49
49
  --cnvs-button-background: var(--cnvs-sys-color-bg-default);
50
50
  }
51
51
 
52
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
52
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
53
53
  transition: fill 300ms ease-out;
54
54
  }
55
55
 
56
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
56
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
57
57
  transition: 300ms ease-out;
58
58
  stop-color: var(--cnvs-sys-color-fg-ai);
59
59
  }
60
60
 
61
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:first-child {
62
- stop-color: #FFA198;
61
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:first-child {
62
+ stop-color: var(--cnvs-base-palette-red-200);
63
63
  }
64
64
 
65
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(2) {
66
- stop-color: #FFCAA0;
65
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(2) {
66
+ stop-color: var(--cnvs-base-palette-orange-200);
67
67
  }
68
68
 
69
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(3) {
70
- stop-color: #FFCA79;
69
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(3) {
70
+ stop-color: var(--cnvs-base-palette-orange-200);
71
71
  }
72
72
 
73
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(4) {
74
- stop-color: #FDCA44;
73
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(4) {
74
+ stop-color: var(--cnvs-base-palette-amber-200);
75
75
  }
76
76
 
77
- .cnvs-labs-ai-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(5) {
78
- stop-color: #FFB74D;
77
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:hover, .hover):not(:disabled, .disabled) .wd-icon-ai-assistant-ingress-button linearGradient>stop:nth-child(5) {
78
+ stop-color: var(--cnvs-base-palette-amber-300);
79
+ }
80
+
81
+ .cnvs-labs-a-i-assistant-ingress-button.variant-inverse:is(:focus-visible, .focus):not(:disabled, .disabled) {
82
+ box-shadow: 0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)),0 0 0 2px var(--cnvs-sys-color-fg-inverse);
83
+ border: 2px solid var(--cnvs-sys-color-border-ai);
79
84
  }
80
85
 
81
86
 
82
- .cnvs-labs-ai-assistant-ingress-button.toggled {
87
+ .cnvs-labs-a-i-assistant-ingress-button.toggled {
83
88
  --cnvs-button-background: var(--cnvs-sys-color-bg-default);
84
89
  transition: box-shadow 300ms ease-out,background 300ms ease-out;
85
- box-shadow: 0px 0px 4.9px 0px #FFC2FD,0px 0px 0.98px 0px #FFF3A8,0px 0px 1.96px 0px #FEC10B,0px 0px 2.94px 0px #FEC10B,0px 0px 4.9px 0px #FD7E00,0px 0px 7.36px 0px #FC5B05,0px 0px 9.81px 0px #FFC2FD,0px 0px 12.26px 0px rgba(255, 194, 253, 0.50);
90
+ box-shadow: 0px 0px 4.9px 0px var(--cnvs-base-palette-magenta-200),0px 0px 0.98px 0px var(--cnvs-base-palette-amber-100),0px 0px 1.96px 0px var(--cnvs-base-palette-amber-300),0px 0px 2.94px 0px var(--cnvs-base-palette-amber-300),0px 0px 4.9px 0px var(--cnvs-base-palette-orange-400),0px 0px 7.36px 0px var(--cnvs-base-palette-coral-500),0px 0px 9.81px 0px var(--cnvs-base-palette-magenta-200),0px 0px 12.26px 0px rgba(255, 194, 253, 0.50);
86
91
  }
87
92
 
88
- .cnvs-labs-ai-assistant-ingress-button.toggled .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
93
+ .cnvs-labs-a-i-assistant-ingress-button.toggled .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
89
94
  transition: fill 300ms ease-out;
90
95
  }
91
96
 
92
- .cnvs-labs-ai-assistant-ingress-button.toggled .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
97
+ .cnvs-labs-a-i-assistant-ingress-button.toggled .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
98
+ transition: 300ms ease-out;
99
+ stop-color: var(--cnvs-sys-color-fg-ai);
100
+ }
101
+
102
+ .cnvs-labs-a-i-assistant-ingress-button.toggled >linearGradient>stop {
93
103
  transition: 300ms ease-out;
94
104
  stop-color: var(--cnvs-sys-color-fg-ai);
95
105
  }
96
106
 
97
- .cnvs-labs-ai-assistant-ingress-button.toggled:is(:focus-visible, .focus):not(:disabled, .disabled) {
107
+ .cnvs-labs-a-i-assistant-ingress-button.toggled:is(:focus-visible, .focus):not(:disabled, .disabled) {
98
108
  box-shadow: 0 0 0 2px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)),0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));
99
109
  border: 1px solid var(--cnvs-sys-color-border-container);
100
110
  }
101
111
 
102
112
 
103
- .cnvs-labs-ai-assistant-ingress-button.toggled-false {
113
+ .cnvs-labs-a-i-assistant-ingress-button.toggled-false {
104
114
  transition: box-shadow 300ms ease-out,background 300ms ease-out;
105
115
  }
106
116
 
107
117
 
108
- .cnvs-labs-ai-assistant-ingress-button.toggled-true.variant-inverse {
118
+ .cnvs-labs-a-i-assistant-ingress-button.toggled.variant-inverse {
109
119
  --cnvs-button-background: var(--cnvs-sys-color-bg-ai-strongest);
110
120
  }
111
121
 
112
- .cnvs-labs-ai-assistant-ingress-button.toggled-true.variant-inverse .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
122
+ .cnvs-labs-a-i-assistant-ingress-button.toggled.variant-inverse .wd-icon-ai-assistant-ingress-button .wd-icon-fill {
113
123
  transition: fill 300ms ease-out;
114
124
  }
115
125
 
116
- .cnvs-labs-ai-assistant-ingress-button.toggled-true.variant-inverse .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
126
+ .cnvs-labs-a-i-assistant-ingress-button.toggled.variant-inverse .wd-icon-ai-assistant-ingress-button >linearGradient>stop {
117
127
  transition: 300ms ease-out;
118
128
  stop-color: var(--cnvs-sys-color-fg-inverse);
119
129
  }
120
130
 
131
+ .cnvs-labs-a-i-assistant-ingress-button.toggled.variant-inverse:is(:focus-visible, .focus):not(:disabled, .disabled) {
132
+ box-shadow: 0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)),0 0 0 2px var(--cnvs-sys-color-fg-inverse);
133
+ border: none;
134
+ }
135
+
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-labs-css",
3
- "version": "14.0.0-alpha.1171-next.0",
3
+ "version": "14.0.0-alpha.1176-next.0",
4
4
  "description": "The parent module that contains all Workday Canvas Kit Labs 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": "585934cc7f7bf81c6c86c75f7c3966368a3e1ca8"
28
+ "gitHead": "30279d7c3d004668196c395d1fc3050cc6e373c6"
29
29
  }