@ebay/skin 14.0.3 → 14.0.6

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/_cdn/skin/{v14.0.3 → v14.0.6}/skin-default.min.css +2 -2
  2. package/_cdn/skin/{v14.0.3 → v14.0.6}/skin-full.min.css +2 -2
  3. package/_cdn/skin/{v14.0.3 → v14.0.6}/skin-headless.min.css +2 -2
  4. package/_cdn/skin/{v14.0.3 → v14.0.6}/skin-legacy.min.css +2 -2
  5. package/dist/textbox/textbox.css +4 -4
  6. package/package.json +1 -1
  7. package/src/less/gh/gh-mixins.less +51 -55
  8. package/src/less/textbox/textbox.less +5 -5
package/dist/textbox/textbox.css CHANGED
@@ -64,7 +64,7 @@ textarea.textbox__control[disabled]:-ms-input-placeholder {
64
64
  }
65
65
  input.textbox__control[readonly],
66
66
  textarea.textbox__control[readonly] {
67
- color: var(--textbox-readonly-color, var(--color-foreground-ghost));
67
+ color: var(--textbox-readonly-color, var(--color-foreground-on-secondary));
68
68
  }
69
69
  input.textbox__control[aria-invalid="true"],
70
70
  textarea.textbox__control[aria-invalid="true"] {
@@ -75,17 +75,17 @@ input.textbox__control:focus,
75
75
  textarea.textbox__control:focus {
76
76
  border-color: var(--textbox-focus-border-color, var(--color-stroke-default));
77
77
  background-color: var(--textbox-focus-background-color, var(--color-background-primary));
78
- color: var(--textbox-focus-foreground-color, var(--color-foreground-secondary));
78
+ color: var(--textbox-focus-foreground-color, var(--color-foreground-on-secondary));
79
79
  outline: 0;
80
80
  }
81
81
  input.textbox__control::-webkit-input-placeholder,
82
82
  textarea.textbox__control::-webkit-input-placeholder {
83
- color: var(--textbox-placeholder-color, var(--color-foreground-secondary));
83
+ color: var(--textbox-placeholder-color, var(--color-foreground-on-secondary));
84
84
  font-weight: 200;
85
85
  }
86
86
  input.textbox__control:-ms-input-placeholder,
87
87
  textarea.textbox__control:-ms-input-placeholder {
88
- color: var(--textbox-placeholder-color, var(--color-foreground-secondary));
88
+ color: var(--textbox-placeholder-color, var(--color-foreground-on-secondary));
89
89
  font-weight: 200;
90
90
  }
91
91
  input.textbox__control::-ms-input-placeholder,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ebay/skin",
3
3
  "description": "Skin - CSS modules that represent the brand eBay",
4
- "version": "14.0.3",
4
+ "version": "14.0.6",
5
5
  "license": "MIT",
6
6
  "main": "./index.js",
7
7
  "maintainers": [
package/src/less/gh/gh-mixins.less CHANGED
@@ -1,207 +1,203 @@
1
1
  .alert-dialog-mixin() {
2
- @import "../../../../dist/alert-dialog/ds6/alert-dialog.css";
2
+ @import "../../../dist/alert-dialog/alert-dialog.css";
3
3
  }
4
4
 
5
5
  .badge-mixin() {
6
- @import "../../../../dist/badge/ds6/badge.css";
6
+ @import "../../../dist/badge/badge.css";
7
7
  }
8
8
 
9
9
  .breadcrumbs-mixin() {
10
- @import "../../../../dist/breadcrumbs/ds6/breadcrumbs.css";
10
+ @import "../../../dist/breadcrumbs/breadcrumbs.css";
11
11
  }
12
12
 
13
13
  .button-mixin() {
14
- @import "../../../../dist/button/ds6/button.css";
14
+ @import "../../../dist/button/button.css";
15
15
  }
16
16
 
17
17
  .carousel-mixin() {
18
- @import "../../../../dist/carousel/ds6/carousel.css";
18
+ @import "../../../dist/carousel/carousel.css";
19
19
  }
20
20
 
21
21
  .checkbox-mixin() {
22
- @import "../../../../dist/checkbox/ds6/checkbox.css";
23
- }
24
-
25
- .color-mixin() {
26
- @import "../../../../dist/color/ds6/color.css";
22
+ @import "../../../dist/checkbox/checkbox.css";
27
23
  }
28
24
 
29
25
  .combobox-mixin() {
30
- @import "../../../../dist/combobox/ds6/combobox.css";
26
+ @import "../../../dist/combobox/combobox.css";
31
27
  }
32
28
 
33
29
  .confirm-dialog-mixin() {
34
- @import "../../../../dist/confirm-dialog/ds6/confirm-dialog.css";
30
+ @import "../../../dist/confirm-dialog/confirm-dialog.css";
35
31
  }
36
32
 
37
33
  .cta-button-mixin() {
38
- @import "../../../../dist/cta-button/ds6/cta-button.css";
34
+ @import "../../../dist/cta-button/cta-button.css";
39
35
  }
40
36
 
41
37
  .drawer-dialog-mixin() {
42
- @import "../../../../dist/drawer-dialog/ds6/drawer-dialog.css";
38
+ @import "../../../dist/drawer-dialog/drawer-dialog.css";
43
39
  }
44
40
 
45
41
  .eek-mixin() {
46
- @import "../../../../dist/eek/ds6/eek.css";
42
+ @import "../../../dist/eek/eek.css";
47
43
  }
48
44
 
49
45
  .expand-button-mixin() {
50
- @import "../../../../dist/expand-button/ds6/expand-button.css";
46
+ @import "../../../dist/expand-button/expand-button.css";
51
47
  }
52
48
 
53
49
  .field-mixin() {
54
- @import "../../../../dist/field/ds6/field.css";
50
+ @import "../../../dist/field/field.css";
55
51
  }
56
52
 
57
53
  .filter-button-mixin() {
58
- @import "../../../../dist/filter-button/ds6/filter-button.css";
54
+ @import "../../../dist/filter-button/filter-button.css";
59
55
  }
60
56
 
61
57
  .filter-menu-mixin() {
62
- @import "../../../../dist/filter-menu/ds6/filter-menu.css";
58
+ @import "../../../dist/filter-menu/filter-menu.css";
63
59
  }
64
60
 
65
61
  .filter-menu-button-mixin() {
66
- @import "../../../../dist/filter-menu-button/ds6/filter-menu-button.css";
62
+ @import "../../../dist/filter-menu-button/filter-menu-button.css";
67
63
  }
68
64
 
69
65
  .floating-label-mixin() {
70
- @import "../../../../dist/floating-label/ds6/floating-label.css";
66
+ @import "../../../dist/floating-label/floating-label.css";
71
67
  }
72
68
 
73
69
  .fullscreen-dialog-mixin() {
74
- @import "../../../../dist/fullscreen-dialog/ds6/fullscreen-dialog.css";
70
+ @import "../../../dist/fullscreen-dialog/fullscreen-dialog.css";
75
71
  }
76
72
 
77
73
  .global-mixin() {
78
- @import "../../../../dist/global/ds6/global.css";
74
+ @import "../../../dist/global/global.css";
79
75
  }
80
76
 
81
77
  .icon-mixin() {
82
- @import "../../../../dist/icon/ds6/icon.css";
78
+ @import "../../../dist/icon/icon.css";
83
79
  }
84
80
 
85
81
  .icon-button-mixin() {
86
- @import "../../../../dist/icon-button/ds6/icon-button.css";
82
+ @import "../../../dist/icon-button/icon-button.css";
87
83
  }
88
84
 
89
85
  .infotip-mixin() {
90
- @import "../../../../dist/infotip/ds6/infotip.css";
86
+ @import "../../../dist/infotip/infotip.css";
91
87
  }
92
88
 
93
89
  .inline-notice-mixin() {
94
- @import "../../../../dist/inline-notice/ds6/inline-notice.css";
90
+ @import "../../../dist/inline-notice/inline-notice.css";
95
91
  }
96
92
 
97
93
  .lightbox-dialog-mixin() {
98
- @import "../../../../dist/lightbox-dialog/ds6/lightbox-dialog.css";
94
+ @import "../../../dist/lightbox-dialog/lightbox-dialog.css";
99
95
  }
100
96
 
101
97
  .link-mixin() {
102
- @import "../../../../dist/link/ds6/link.css";
98
+ @import "../../../dist/link/link.css";
103
99
  }
104
100
 
105
101
  .listbox-mixin() {
106
- @import "../../../../dist/listbox/ds6/listbox.css";
102
+ @import "../../../dist/listbox/listbox.css";
107
103
  }
108
104
 
109
105
  .listbox-button-mixin() {
110
- @import "../../../../dist/listbox-button/ds6/listbox-button.css";
106
+ @import "../../../dist/listbox-button/listbox-button.css";
111
107
  }
112
108
 
113
109
  .menu-mixin() {
114
- @import "../../../../dist/menu/ds6/menu.css";
110
+ @import "../../../dist/menu/menu.css";
115
111
  }
116
112
 
117
113
  .menu-button-mixin() {
118
- @import "../../../../dist/menu-button/ds6/menu-button.css";
114
+ @import "../../../dist/menu-button/menu-button.css";
119
115
  }
120
116
 
121
117
  .page-grid-mixin() {
122
- @import "../../../../dist/page-grid/ds6/page-grid.css";
118
+ @import "../../../dist/page-grid/page-grid.css";
123
119
  }
124
120
 
125
121
  .page-notice-mixin() {
126
- @import "../../../../dist/page-notice/ds6/page-notice.css";
122
+ @import "../../../dist/page-notice/page-notice.css";
127
123
  }
128
124
 
129
125
  .pagination-mixin() {
130
- @import "../../../../dist/pagination/ds6/pagination.css";
126
+ @import "../../../dist/pagination/pagination.css";
131
127
  }
132
128
 
133
129
  .panel-dialog-mixin() {
134
- @import "../../../../dist/panel-dialog/ds6/panel-dialog.css";
130
+ @import "../../../dist/panel-dialog/panel-dialog.css";
135
131
  }
136
132
 
137
133
  .progress-bar-mixin() {
138
- @import "../../../../dist/progress-bar/ds6/progress-bar.css";
134
+ @import "../../../dist/progress-bar/progress-bar.css";
139
135
  }
140
136
 
141
137
  .progress-spinner-mixin() {
142
- @import "../../../../dist/progress-spinner/ds6/progress-spinner.css";
138
+ @import "../../../dist/progress-spinner/progress-spinner.css";
143
139
  }
144
140
 
145
141
  .progress-stepper-mixin() {
146
- @import "../../../../dist/progress-stepper/ds6/progress-stepper.css";
142
+ @import "../../../dist/progress-stepper/progress-stepper.css";
147
143
  }
148
144
 
149
145
  .radio-mixin() {
150
- @import "../../../../dist/radio/ds6/radio.css";
146
+ @import "../../../dist/radio/radio.css";
151
147
  }
152
148
 
153
149
  .section-notice-mixin() {
154
- @import "../../../../dist/section-notice/ds6/section-notice.css";
150
+ @import "../../../dist/section-notice/section-notice.css";
155
151
  }
156
152
 
157
153
  .section-title-mixin() {
158
- @import "../../../../dist/section-title/ds6/section-title.css";
154
+ @import "../../../dist/section-title/section-title.css";
159
155
  }
160
156
 
161
157
  .select-mixin() {
162
- @import "../../../../dist/select/ds6/select.css";
158
+ @import "../../../dist/select/select.css";
163
159
  }
164
160
 
165
161
  .signal-mixin() {
166
- @import "../../../../dist/signal/ds6/signal.css";
162
+ @import "../../../dist/signal/signal.css";
167
163
  }
168
164
 
169
165
  .snackbar-dialog-mixin() {
170
- @import "../../../../dist/snackbar-dialog/ds6/snackbar-dialog.css";
166
+ @import "../../../dist/snackbar-dialog/snackbar-dialog.css";
171
167
  }
172
168
 
173
169
  .switch-mixin() {
174
- @import "../../../../dist/switch/ds6/switch.css";
170
+ @import "../../../dist/switch/switch.css";
175
171
  }
176
172
 
177
173
  .tabs-mixin() {
178
- @import "../../../../dist/tabs/ds6/tabs.css";
174
+ @import "../../../dist/tabs/tabs.css";
179
175
  }
180
176
 
181
177
  .textbox-mixin() {
182
- @import "../../../../dist/textbox/ds6/textbox.css";
178
+ @import "../../../dist/textbox/textbox.css";
183
179
  }
184
180
 
185
181
  .toast-dialog-mixin() {
186
- @import "../../../../dist/toast-dialog/ds6/toast-dialog.css";
182
+ @import "../../../dist/toast-dialog/toast-dialog.css";
187
183
  }
188
184
 
189
185
  .tooltip-mixin() {
190
- @import "../../../../dist/tooltip/ds6/tooltip.css";
186
+ @import "../../../dist/tooltip/tooltip.css";
191
187
  }
192
188
 
193
189
  .tourtip-mixin() {
194
- @import "../../../../dist/tourtip/ds6/tourtip.css";
190
+ @import "../../../dist/tourtip/tourtip.css";
195
191
  }
196
192
 
197
193
  .typography-mixin() {
198
- @import "../../../../dist/typography/ds6/typography.css";
194
+ @import "../../../dist/typography/typography.css";
199
195
  }
200
196
 
201
197
  .utility-mixin() {
202
- @import "../../../../dist/utility/ds6/utility.css";
198
+ @import "../../../dist/utility/utility.css";
203
199
  }
204
200
 
205
201
  .window-notice-mixin() {
206
- @import "../../../../dist/window-notice/ds6/window-notice.css";
202
+ @import "../../../dist/window-notice/window-notice.css";
207
203
  }
package/src/less/textbox/textbox.less CHANGED
@@ -69,7 +69,7 @@ textarea.textbox__control {
69
69
  }
70
70
 
71
71
  &[readonly] {
72
- .color-token(textbox-readonly-color, color-foreground-ghost);
72
+ .color-token(textbox-readonly-color, color-foreground-on-secondary);
73
73
  }
74
74
 
75
75
  &[aria-invalid="true"] {
@@ -80,22 +80,22 @@ textarea.textbox__control {
80
80
  &:focus {
81
81
  .border-color-token(textbox-focus-border-color, color-stroke-default);
82
82
  .background-color-token(textbox-focus-background-color, color-background-primary);
83
- .color-token(textbox-focus-foreground-color, color-foreground-secondary);
83
+ .color-token(textbox-focus-foreground-color, color-foreground-on-secondary);
84
84
  outline: 0;
85
85
  }
86
86
 
87
87
  &::-webkit-input-placeholder {
88
- .color-token(textbox-placeholder-color, color-foreground-secondary);
88
+ .color-token(textbox-placeholder-color, color-foreground-on-secondary);
89
89
  font-weight: 200;
90
90
  }
91
91
 
92
92
  &::-moz-placeholder {
93
- .color-token(textbox-placeholder-color, color-foreground-secondary);
93
+ .color-token(textbox-placeholder-color, color-foreground-on-secondary);
94
94
  font-weight: 200;
95
95
  }
96
96
 
97
97
  &:-ms-input-placeholder {
98
- .color-token(textbox-placeholder-color, color-foreground-secondary);
98
+ .color-token(textbox-placeholder-color, color-foreground-on-secondary);
99
99
  font-weight: 200;
100
100
  }
101
101